diff --git a/README.md b/README.md index c807ae1..aeb2df1 100644 --- a/README.md +++ b/README.md @@ -1,60 +1,43 @@ -## GuideView +# GuideView 新手引导视图，初次打开页面时显示的引导性图文 -##功能简介 -*GuideView*能通过获取targetView的坐标和大小，动态的绘图，来高亮显示targetView 。targetView可以用圆形或者矩形圈出， -其他区域设置自定义的背景色。确定targetView之后，可以在targetView的上下左右以及左上、左下、右上、右下等八个区域添加一个说明性的 -tipsView，可以是带有引导语的ImageView，也可以是带文字的TextView等。*GuideView*同样可以用于引导ListView里的某一项。 - 注意，showOnce()会将targetView的id存入SP，用户需保证targetView的id的唯一性。如果targetView没有ID，可以用setTag替代。 - 如过targetView为ListView的某一item，需用户自行保证*GuideView*只被显示一次。因为item可能没有ID，setTag方法会和Adapter.getView里的convertView的 - setTag()冲突。 - 另外，同一个项目里，两个View，如果设置的id重名了，比如两个不相关的Activity里的TextView都设置了android:id="@+id/tv_title"，那他们的ID也是一样的。 - 如果他们同时都需要使用*GuideView*引导，而且，都设置了显示一次showOnce，那么其中一个显示过之后，另一个就不在显示。 +# 使用方式 -![image](https://github.com/laxian/GuideView/blob/develop/sample/app.gif) +1. 添加依赖 -#gradle引用 - compile 'com.zhouweixian.guideview:guideview:1.0.0' - - -##使用图片提示 - -``` - ImageView iv = new ImageView(this); - iv.setImageResource(R.drawable.img_new_task_guide); - RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams( - ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT); - iv.setLayoutParams(params); -``` - - -##使用文字提示 - -``` - TextView iv = new TextView(this); - iv.setText("欢迎使用"); - iv.setTextColor(getResources().getColor(R.color.white)); -``` - - -##显示GuideView + `compile 'com.zhouweixian.guideview:guideview:1.0.1'` + +2. ``` - new GuideView.Builder(getContext()) - .setTargetView(view) // 必须调用，设置需要Guide的View - .setCustomTipsView(iv) // 必须调用，设置GuideView - // 设置GuideView 相对于TargetView的位置，默认在屏幕左上角 - .setDirction(GuideView.Direction.LEFT_BOTTOM) - // 设置背景颜色，默认透明 - .setBackGround(getResources().getColor(R.color.shadow)) - .setExitOnclick(null) // 设置点击消失，可以传入一个Callback，执行被点击后的操作 - .setRadius(32) // 设置圆形透明区域半径，默认是targetView的显示矩形的半径 - .setCenter(300, 300) // 设置圆心，默认是targetView的中心 - .drawRec() // 设置画矩形，默认是圆形 - .setOffset(200, 60) // 设置偏移，一般用于微调GuideView的位置 - .showOnce() // 设置首次显示，设置后，显示一次后，不再显示 - .build() // 必须调用，Buider模式，返回GuideView实例 - .show(); // 必须调用，显示GuideView + guideView = new GuideView.Builder(this) + .target(menu) + .guide(R.layout.guide_iv) + .direction(GuideView.Direction.LEFT_BOTTOM) + .bgcolor(ContextCompat.getColor(this, R.color.shadow)) + .build(); + + guideView2 = new GuideView.Builder(this) + .target(btnTest) + .guide(R.layout.guide_tv) + .direction(GuideView.Direction.LEFT_BOTTOM) + .bgcolor(ContextCompat.getColor(this, R.color.shadow)) + .drawRect() + .after(guideView) + .build(); + + guideView3 = new GuideView.Builder(this) + .target(btnTest2) + .guide(R.layout.guide_custom) + .direction(GuideView.Direction.LEFT) + .offset(-10, 0) + .bgcolor(ContextCompat.getColor(this, R.color.shadow)) + .after(guideView2) + .exitOnClick(true) + .build(); + guideView.show(); ``` +# 效果预览 +![image](https://github.com/laxian/GuideView/blob/develop/sample/app.gif) \ No newline at end of file diff --git a/build.gradle b/build.gradle index 030560d..ca7a921 100644 --- a/build.gradle +++ b/build.gradle @@ -3,9 +3,10 @@ buildscript { repositories { jcenter() + maven { url 'https://dl.google.com/dl/android/maven2/' } } dependencies { - classpath 'com.android.tools.build:gradle:2.3.0-beta2' + classpath 'com.android.tools.build:gradle:3.0.0-alpha6' classpath 'com.jfrog.bintray.gradle:gradle-bintray-plugin:1.4' classpath 'com.github.dcendents:android-maven-gradle-plugin:1.4.1' diff --git a/gradle/wrapper/gradle-wrapper.properties b/gradle/wrapper/gradle-wrapper.properties index 9a778d6..b0bb9c7 100644 --- a/gradle/wrapper/gradle-wrapper.properties +++ b/gradle/wrapper/gradle-wrapper.properties @@ -1,6 +1,6 @@ -#Mon Dec 28 10:00:20 PST 2015 +#Wed Jul 12 10:17:24 CST 2017 distributionBase=GRADLE_USER_HOME distributionPath=wrapper/dists zipStoreBase=GRADLE_USER_HOME zipStorePath=wrapper/dists -distributionUrl=https\://services.gradle.org/distributions/gradle-3.3-all.zip +distributionUrl=https\://services.gradle.org/distributions/gradle-4.1-milestone-1-all.zip diff --git a/guideview/build.gradle b/guideview/build.gradle index 1177b28..c5335ba 100644 --- a/guideview/build.gradle +++ b/guideview/build.gradle @@ -2,13 +2,13 @@ apply plugin: 'com.android.library' android { compileSdkVersion 25 - buildToolsVersion "25.0.2" + buildToolsVersion "25.0.3" defaultConfig { minSdkVersion 16 targetSdkVersion 25 - versionCode 1 - versionName "1.0" + versionCode 2 + versionName "1.0.1" testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" @@ -19,6 +19,9 @@ android { proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } + lintOptions { + abortOnError false + } } dependencies { @@ -29,5 +32,26 @@ dependencies { testCompile 'junit:junit:4.12' } + + +buildscript { + repositories { + jcenter() + } + dependencies { + classpath 'com.novoda:bintray-release:0.5.0' + } +} + + //配置插件 -apply from: './bintray.gradle' \ No newline at end of file +apply plugin: 'com.novoda.bintray-release' + +publish { + userOrg = 'laxian2010' + groupId = 'com.zhouweixian' + artifactId = rootProject.name + version = '1.0.1' + description = '新手引导视图' + website = "https://github.com/laxian/${rootProject} + '/' + ${rootProject.name}" +} \ No newline at end of file diff --git a/guideview/src/main/java/com/zhouweixian/GuideView.java b/guideview/src/main/java/com/zhouweixian/GuideView.java index b9f8006..e4c7d8c 100644 --- a/guideview/src/main/java/com/zhouweixian/GuideView.java +++ b/guideview/src/main/java/com/zhouweixian/GuideView.java @@ -10,6 +10,7 @@ import android.graphics.Rect; import android.util.Log; import android.view.Gravity; +import android.view.LayoutInflater; import android.view.View; import android.view.ViewTreeObserver; import android.widget.FrameLayout; @@ -17,6 +18,9 @@ import com.zhouweixian.library.R; +import java.util.ArrayList; +import java.util.List; + /** * Created by zhouweixian on 2016/1/23 */ @@ -88,8 +92,7 @@ public class GuideView extends RelativeLayout implements ViewTreeObserver.OnGlob */ private int[] location; private boolean onClickExit; - private OnClickCallback onclickListener; - private RelativeLayout guideViewLayout; + private List onclickListeners = new ArrayList<>(); private boolean mShowOnce; private android.graphics.Rect mTargetViewRect; private boolean mDrawRect; @@ -389,8 +392,8 @@ public void setOnClickExit(boolean onClickExit) { this.onClickExit = onClickExit; } - public void setOnclickListener(OnClickCallback onclickListener) { - this.onclickListener = onclickListener; + public void addOnclickListener(OnClickCallback onclickListener) { + this.onclickListeners.add(onclickListener); } private void setClickInfo() { @@ -398,8 +401,10 @@ private void setClickInfo() { setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { - if (onclickListener != null) { - onclickListener.onClickedGuideView(); + if (onclickListeners != null && onclickListeners.size() > 0) { + for (OnClickCallback listener : onclickListeners) { + listener.onClicked(); + } } if (exit) { hide(); @@ -452,76 +457,93 @@ public enum Direction { * GuideView点击Callback */ public interface OnClickCallback { - void onClickedGuideView(); + void onClicked(); } public static class Builder { - GuideView guiderView; + GuideView guideView; Context mContext; public Builder(Context ctx) { mContext = ctx; - guiderView = new GuideView(mContext); + guideView = new GuideView(mContext); + } + + public Builder target(View target) { + guideView.setTargetView(target); + return this; } - public Builder setTargetView(View target) { - guiderView.setTargetView(target); + public Builder guide(View view) { + guideView.setCustomGuideView(view); return this; } - public Builder setBgColor(int color) { - guiderView.setBgColor(color); + public Builder guide(int viewId) { + View view = LayoutInflater.from(mContext).inflate(viewId, null); + guideView.setCustomGuideView(view); return this; } - public Builder setDirction(Direction dir) { - guiderView.setDirection(dir); + public Builder bgcolor(int color) { + guideView.setBgColor(color); return this; } - public Builder setDrawRec() { - guiderView.setDrawRect(); + public Builder direction(Direction dir) { + guideView.setDirection(dir); return this; } - public Builder setOffset(int x, int y) { - guiderView.setOffsetX(x); - guiderView.setOffsetY(y); + public Builder drawRect() { + guideView.setDrawRect(); return this; } - public Builder setRadius(int radius) { - guiderView.setRadius(radius); + public Builder offset(int x, int y) { + guideView.setOffsetX(x); + guideView.setOffsetY(y); return this; } - public Builder setCustomGuideView(View view) { - guiderView.setCustomGuideView(view); + public Builder radius(int radius) { + guideView.setRadius(radius); return this; } - public Builder setCenter(int X, int Y) { - guiderView.setCenter(new int[]{X, Y}); + public Builder center(int X, int Y) { + guideView.setCenter(new int[]{X, Y}); return this; } public Builder showOnce() { - guiderView.showOnce(); + guideView.showOnce(); return this; } public GuideView build() { - guiderView.setClickInfo(); - return guiderView; + guideView.setClickInfo(); + return guideView; } - public Builder setOnclickExit(boolean onclickExit) { - guiderView.setOnClickExit(onclickExit); + public Builder exitOnClick(boolean onclickExit) { + guideView.setOnClickExit(onclickExit); return this; } - public Builder setOnclickListener(final OnClickCallback callback) { - guiderView.setOnclickListener(callback); + public Builder onclick(final OnClickCallback callback) { + guideView.addOnclickListener(callback); + return this; + } + + public Builder after(final GuideView preView) { + preView.addOnclickListener(new OnClickCallback() { + @Override + public void onClicked() { + preView.hide(); + guideView.show(); + } + }); return this; } } diff --git a/sample/app.gif b/sample/app.gif index 6aafda8..8259fda 100644 Binary files a/sample/app.gif and b/sample/app.gif differ diff --git a/sample/build.gradle b/sample/build.gradle index db7a7e6..e1571e8 100644 --- a/sample/build.gradle +++ b/sample/build.gradle @@ -18,6 +18,9 @@ android { } productFlavors { } + lintOptions { + abortOnError false + } } dependencies { diff --git a/sample/src/main/java/com/zhouweixian/guideview/MainActivity.java b/sample/src/main/java/com/zhouweixian/guideview/MainActivity.java index 91e5c4c..d81f477 100644 --- a/sample/src/main/java/com/zhouweixian/guideview/MainActivity.java +++ b/sample/src/main/java/com/zhouweixian/guideview/MainActivity.java @@ -4,6 +4,8 @@ import android.support.v4.content.ContextCompat; import android.support.v7.app.AppCompatActivity; import android.view.Gravity; +import android.view.LayoutInflater; +import android.view.View; import android.view.ViewGroup; import android.widget.Button; import android.widget.ImageButton; @@ -36,70 +38,30 @@ protected void onCreate(Bundle savedInstanceState) { private void setGuideView() { - // 使用图片 - final ImageView iv = new ImageView(this); - iv.setImageResource(R.drawable.img_new_task_guide); - RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT); - iv.setLayoutParams(params); - - // 使用文字 - TextView tv = new TextView(this); - tv.setText("欢迎使用"); - tv.setTextColor(ContextCompat.getColor(this, R.color.white)); - tv.setTextSize(30); - tv.setGravity(Gravity.CENTER); - - // 使用文字 - final TextView tv2 = new TextView(this); - tv2.setText("欢迎使用2"); - tv2.setTextColor(ContextCompat.getColor(this, R.color.white)); - tv2.setTextSize(30); - tv2.setGravity(Gravity.CENTER); - - guideView = new GuideView.Builder(this) - .setTargetView(menu) - .setCustomGuideView(iv) - .setDirction(GuideView.Direction.LEFT_BOTTOM) - .setBgColor(ContextCompat.getColor(this, R.color.shadow)) - .setOnclickListener(new GuideView.OnClickCallback() { - @Override - public void onClickedGuideView() { - guideView.hide(); - guideView2.show(); - } - }) + .target(menu) + .guide(R.layout.guide_iv) + .direction(GuideView.Direction.LEFT_BOTTOM) + .bgcolor(ContextCompat.getColor(this, R.color.shadow)) .build(); - guideView2 = new GuideView.Builder(this) - .setTargetView(btnTest) - .setCustomGuideView(tv) - .setDirction(GuideView.Direction.LEFT_BOTTOM) - .setBgColor(ContextCompat.getColor(this, R.color.shadow)) - .setDrawRec() - .setOnclickListener(new GuideView.OnClickCallback() { - @Override - public void onClickedGuideView() { - guideView2.hide(); - guideView3.show(); - } - }) + .target(btnTest) + .guide(R.layout.guide_tv) + .direction(GuideView.Direction.LEFT_BOTTOM) + .bgcolor(ContextCompat.getColor(this, R.color.shadow)) + .drawRect() + .after(guideView) .build(); - guideView3 = new GuideView.Builder(this) - .setTargetView(btnTest2) - .setCustomGuideView(tv2) - .setDirction(GuideView.Direction.LEFT_BOTTOM) - .setBgColor(ContextCompat.getColor(this, R.color.shadow)) - .setOnclickListener(new GuideView.OnClickCallback() { - @Override - public void onClickedGuideView() { - guideView3.hide(); - guideView.show(); - } - }) + .target(btnTest2) + .guide(R.layout.guide_custom) + .direction(GuideView.Direction.LEFT) + .offset(-10, 0) + .bgcolor(ContextCompat.getColor(this, R.color.shadow)) + .after(guideView2) + .exitOnClick(true) .build(); guideView.show(); } diff --git a/sample/src/main/res/layout/guide_custom.xml b/sample/src/main/res/layout/guide_custom.xml new file mode 100644 index 0000000..8b7d254 --- /dev/null +++ b/sample/src/main/res/layout/guide_custom.xml @@ -0,0 +1,20 @@ + + + + + + + + \ No newline at end of file diff --git a/sample/src/main/res/layout/guide_iv.xml b/sample/src/main/res/layout/guide_iv.xml new file mode 100644 index 0000000..2011120 --- /dev/null +++ b/sample/src/main/res/layout/guide_iv.xml @@ -0,0 +1,5 @@ + + \ No newline at end of file diff --git a/sample/src/main/res/layout/guide_tv.xml b/sample/src/main/res/layout/guide_tv.xml new file mode 100644 index 0000000..aa1e160 --- /dev/null +++ b/sample/src/main/res/layout/guide_tv.xml @@ -0,0 +1,6 @@ + + \ No newline at end of file