GuideView 引导库的使用

• GuideView

• 本系统能够快速的为一个Activity里的任何一个View控件创建一个遮罩式的导航页。源码戳这里

• 工作原理

• 首先它需要一个目标View或者它的id,我们通过findViewById来得到这个View，计算它在屏幕上的区域targetRect,通过这个区域，开始绘制一个覆盖整个Activity的遮罩，可以定义遮罩的颜色和透明度，然而目标View被绘制成透明从而实现高亮的效果。接下来是在相对于这个targetRect的区域绘制一些图片或者文字。我们把这样一张图片或者文字抽象成一个Component接口，设置文字或者图片，所有的图片文字都是相对于targetRect来定义的。可以设定额外的x，y偏移量,可以对遮罩系统设置可见状态的发生变化时的监听回调，可以对遮罩系统设置开始和结束时的动画效，另外，我们可以不对整个Activity覆盖遮罩，而是对某一个View覆盖遮罩。

• 注意：具体用法参见demo，内附详细注释

*

使用

  public void showGuideView() {
    GuideBuilder builder = new GuideBuilder();
    builder.setTargetViewId(R.id.header_imgbtn)//设置目标view
        .setAlpha(150)//这个其实不用说了透明度
        .setHighTargetCorner(50)//高亮区域的圆角
        .setHighTargetPadding(10)//这个就是内边距
        .setOverlayTarget(false)// 如果设置这个整个引导页将没有半透明效果。
        .setOutsideTouchable(false);
    builder.setOnVisibilityChangedListener(new GuideBuilder.OnVisibilityChangedListener() {
      @Override public void onShown() {
      }

      @Override public void onDismiss() {
      }
    });

    builder.addComponent(new SimpleComponent());
    guide = builder.createGuide();
    guide.setShouldCheckLocInWindow(true);
    guide.show(this);
  } 

加载引导页面

public class SimpleComponent implements Component {

  @Override public View getView(LayoutInflater inflater) {

    LinearLayout ll = (LinearLayout) inflater.inflate(R.layout.layer_frends, null);
    ll.setOnClickListener(new View.OnClickListener() {
      @Override public void onClick(View view) {
        Toast.makeText(view.getContext(), "引导层被点击了", Toast.LENGTH_SHORT).show();
      }
    });
    return ll;
  }

  @Override public int getAnchor() {
    return Component.ANCHOR_BOTTOM;//引导页面和目标view的相对位置
  }

  @Override public int getFitPosition() {
    return Component.FIT_END;//引导页面和目标view的相对位置
  }

  @Override public int getXOffset() {
    return 0;// 引导页上下偏移量
  }

  @Override public int getYOffset() {
    return 10;
  }
}

• 注意

  
  使用这个的时候有时候有点小坑，这个和项目的架构有点关系。
  有时候在7.0的系统上引导页不会全屏显示。主要是在创建MaskView里面的背景图创建的尺寸高度不够。这里吧获取高度的方法改成通过系统的id content 来获取，就可以了。代码如下

 Point size = new Point();
    size.x = getResources().getDisplayMetrics().widthPixels;
    size.y = getResources().getDisplayMetrics().heightPixels;
 //((Activity)context).findViewById(android.R.id.content).getMeasuredHeight();
    mFullingPaint.setColor(Color.BLACK);
    mEraserBitmap = Bitmap.createBitmap(size.x, size.y, Bitmap.Config.ARGB_8888);
    mEraserCanvas = new Canvas(mEraserBitmap);

了解更多可以添加公众号