引导页高亮小提示

来源:互联网 发布:网络捕鱼游戏技巧 编辑:程序博客网 时间:2024/05/29 14:03

这里写图片描述这里写图片描述
这里写图片描述这里写图片描述

布局省略

测试代码入下:

  HighLightGuideView.builder(this)                .addHighLightGuidView(confirm, R.mipmap.unchain)                .setHighLightStyle(HighLightGuideView.VIEWSTYLE_RECT)                .show();        HighLightGuideView.builder(this)                .addHighLightGuidView(confirm, R.mipmap.unchain)                .setHighLightStyle(HighLightGuideView.VIEWSTYLE_CIRCLE)                .show();//        HighLightGuideView.builder(this)                .addHighLightGuidView(confirm, R.mipmap.unchain)                .setHighLightStyle(HighLightGuideView.VIEWSTYLE_OVAL)                .show();        HighLightGuideView.builder(this)                .addHighLightGuidView(setting_feedback_text, R.mipmap.input_pass)                .setHighLightStyle(HighLightGuideView.VIEWSTYLE_NO)                .show();

参数的意思是:
addHighLightGuidView为哪个控件设置高亮,以及在该控件处填指示的图片
setHighLightStyle设置高亮的类型–矩形、圆形、椭圆、以及没有高亮

HighLightGuideView

