Android上一個掃描框風格的新手引導庫

簡介這是一個掃描框風格的新手引導，效果如上圖。使用 Gradle 支持特性目前暫時只支持一個掃描框的引導（多掃描框的在設計）傳入View對象就會根據它的位置信息生成坐標區域，保存在目標區域中。（所以View對象傳入之後位置有更變的，請在startGuide()前重新調用prepare()） ...

簡介

　　這是一個掃描框風格的新手引導，效果如上圖。

使用

Gradle

compile 'com.yanzhikaijky:YGuider:0.9.2'

支持特性

目前暫時只支持一個掃描框的引導（多掃描框的在設計）
傳入View對象就會根據它的位置信息生成坐標區域，保存在目標區域中。（所以View對象傳入之後位置有更變的，請在startGuide()前重新調用prepare()）
傳入區域坐標矩形（left,top,right,bottom）也可以設置目標。
可以自定義彈窗佈局。
可以自定義畫掃描框的畫筆

具體的詳細操作方法可以查看Wiki

使用方法

Demo使用

　　Demo裡面已經包含了使用YGuider的各種姿勢，不過有一些註釋掉而已，歡迎Fork來體驗。^_^

簡單使用

　　需要傳入Activity對象來創建YGuider，然後加入想要被“掃描”的目標，最後調用prepare()方法就可以了完成準備了：


        mYGuider = new YGuider(this);
        mYGuider.addNextTarget(new RectF(70, 70, 170, 170), "點擊這裡可以立刻出現所有提示文字，大家好，我是YGuider！", 90, 0);
        mYGuider.addNextTarget(btn1, "這裡是根據傳入View來確定的區域!", 150, 10);
        mYGuider.addNextTarget(new RectF(50, 500, 150, 650), "這裡是根據傳入矩形區域坐標來確定的！", 100, 10);
        mYGuider.addNextTarget(
                        btn2, "通過設置偏移量來控制PopupWindow出現的位置，還可以設置它的大小！"
                        , -350, -350
                        , 430, ViewGroup.LayoutParams.WRAP_CONTENT);
        mYGuider.addNextTarget(
                        new RectF(500, 200, 600, 270), "可以動態改變兩個按鈕的文字",
                        -350, 50
                        , 300, ViewGroup.LayoutParams.WRAP_CONTENT
                        , "", "Finish");

        mYGuider.prepare();

　　最後在需要調用的時候，使用startGuide()方法開始新手引導：

                mYGuider.startGuide();

方法介紹

　　由於方法過多，放在這裡太占地方，所以請移步Wiki查看各個方法的使用。

