【歪门邪道】Android页面上快速实现蒙层引导需求

【歪门邪道】Android页面上快速实现蒙层引导需求

这几年工作发现一个定律，新年前一定有一个大项目，项目优先度一定高，排期一定倒着排，程序员一定要加班。就好像，缺了这个项目，发年终奖就亏了一样。

新需求有多个引导蒙层，蒙层需要漏出被引导的按钮区域，时间上调研一下已有的三方控件来不及了，简单的写死位置难以适配多种机型，activity嵌套多个fragment的结构也不允许在布局文件内硬编码一个蒙层。

所以，只能用最短的方式写一个带挖孔的蒙层，配合引导图使用。

蒙层view代码

public class ShadowView extends View {

    Paint pRect = new Paint();
    private Rect mRect = new Rect();
    private View mView;
    private int[] location = new int[2];

    public ShadowView(Context context) {
        super(context);
        pRect.setColor(getResources().getColor(R.color.b_c0_64));
        pRect.setAntiAlias(true);
    }

    public ShadowView(Context context, @Nullable @org.jetbrains.annotations.Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public ShadowView(Context context, @Nullable @org.jetbrains.annotations.Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    
    public void setView(View view) {
        mView = view;
    }

    
    public void setRect(Rect rect) {
        mRect = rect;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        if (mView != null) {
            mView.getLocationInWindow(location);
            mRect.left = location[0];
            mRect.top = location[1];
            mRect.right = location[0] + mView.getMeasuredWidth();
            mRect.bottom = location[1] + mView.getMeasuredHeight();
        }

        if (mRect != null) {
            canvas.drawRect(0, 0, getWidth(), mRect.top, pRect);
            canvas.drawRect(0, mRect.bottom, getWidth(), getHeight(), pRect);
            canvas.drawRect(0, mRect.top, mRect.left, mRect.bottom, pRect);
            canvas.drawRect(mRect.right, mRect.top, getWidth(), mRect.bottom, pRect);
        }
    }
}

这样，简单的蒙层view就实现了。

这个蒙层可以通过传递view，或传递view相对于屏幕的位置(Rect)，就能在对应的view上下左右各绘制一个黑色半透明蒙层，用的时候直接add到decor view 上就可以

            frameLayout frameLayout = (frameLayout) getWindow().getDecorView();
            mShadowView = new ShadowView(this);
            frameLayout.addView(mShadowView);
            mShadowView.setView(targetView);

注意，引导结束后一定要移除shadowview哦。

            frameLayout frameLayout = (frameLayout) getWindow().getDecorView();
            frameLayout.removeView(mShadowView);