超好用的Android高亮引導(dǎo)庫的使用

更新時間：2021年04月22日 11:43:46 作者：OyeAndroid

這篇文章主要介紹了超好用的Android高亮引導(dǎo)庫的使用，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

簡介

HighlightPro 是Android的一個高亮引導(dǎo)庫，同時它還可以是一個簡單的popup window庫

功能:

可一次顯示一個或多個高亮view
通過水平約束和豎直約束來準確定位提示view
自定義提示view的出現(xiàn)動畫
自定義高亮形狀和大小
自定義高亮形狀的paint
鏈式調(diào)用，使用簡單
支持簡單的pop window

效果圖:

用法:

Gradle

在項目級的build.gradle文件種添加maven存儲倉庫Jitpack：

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

添加依賴到你的app的build.gradle 文件中：

dependencies {		
	implementation 'com.github.hyy920109:GuidePro:1.0.3'
}

代碼

我們可以通過Activity Fragment ViewGroup其中一個拿到HighlightPro對象：

/**
 * 會使用activity.window.decorView 作為父view 全屏顯示
 */
fun with(activity: Activity): HighlightPro {
    return HighlightPro(activity)
}

/**
 * 會使用會使用fragment依賴的activity的activity.window.decorView 作為父view 全屏顯示
 */
fun with(fragment: Fragment): HighlightPro {
    return HighlightPro(fragment)
}

/**
 * 會使用傳進來的viewGroup作為父view
 */
fun with(view: ViewGroup): HighlightPro {
    return HighlightPro(view)
}

簡單的完整鏈式調(diào)用

HighlightPro.with(this)
            .setHighlightParameter {
                HighlightParameter.Builder()
                    .setHighlightViewId(R.id.btn_step_first)
                    .setTipsViewId(R.layout.guide_step_first)
                    .setHighlightShape(RectShape(4f.dp, 4f.dp, 6f))
                    .setHighlightHorizontalPadding(8f.dp)
                    .setConstraints(Constraints.StartToEndOfHighlight + Constraints.TopToTopOfHighlight)
                    .setMarginOffset(MarginOffset(start = 8.dp))
                    .build()
            }
            .setBackgroundColor("#80000000".toColorInt())
            .setOnShowCallback { index ->
                //do something
            }
            .setOnDismissCallback {
                //do something
            }
            .show()

如果你想一次展示多個高亮view可以看如下代碼（區(qū)別是傳入的是一個List）：

HighlightPro.with(this)
            .setHighlightParameters(
                HighlightParameter.Builder()
                    .setHighlightViewId(R.id.btn_step_first)
                    .setTipsViewId(R.layout.guide_step_first)
                    .setHighlightShape(RectShape(4f.dp, 4f.dp, 6f))
                    .setHighlightHorizontalPadding(8f.dp)
                    .setConstraints(Constraints.StartToEndOfHighlight + Constraints.TopToTopOfHighlight)
                    .setMarginOffset(MarginOffset(start = 8.dp))
                    .build()
                        +
                HighlightParameter.Builder()
                    .setHighlightViewId(R.id.btn_step_second)
                    .setTipsViewId(R.layout.guide_step_second)
                    .setHighlightShape(RectShape(4f.dp, 4f.dp, 6f))
                    .setHighlightHorizontalPadding(8f.dp)
                    .setConstraints(Constraints.StartToEndOfHighlight + Constraints.TopToTopOfHighlight)
                    .setMarginOffset(MarginOffset(start = 8.dp))
                    .build()
            )
            .setBackgroundColor("#80000000".toColorInt())
            .setOnShowCallback { index ->
                //do something
            }
            .setOnDismissCallback {
                //do something
            }
            .show()

如果我們連環(huán)展示高亮view(比如第一步、第二步。。。)，可以采用多次調(diào)用setHighlightParameter, 代碼如下：

HighlightPro.with(this)
    .setHighlightParameter {
        HighlightParameter.Builder()
            .setHighlightViewId(R.id.btn_step_first)
            .setTipsViewId(R.layout.guide_step_first)
            .setHighlightShape(RectShape(4f.dp, 4f.dp, 6f))
            .setHighlightHorizontalPadding(8f.dp)
            .setConstraints(Constraints.StartToEndOfHighlight + Constraints.TopToTopOfHighlight)
            .setMarginOffset(MarginOffset(start = 8.dp))
            .build()
    }
    .setHighlightParameter {
        HighlightParameter.Builder()
            .setHighlightViewId(R.id.btn_step_second)
            .setTipsViewId(R.layout.guide_step_second)
            .setHighlightShape(CircleShape())
            .setHighlightHorizontalPadding(20f.dp)
            .setHighlightVerticalPadding(20f.dp)
            .setConstraints(Constraints.TopToBottomOfHighlight + Constraints.EndToEndOfHighlight)
            .setMarginOffset(MarginOffset(top = 8.dp))
            .build()
    }
    .setHighlightParameter {
        HighlightParameter.Builder()
            .setHighlightViewId(R.id.btn_step_third)
            .setTipsViewId(R.layout.guide_step_third)
            .setHighlightShape(OvalShape())
            .setHighlightHorizontalPadding(12f.dp)
            .setHighlightVerticalPadding(12f.dp)
            .setConstraints(Constraints.BottomToTopOfHighlight + Constraints.EndToEndOfHighlight)
            .setMarginOffset(MarginOffset(bottom = 6.dp))
            .build()
    }
    .setBackgroundColor("#80000000".toColorInt())
    .setOnShowCallback { index ->
        //do something
    }
    .setOnDismissCallback {
        //do something
    }
    .interceptBackPressed(true)
    .show()

