# guideView

**Repository Path**: noteplus/guideView

## Basic Information

- **Project Name**: guideView
- **Description**: 引导
- **Primary Language**: Android
- **License**: GPL-3.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-01-10
- **Last Updated**: 2025-01-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: 引导页, 引导视图

## README

## 效果图
  ![](https://images.gitee.com/uploads/images/2019/0806/145419_c5ce617d_1951678.gif "基本几何图形高亮区")<br>
  ![](https://images.gitee.com/uploads/images/2019/0806/145222_ade564b4_1951678.gif "控件本身形状高亮区")
## 添加依赖
```
allprojects {
    repositories {
        ....
        maven {url "https://jitpack.io"}
    }
}

//第二位数字为双数的为androidx版本，单数的为非androidx版本
implementation 'com.gitee.libowu:guideView:v0.0.7'
implementation 'com.gitee.libowu:guideView:v0.1.7'

```
## v0.0.7更新内容如下<br>
1.切出一条分支以支持非androidx的版本，使用方法和androidx版本一模一样。<br>
2.非androidx版本版本号规则是"x.x.x“的的第二位数字是单数，而androidx版本则是双数。其他两位数字两个版本保持一致。

## v0.0.6更新内容如下<br>
1.添加GuideDialog，显示调用时使用dialog即可，不要在布局中直接使用guideview了。<br>
3.去除标题栏对高亮区的影响<br>
4.设置guideview属性时直接调用guideDialog的set方法。但必须在show()方法调用前调用<br>
5.构造guideDialog时必须设置主窗口的view。activity可通过getWindow -> getDecorView 方法获取，fragment可使用onViewCreated中的
view。
6.使用guideDialog的setGuideBeans(List<GuideBean>)设置高两区，调用guideDialog的show()方法执行显示

## v0.0.5中更新内容如下
1.去除已下配置<br>
  //设置遮罩层颜色<br>
  GuideView.Config.COLOR = Color.parseColor("#cc000000");<br>
  //是否一屏显示多个控件说明<br>
  GuideView.Config.OPENMORE = false;<br>
  //设置是否精确点击，即只有点击到对应的控件区域，才执行点击<br>
  GuideView.Config.CLICK_EXACT = false;<br>
  //设置内边距<br>
  GuideView.Config.SHAPE_PADDING = 40;<br>
  上面的配置方法留到布局文件中的xml文件中进行配置，对应的key为：maskColor，openMore，clickExact，heightLightPadding。<br>
2.添加showGuide(int time)方法<br>
  此方法是延迟高亮区的显示，time单位为毫秒。当软件界面过于复杂时，直接调用showGuide()可能出现界面未绘制完成就显示遮罩的问题。顾添加此方  
  法<br>
3.添加和设置高亮控件的位置限制减小<br>
  之前 guide.setGuideBeans(List<GudeBean>)方法只能在onWindowFocusChanged()等可以获取到控件高度，位置信息的方法中调用，现在去除这个限 
  制了，在onCreate(Bundle)中也可以调用。<br>
4.修正viewpager中使用时可能出现的测量问题，即高亮区被绘制到屏幕之外了。先已修复。<br>


## 调用前配置guideView
所有guideview配置最好在设置要显示的高亮区集合前设置，配置项都在Config静态类中。下面介绍各个配置的作用<br>
1. Config.COLOR:设置遮罩层的背景颜色。默认值是#99000000
2. Config.OPENMORE:是否启用一屏多个控件说明，即高亮区集合会一次会知道屏幕上显示。默认值为false
3. Config.CLICK_EXACT:是否启用精确点击。即只有用户点击高亮区后才会执行点击事件。默认值为false
4. Config.ACTIONBAR_HEIGHT:标题栏高度。界面中存在自定义标题栏时，可以配置这个值进行修正，不修正高亮区指示位置可能不准。默认值为-1.
5. Config.RECT:绘制高亮区为矩形。只对绘制普通几何图形高亮区的情况生效。
6. Config.CIRCLE:绘制高亮区为圆形。只对绘制普通几何图形高亮区的情况生效。
7. Config.OVA:绘制高亮区为椭圆形。只对绘制普通几何图形高亮区的情况生效。
8. Config.ROUNDED_RECT :绘制高亮区为圆角矩形。只对绘制普通几何图形高亮区的情况生效。
9. Config.ROUNDED_RECT_VALUE:绘制圆角矩形时圆角的半径。只对绘制普通几何图形高亮区的情况生效。
10. Config.SHAPE_PADDING:绘制基本几何图形高亮区时内边距的设置。只对绘制普通几何图形高亮区的情况生效。
11. Config.LEFT:绘制说明图片到控件的左边

## 调用guideview进行说明显示。下面时代码事例
1. 布局代码<br>
   ```
   <com.libowu.guide.view.GuideView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/guide"/>
   ```
2. 调用代码<br>
   ```
   @Override
      protected void onCreate(Bundle savedInstanceState) {
          /*requestWindowFeature(Window.FEATURE_NO_TITLE);
          getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);*/
          super.onCreate(savedInstanceState);
          setContentView(R.layout.activity_main);
          initView();
          //配置guideview
          configGuideView();
          //设置guideview的监听，可以不设置
          initListen();
      }
      /**
      *设置监听器
      */
      private void initListen() {
        guide.setGuideViewClickCallBack(this);
        textViewTwo.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //想要显示高亮说明时，调用此方法即可显示
                guide.showGuide();
            }
        });
    }
    /**
     * 设置guideview的基本配置
     */
    private void configGuideView() {
        //设置遮罩层颜色
        GuideView.Config.COLOR = Color.parseColor("#cc000000");
        //是否一屏显示多个控件说明
        GuideView.Config.OPENMORE = false;
        //设置是否精确点击，即只有点击到对应的控件区域，才执行点击
        GuideView.Config.CLICK_EXACT = false;
        //设置内边距
        GuideView.Config.SHAPE_PADDING = 40;
    }
    /**
    *设置高亮区到集合中
    */
    @Override
   public void onWindowFocusChanged(boolean hasFocus) {
       super.onWindowFocusChanged(hasFocus);
       //将要说明的控件添加到集合中，让后给guideview设置数据即可
       guides = new ArrayList<>();
       guides.add(new GuideBean(R.mipmap.guide,this,textView, true, GuideView.Config.OVAL));
       guides.add(new GuideBean(R.mipmap.guide,this,textViewTwo,true, GuideView.Config.OVAL));
       guides.add(new GuideBean(R.mipmap.guide,this,textViewThree,true, GuideView.Config.OVAL));
       guide.setGuideBeans(guides);
   }

   ```

   ## guideBean构造方法
  1. GuideBean(int img, Activity act, View view)<br>
      img:高亮区说明图片<br>
      act:当前activity<br>
      View:要被说明的控件<br>

  2. GuideBean(int img, Activity act, View view ,int position)<br>
      img:高亮区说明图片<br>
      act:当前activity<br>
      View:要被说明的控件<br>
      position:控件说明图片相对于控件的位置

  3. GuideBean(int img, Activity act, View view,boolean isSimpleShape,byte shape)<br>
     img:高亮区说明图片<br>
     act:当前activity<br>
     View:要被说明的控件<br>
     isSimpleShape:高亮区是否需要显示基本几何图形。默认不是基本几何图形。<br>
     shape：如果是基本几何图形的高亮区，则这里定义基本几何图形的形状<br>

  4. GuideBean(int img, Activity act, View view,boolean isSimpleShape,byte shape,int position)<br>
     img:高亮区说明图片<br>
     act:当前activity<br>
     View:要被说明的控件<br>
     isSimpleShape:高亮区是否需要显示基本几何图形。默认不是基本几何图形。<br>
     shape：如果是基本几何图形的高亮区，则这里定义基本几何图形的形状<br>
     position:控件说明图片相对于控件的位置<br>

   5. GuideBean(int img,Activity act,View view,boolean isSimpleShape,byte shape,int position,int    marginLeft,int marginRight,int marginTop,int marginBottom)<br>
      img:高亮区说明图片<br>
      act:当前activity<br>
      View:要被说明的控件<br>
      isSimpleShape:高亮区是否需要显示基本几何图形。默认不是基本几何图形。<br>
      shape：如果是基本几何图形的高亮区，则这里定义基本几何图形的形状<br>
      position:控件说明图片相对于控件的位置<br>
      剩下的参数是设置上下左右的margin