package com.safly.myapplication.highlight;import android.app.Activity;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.BlurMaskFilter;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.PorterDuff;import android.graphics.PorterDuffXfermode;import android.graphics.Rect;import android.graphics.RectF;import android.support.v4.content.ContextCompat;import android.util.Log;import android.view.MotionEvent;import android.view.View;import android.view.ViewGroup;import android.view.Window;import com.safly.myapplication.R;import java.util.ArrayList;/** * * des:“应用新功能”的用户指引view */public class HighLightGuideView extends View {    //高亮类型:矩形、圆形、椭圆、没有高亮    public static final int VIEWSTYLE_RECT = 0;    public static final int VIEWSTYLE_CIRCLE = 1;    public static final int VIEWSTYLE_OVAL = 2;    public static final int VIEWSTYLE_NO = -1;    //画笔类型,圆滑、默认    public int maskblurstyle = MASKBLURSTYLE_SOLID;//画笔类型默认    public static final int MASKBLURSTYLE_SOLID = 0;    public static final int MASKBLURSTYLE_NORMAL = 1;    private View rootView;//activity的contentview,是FrameLayout    private Bitmap inputPass, addEvent, unChain;// 指示箭头    private Bitmap fgBitmap;// 前景    private Canvas mCanvas;// 绘制蒙版层的画布    private Paint mPaint;// 绘制蒙版层画笔    private int screenW, screenH;// 屏幕宽高    private int radius;//圆半径    private OnDismissListener onDismissListener;//关闭监听    private Activity activity;    /*******************可配置属性*****************************/    private boolean touchOutsideCancel = true;//外部点击是否可关闭    private int highLightStyle = VIEWSTYLE_RECT;//高亮类型默认圆形    private ArrayList<Bitmap> tipBitmaps;//显示图片    private ArrayList<View> targetViews;//高亮目标view    private int maskColor = 0x99000000;// 蒙版层颜色    private int borderWitdh = 2;    private int highLisghtPadding = 0;// 高亮控件padding    private int mipTipsId;    private HighLightGuideView(Activity activity) {        super(activity);        this.activity=activity;        cal(activity);        init(activity);    }    public static HighLightGuideView builder(Activity activity) {        return new HighLightGuideView(activity);    }    /**     * 获取屏幕的宽度、高度     * @param context     */    private void cal(Context context) {        int[] screenSize = UiUtil.getScreenSize((Activity) context);        screenW = screenSize[0];        screenH = screenSize[1];    }    private void init(Context context) {        tipBitmaps = new ArrayList<>();        targetViews = new ArrayList<>();        rootView = ((Activity) getContext()).findViewById(android.R.id.content);        addEvent = BitmapFactory.decodeResource(getResources(), R.mipmap.add_event);        inputPass = BitmapFactory.decodeResource(getResources(), R.mipmap.input_pass);        unChain = BitmapFactory.decodeResource(getResources(), R.mipmap.unchain);        BlurMaskFilter.Blur blurStyle = null;        switch (maskblurstyle) {            case MASKBLURSTYLE_SOLID:                blurStyle = BlurMaskFilter.Blur.SOLID;                break;            case MASKBLURSTYLE_NORMAL:                blurStyle = BlurMaskFilter.Blur.NORMAL;                break;        }        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);        // 设置画笔透明度为0是关键!        mPaint.setARGB(0, 255, 0, 0);        mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));        mPaint.setMaskFilter(new BlurMaskFilter(0.1f, blurStyle));        //蒙层map        fgBitmap = Bitmap.createBitmap(screenW, screenH, Bitmap.Config.ARGB_4444);        mCanvas = new Canvas(fgBitmap);        mCanvas.drawColor(maskColor);    }    @Override    protected void onDraw(Canvas canvas) {        if (targetViews == null && tipBitmaps == null)            return;        // 绘制前景DST_IN!!!!!!!!!        canvas.drawBitmap(fgBitmap, 0, 0, null);        //有高亮控件        if (targetViews.size() > 0 && tipBitmaps.size() > 0) {            for (int i = 0; i < targetViews.size(); i++) {                //高亮控件宽高                int vWidth = targetViews.get(i).getWidth();                int vHeight = targetViews.get(i).getHeight();                //获取获取高亮控件坐标                int left = 0;                int top = 0;                int right = 0;                int bottom = 0;                try {                    Rect rtLocation =ViewUtils.getLocationInView(((ViewGroup)activity.findViewById(Window.ID_ANDROID_CONTENT)).getChildAt(0),targetViews.get(i));                    left = rtLocation.left;                    top = rtLocation.top;                    right = rtLocation.right;                    bottom = rtLocation.bottom;                    Log.d("statusheightssleft",left+"");                    Log.d("statusheightsstop",top+"");                    Log.d("statusheightbottom",right+"");                    Log.d("statusheightsbottom",bottom+"");                } catch (Exception e) {                    e.printStackTrace();                }                //绘制高亮形状                switch (highLightStyle) {                    case VIEWSTYLE_OVAL:                        RectF rectf = new RectF(left-highLisghtPadding, top-highLisghtPadding, right+highLisghtPadding, bottom+highLisghtPadding);                        mCanvas.drawOval(rectf, mPaint);                        break;                    case VIEWSTYLE_RECT:                        RectF rect = new RectF(left - borderWitdh-highLisghtPadding, top - borderWitdh-highLisghtPadding, right + borderWitdh+highLisghtPadding, bottom + borderWitdh+highLisghtPadding);                        mCanvas.drawRoundRect(rect, 20, 20, mPaint);                        break;                    case VIEWSTYLE_CIRCLE:                        radius = vWidth > vHeight ? vWidth / 2 +highLisghtPadding/2: vHeight / 2+ highLisghtPadding/2;                        if (radius < 50) {                            radius = 100;                        }                        mCanvas.drawCircle(left + vWidth / 2, top + vHeight / 2, radius, mPaint);                        break;                }                //绘制箭头和提示图                switch (mipTipsId){                    case R.mipmap.add_event:                        mCanvas.drawBitmap(addEvent, left + vWidth / 2 - 50, bottom, null);                        break;                    case R.mipmap.input_pass:                        mCanvas.drawBitmap(inputPass, left, top, null);                        break;                    case R.mipmap.unchain:                        int width = unChain.getWidth();                        mCanvas.drawBitmap(unChain,  screenW - width - radius, bottom, null);                        break;                    default:                        break;                }            }        }    }    @Override    public boolean onTouchEvent(MotionEvent event) {        switch (event.getAction()) {            case MotionEvent.ACTION_UP://                if (touchOutsideCancel) {                    this.setVisibility(View.GONE);                    //移除view                    if (rootView != null) {                        ((ViewGroup) rootView).removeView(this);                    }                    //返回监听                    if (this.onDismissListener != null) {                        onDismissListener.onDismiss();                    }                    return true;                }                break;        }        return true;    }    public interface OnDismissListener {        public void onDismiss();    }    /********************builder模式设置属性******************************/    /**     * 绘制前景画布颜色     *     * @param bgColor     */    public HighLightGuideView setMaskColor(int bgColor) {        try {            this.maskColor = ContextCompat.getColor(getContext(),bgColor);            // 重新绘制前景画布            mCanvas.drawColor(maskColor);        } catch (Exception e) {            e.printStackTrace();        }        return this;    }    /**     * 设置高亮显示类型     *     * @param style     */    public HighLightGuideView setHighLightStyle(int style) {        this.highLightStyle = style;        return this;    }    /**     * 设置高亮画笔类型     *     * @param maskblurstyle     */    public HighLightGuideView setMaskblurstyle(int maskblurstyle) {        this.maskblurstyle = maskblurstyle;        return this;    }    /**     * 设置需要高亮的View和提示的图片     *     * @param targetView     * @param res     */    public HighLightGuideView addHighLightGuidView(View targetView, int res) {        try {            mipTipsId = res;            targetViews.add(targetView);            tipBitmaps.add(BitmapFactory.decodeResource(getResources(), res));        } catch (Exception e) {            e.printStackTrace();        }        return this;    }    /**     * 设置不需要高亮的View,只是提示图片     *     * @param res     */    public HighLightGuideView addNoHighLightGuidView(int res) {        try {            tipBitmaps.add(BitmapFactory.decodeResource(getResources(), res));        } catch (Exception e) {            e.printStackTrace();        }        return this;    }    /**     * 设置外部是否关闭,默认关闭     *     * @param cancel     */    public HighLightGuideView setTouchOutsideDismiss(boolean cancel) {        this.touchOutsideCancel = cancel;        return this;    }    /**     * 设置额外的边框宽度     *     * @param borderWidth     */    public HighLightGuideView setBorderWidth(int borderWidth) {        this.borderWitdh = borderWidth;        return this;    }    /**     * 设置状态栏高度 默认是减去了一个状态栏高度 如果主题设置android:windowTranslucentStatus=true     * 需要设置状态栏高度为0     *     * @param highLisghtPadding     */    public HighLightGuideView setHighLisghtPadding(int highLisghtPadding) {        this.highLisghtPadding = highLisghtPadding;        return this;    }    /**     * 设置关闭监听     *     * @param listener     */    public HighLightGuideView setOnDismissListener(OnDismissListener listener) {        this.onDismissListener = listener;        return this;    }    /**     * 清空画布     */    public HighLightGuideView clearBg() {        if (mCanvas != null) {            Paint paint = new Paint();            paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));            mCanvas.drawPaint(paint);            paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));        }        // 将其注入画布        mCanvas = new Canvas(fgBitmap);        // 绘制前景画布        mCanvas.drawColor(maskColor);        return this;    }    /**     * 显示     */    public void show() {        if (rootView != null) {            ViewGroup.LayoutParams lp = new ViewGroup.LayoutParams                    (ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);            ((ViewGroup) rootView).addView(this, ((ViewGroup) rootView).getChildCount(), lp);        }    }}

UiUtil

package com.safly.myapplication.highlight;import android.app.Activity;import android.content.Context;import android.util.DisplayMetrics;/** * * des:测量工具类 */public final class UiUtil {    /**     * 获取屏幕尺寸     *      * @param activity     *            Activity     * @return 屏幕尺寸像素值,下标为0的值为宽,下标为1的值为高     */    public static int[] getScreenSize(Activity activity) {        DisplayMetrics metrics = new DisplayMetrics();        activity.getWindowManager().getDefaultDisplay().getMetrics(metrics);        return new int[] { metrics.widthPixels, metrics.heightPixels };    }    /**     * 获取状态栏高度     * @param context     * @return     */    public static int getStatusBarHeight(Context context) {        int result = 0;        int resId = context.getResources().getIdentifier("status_bar_height", "dimen", "android");        if (resId > 0) {            result = context.getResources().getDimensionPixelOffset(resId);        }        return result;    }}

ViewUtils

package com.safly.myapplication.highlight;import android.app.Activity;import android.content.Context;import android.graphics.Rect;import android.view.View;/** * * des:测量位置 */public class ViewUtils {    private static final String FRAGMENT_CON = "NoSaveStateFrameLayout";    public static Rect getLocationInView(View parent, View child) {        if (child == null || parent == null) {            throw new IllegalArgumentException("parent and child can not be null .");        }        View decorView = null;        Context context = child.getContext();        if (context instanceof Activity) {            decorView = ((Activity) context).getWindow().getDecorView();        }        Rect result = new Rect();        Rect tmpRect = new Rect();        View tmp = child;        if (child == parent) {            child.getHitRect(result);            return result;        }        while (tmp != decorView && tmp != parent) {            //找到控件占据的矩形区域的矩形坐标            tmp.getHitRect(tmpRect);            if (!tmp.getClass().equals(FRAGMENT_CON)) {                result.left += tmpRect.left;                result.top += tmpRect.top;            }            tmp = (View) tmp.getParent();        }        result.right = result.left + child.getMeasuredWidth();        result.bottom = result.top + child.getMeasuredHeight();        return result;    }}
0 0
原创粉丝点击