如果我們想現(xiàn)實pop window, 可以通過enableHighlight來控制，傳入false 就代表了不會高亮target view:

HighlightPro.with(this)
    .setHighlightParameter {
        HighlightParameter.Builder()
            .setHighlightViewId(R.id.btn_tips_bottom)
            .setTipsViewId(R.layout.pop_tips_layout_bottom)
            .setConstraints(Constraints.TopToBottomOfHighlight + Constraints.EndToEndOfHighlight)
            .setMarginOffset(MarginOffset(end = (-2).dp))
            .build()
    }
    .enableHighlight(false)//禁用highlight
    .interceptBackPressed(true)//攔截返回鍵，返回鍵會導(dǎo)致 popwindow消失
    .show()

API 文檔

關(guān)于 HighlightParameter.Builder

方法名	方法描述
setHighlightViewId	設(shè)置高亮view的id
setHighlightView	設(shè)置高亮view
setTipsViewId	設(shè)置提示view的id
setTipsView	設(shè)置提示view
setHighlightShape	設(shè)置高亮形狀
setHighlightVerticalPadding	設(shè)置高亮區(qū)域的豎直padding
setHighlightHorizontalPadding	設(shè)置高亮區(qū)域的水平padding
setConstraints	設(shè)置提示view的相關(guān)約束
setMarginOffset	設(shè)置提示view的偏移量
build	返回一個 HighlightParameter 對象

注意

setHighlightViewId & setHighlightView
setTipsViewId & setTipsView

對于上面兩組方法，你只需要使用每組中其中一個方法。如果都沒使用，UI 表現(xiàn)會不正常

關(guān)于 HighlightShape

HighlightShape	方法描述
RectShape	邊緣模糊的矩形圖形
CircleShape	邊緣模糊的圓形
OvalShape	邊緣模糊的橢圓形

注意

任何形狀都是基于高亮view在屏幕中的矩形區(qū)域，我們可以通過setHighlightVerticalPadding 或 setHighlightHorizontalPadding來擴大高亮區(qū)域

關(guān)于 Constraints

這個類是決定提示view位置的核心類，類似于Android自帶的約束布局，目前我們所有的約束均依賴于高亮view

Vertical Constraints	屬性描述
TopToTopOfHighlight	將提示view頂部和高亮矩形頂部對齊
TopToBottomOfHighlight	將提示view頂部和高亮矩形底部對齊
BottomToBottomOfHighlight	將提示view底部和高亮矩形底部對齊
BottomToTopOfHighlight	將提示view底部和高亮矩形頂部對齊

Horizontal Constraint	屬性描述
StartToStartOfHighlight	將提示view左側(cè)和高亮矩形左側(cè)對齊
StartToEndOfHighlight	將提示view左側(cè)和高亮矩形右側(cè)對齊
EndToEndOfHighlight	將提示view右側(cè)和高亮矩形右側(cè)對齊
EndToStartOfHighlight	將提示view右側(cè)和高亮矩形左側(cè)對齊

注意

通常我們就設(shè)置兩個約束：一個豎直約束，一個水平約束，而且我們可以通過運算符重載+來構(gòu)建約束集合：

Constraints.TopToBottomOfHighlight + Constraints.EndToEndOfHighlight

當然我們也可以設(shè)置偏移量來調(diào)整提示view的位置：

setMarginOffset(MarginOffset(start = 8.dp))

最后

上面我們基本把HighlightPro的用法介紹完了，歡迎大家使用，如果它對您有幫助，記得給個star哦。如果使用過程有啥bug，歡迎提Issues，我會及時跟進的。

到此這篇關(guān)于超好用的Android高亮引導(dǎo)庫的使用的文章就介紹到這了,更多相關(guān)Android高亮引導(dǎo)庫內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

Android高亮引導(dǎo)控件的實現(xiàn)代碼

欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

超好用的Android高亮引導(dǎo)庫的使用

簡介

用法:

代碼

API 文檔

最后

相關(guān)文章

最新評論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具