關於設置目標的方法


    /**
     * 增加一個掃描區域
     * @param targetView 目標View
     * @param text 說明文字
     * @param wOffsetX 彈出視窗的X位置偏移量（初始位置為目標View中間）
     * @param wOffsetY 彈出視窗的Y位置偏移量（初始位置為目標View正下方）
     */
    public void addNextTarget(View targetView, String text, int wOffsetX, int wOffsetY);

    /**
     * 增加一個掃描區域
     * @param targetView 目標View
     * @param text 說明文字
     * @param wOffsetX 彈出視窗的X位置偏移量（初始位置為目標View中間）
     * @param wOffsetY 彈出視窗的Y位置偏移量（初始位置為目標View正下方）
     * @param wWidth 彈出視窗的寬度
     * @param wHeight 彈出視窗的高度
     */
    public void addNextTarget(View targetView, String text, int wOffsetX, int wOffsetY, int wWidth, int wHeight);

    /**
     * 增加一個掃描區域
     * @param targetView 目標View
     * @param text 說明文字
     * @param wOffsetX 彈出視窗的X位置偏移量（初始位置為目標View中間）
     * @param wOffsetY 彈出視窗的Y位置偏移量（初始位置為目標View正下方）
     * @param wWidth 彈出視窗的寬度
     * @param wHeight 彈出視窗的高度
     * @param jumpText 跳過選項的文字
     * @param nextText 下一步選項的文字
     */
    public void addNextTarget(View targetView, String text, int wOffsetX, int wOffsetY, int wWidth, int wHeight, String jumpText, String nextText);

    /**
     * 增加一個掃描區域
     * @param targetRegion 目標區域的坐標矩陣
     * @param text 說明文字
     * @param wOffsetX 彈出視窗的X位置偏移量（初始位置為目標View中間）
     * @param wOffsetY 彈出視窗的Y位置偏移量（初始位置為目標View正下方）
     */
    public void addNextTarget(RectF targetRegion, String text, int wOffsetX, int wOffsetY);

    /**
     * 增加一個掃描區域
     * @param targetRegion 目標區域的坐標矩陣
     * @param text 說明文字
     * @param wOffsetX 彈出視窗的X位置偏移量（初始位置為目標View中間）
     * @param wOffsetY 彈出視窗的Y位置偏移量（初始位置為目標View正下方）
     * @param wWidth 彈出視窗的寬度
     * @param wHeight 彈出視窗的高度
     */
    public void addNextTarget(RectF targetRegion, String text, int wOffsetX, int wOffsetY, int wWidth, int wHeight);

    /**
     * 增加一個掃描區域
     * @param targetRegion 目標區域的坐標矩陣
     * @param text 說明文字
     * @param wOffsetX 彈出視窗的X位置偏移量（初始位置為目標View中間）
     * @param wOffsetY 彈出視窗的Y位置偏移量（初始位置為目標View正下方）
     * @param wWidth 彈出視窗的寬度
     * @param wHeight 彈出視窗的高度
     * @param jumpText 跳過選項的文字
     * @param nextText 下一步選項的文字
     */
    public void addNextTarget(RectF targetRegion, String text, int wOffsetX, int wOffsetY, int wWidth, int wHeight, String jumpText, String nextText);

    /**
     * 增加一些Target
     * @param targets 一些ScanTarget對象
     */
    public void addTarget(ScanTarget... targets);

　　註意，執行完上面的增加操作之後需要prepare()，才能讓YGuider獲得目標View位置屬性。


    /**
     * 開始Guide
     */
    public void startGuide();

    /**
     * 進入下一個引導
     */
    public void startNextGuide();

    /**
     * 退出新手引導
     */
    public void cancelGuide()；

    /**
     * 移除目標
     * @param index 目標的index
     * @return 移除目標成功與否
     */
    public boolean removeTarget(int index);

    /**
     * 清除所有掃描目標
     */
    public void clearTargets();

    /**
     * 判斷在當前ContentView是否已經初始化寬高屬性
     * 如果是，則直接獲取目標View的位置信息，寫入目標列表
     * 如果不是，則等到ContentView初始化寬高屬性之後再獲取
     */
    public void prepare();

設置自定義屬性的方法

　　這些方法用於設置一些YGuider本身已有預設值的屬性，替換


    /**
     * 設置掃描框動畫刷新的時間間隔，預設值是20
     * @param refreshTime 單位是ms
     */
    public void setMaskRefreshTime(int refreshTime);

    /**
     * 設置掃描框移動動畫的持續時間，預設值是500
     * @param moveDuration 單位是ms
     */
    public void setMaskMoveDuration(int moveDuration);

    /**
     * 設置掃描框擴大動畫的持續時間，預設值是500
     * @param expandDuration 單位是ms
     */
    public void setExpandDuration(int expandDuration);

    /**
     * 設置遮罩層的顏色，最後是設置成透明的，預設顏色是#aa222222
     * @param color 顏色
     */
    public void setMaskColor(@ColorInt int color);

    /**
     * 設置畫掃描框的畫筆
     * @param paint 畫筆
     */
    public void setMaskPaint(Paint paint);

    /**
     * 設置彈窗裡面TextView文字出現的速度，預設值是100
     * @param refreshTime 每次增加文字的時間間隔，單位ms
     */
    public void setWindowTyperRefreshTime(int refreshTime);

    /**
     * 彈窗裡面說明文字的字體大小，預設值是18sp
     * @param size 字體大小
     */
    public void setWindowTyperTextSize(int size);

    /**
     * 設置彈窗裡面TextView文字的增長速度，預設值是1
     * @param increase 每次增加多少個字元
     */
    public void setWindowTyperIncrease(int increase);

    /**
     * 設置跳過按鈕的文字
     * @param jumpText 跳過文字
     */
    public void setJumpText(String jumpText);

    /**
     * 設置下一步按鈕的文字
     * @param nextText 下一步文字
     */
    public void setNextText(String nextText);

    /**
     * 設置彈窗背景
     * @param idRes 背景DrawableId
     */
    public void setWindowBackground(@DrawableRes int idRes);

    /**
     * 設置跳過和下一步按鈕文字大小
     * @param size 文字字體大小
     */
    public void setWindowJumpAndNextTextSize(int size);

    /**
     * 設置自定義彈窗佈局
     * 註意新的佈局要有TyperTextView類，id設置為ttv_tips
     * 跳過按鈕和下一步按鈕可以選擇實現，但是有的話id請分別設置為tv_jump和tv_next，其他可以自定義
     * @param layouId 佈局的id
     */
    public void setWindowContent(@LayoutRes int layouId);

關於TyperTextView

　　這個逐字播放TextView是我改寫自hanks-zyh的HTextView裡面的TyperTextView，修改了不少東西，它是一個TextView，Text，TextSize和TextColor已經在代碼裡面寫了，除了這些屬性還是其他還是可以在xml文件裡面定義的。

回調

　　YGuider的回調分為狀態回調OnGuiderChangedListener和點擊回調OnGuiderClickListener：

/**
 * YGuider狀態變化的回調
 */
public interface OnGuiderChangedListener {
    /**
     * 引導開始時候回調
     */
    void onGuiderStart();

    /**
     * 跳轉到下一個目標時候的回調
     * @param nextIndex 下一個目標的index
     */
    void onGuiderNext(int nextIndex);

    /**
     * 引導完成之後的回調
     */
    void onGuiderFinished();
}

/**
 * 各種點擊事件的回調
 */
public interface OnGuiderClickListener {
    /**
     * 當遮罩層空白處被點擊時候的回調
     */
    void onMaskClick();

    /**
     * 當下一步按鈕被點擊時的回調
     * @param nextIndex 下一目標的index
     */
    void onNextClick(int nextIndex);

    /**
     * 當前高亮/掃描目標區域被點擊時的回調
     * @param index 當前目標區域的index
     */
    void onTargetClick(int index);

    /**
     * 當跳過按鈕被點擊時的回調
     */
    void onJumpClick();
}

　　註意：這些都是介面，實現它們的話就必須重寫裡面的所有方法，所以這裡有一個繼承它們的抽象類OnGuiderListener實現它的子類的話可以選擇性地重寫一些回調方法（這個設計參考了GestureDetector的SimpleOnGestureDetector），所以有下麵設置回調的方法：

    /**
     * 設置點擊回調
     * @param guiderClickListener 可以傳入OnGuiderClickListener和OnGuiderListener的子類
     */
    public void setOnGuiderClickListener(OnGuiderClickListener guiderClickListener){
        mMask.setOnGuiderClickListener(guiderClickListener);
    }

    /**
     * 設置狀態回調
     * @param onGuiderChangedListener 可以傳入OnGuiderChangedListener和OnGuiderListener的子類
     */
    public void setOnGuiderChangedListener(OnGuiderChangedListener onGuiderChangedListener){
        mMask.setOnGuiderChangedListener(onGuiderChangedListener);
    }

    /**
     * 設置狀態所有回調
     * @param onGuiderListener 可以傳入OnGuiderListener的子類
     */
    public void setOnGuiderListener(OnGuiderListener onGuiderListener){
        mMask.setOnGuiderListener(onGuiderListener);
    }
   
   源碼下載地址：http://www.jinhusns.com/Products/Download