用SnackBar替換掉Toast?看完再?zèng)Q定

作者：張旸 2017-07-21 09:48:34

Design Support Library 是 Google 發(fā)布的一個(gè)全新的兼容函數(shù)庫(kù)，它可以在 Android 2.1 (Api level 7)及以上的設(shè)備中，實(shí)現(xiàn) Material Design 的效果，這個(gè)函數(shù)庫(kù)同時(shí)也提供了一系列控件。今天介紹的 SnackBar 就是其中之一。

一、前言

今天介紹的 SnackBar 就是其中之一。

在使用 Design Support Library 之前，需要在 build.gradle 文件中，添加依賴。

compile 'com.android.support:design:25.3.0'

二、SnackBar 的常規(guī)使用

SnackBar 是一個(gè)輕量級(jí)的控件，它顯示在屏幕的底部，并且在顯示和隱藏的時(shí)候，帶有動(dòng)畫效果。主要用于做一個(gè)快速的提示，它可以***的替代 Toast ，并且在使用的 API 上，也完全和 Toast 的使用方式類似，所以掌握起來(lái)，難度并不大。

它和 Toast ***的不同，是 SnackBar 可以帶有一個(gè)按鈕，也就是說(shuō)它可以承載簡(jiǎn)單的交互邏輯。

先來(lái)看看 SnackBar 能實(shí)現(xiàn)的效果。

可以看到，它會(huì)在底部顯示一個(gè)消息條，并且在顯示和隱藏的時(shí)候，都是自帶動(dòng)畫的，可以承載一個(gè)TextView 和 Button。

SnackBar 的 API ，其實(shí)很多是參考了 Toast 的，所以他們的使用方式非常的相像。

就拿上面的例子中來(lái)看，代碼也非常的簡(jiǎn)單。

SnackBar 之需要傳入一個(gè) ViewGroup 然后它就可以在這個(gè) ViewGroup 中顯示，通常我們會(huì)將這個(gè) ViewGroup 置于屏幕的底部。

SnackBar 是沒有 public 的構(gòu)造方法的，所以需要使用 make() 方法，獲取到一個(gè) SnackBar 對(duì)象，然后調(diào)用 show() 方法，即可顯示出來(lái)。

在上面的例子中，還使用 setAction() 方法，為其右邊的按鈕設(shè)定文字以及一個(gè)點(diǎn)擊事件。

下面介紹一下 SnackBar 自帶的一些基本 api：

make()：構(gòu)造一個(gè) SnackBar 對(duì)象，可進(jìn)行簡(jiǎn)單配置。

show()：用于顯示一個(gè)已經(jīng)構(gòu)造好的 SnackBar。

setText()：為 SnackBar 的設(shè)置提示的消息內(nèi)容。

setAction()：用于指定右邊的按鈕顯示的文字以及相應(yīng)的惦記事件。

setActionTextColor()：設(shè)定右邊按鈕文字的顏色。

setCallback()：設(shè)置 SnackBar 的顯示和隱藏時(shí)候的回掉監(jiān)聽。

setDuration()：更新 Duration。

可以看到，SnackBar 本身只提供了非常簡(jiǎn)單的 API 實(shí)現(xiàn)，看來(lái) Google 是指望開發(fā)者完全按照他們的風(fēng)格來(lái)設(shè)計(jì) App。

三、帶著問題來(lái)看 SnackBar

前面已經(jīng)介紹了 SnackBar 的基本 API 的使用，如果想做其他的設(shè)置，就需要我們自己進(jìn)行一些操作了。那么接下來(lái)就讓我們帶著問題來(lái)看如何使用 SnackBar 。

下面會(huì)涉及到一些 SnackBar 的源碼，沒興趣的可以跳過直接看每個(gè)問題***的結(jié)論即可。

1、能不能設(shè)置一個(gè)常駐的 SnackBar

從上面的例子中可以看到，SnackBar 有點(diǎn)模仿 Toast 的意思，給出的兩個(gè)可供我們選擇的值，LENGTH_SHORT 、LENGTH_LONG ，分別表示兩個(gè)不同顯示時(shí)間的 SnackBar。

從代碼的文檔上看，貌似是沒有提供給我們用以設(shè)定常駐的 SnackBar 的方式。

但是細(xì)心看看源碼，可以發(fā)現(xiàn)，duration，是通過 @Duration 接口限定輸入的，而 duration 實(shí)際上是有三個(gè)取值的，另外一個(gè)就是可以設(shè)置常駐的。

所以，如果我們有對(duì) SnackBar 有常駐需求的話，可以使用 LENGTH_INDEFINITE 標(biāo)記即可。

2、去除掉滑動(dòng)刪除功能

前面介紹過，SnackBar 是需要有一個(gè) ViewGroup 容器來(lái)容納它的，而官方推薦使用 CoordinatorLayout 這個(gè) ViewGroup，它實(shí)際上也是 Support Design Library 中提供的容器控件。

官方之所以推薦使用它，就是因?yàn)樗梢宰層脩敉ㄟ^在 SnackBar 上進(jìn)行右滑操作，進(jìn)行刪除。

雖然說(shuō)是這么說(shuō)，我們還是從源碼中看看具體實(shí)現(xiàn)。

SnackBar 是繼承自 BaseTransientBottomBar 的，而這一段實(shí)現(xiàn)正是在父類中。

如圖所示，如果 SnackBar 的父布局是 CoordinatorLayout 的話，就使用 Behavior 來(lái)實(shí)現(xiàn)滑動(dòng)刪除功能。

所以我們?nèi)绻恍枰瑒?dòng)刪除的功能，可以考慮用一個(gè) FrameLayout 來(lái)容納 SnackBar。

或者需要滑動(dòng)功能，卻發(fā)現(xiàn)沒有實(shí)現(xiàn)，檢查一下布局，看承載 SnackBar 的容器，是不是 CoordinatorLayout。

3、禁用動(dòng)畫能做到嗎?

不知道會(huì)不會(huì)有一些交互設(shè)計(jì)師要求不要?jiǎng)赢嫞瓦@么生硬的顯示出來(lái)。那么我們來(lái)看看到底動(dòng)畫是不是可以被禁用掉。

執(zhí)行 SnackBar 顯示和隱藏動(dòng)畫的邏輯，依然在它的父類BaseTransientBottomBar 中。查看源碼可以看到，它在執(zhí)行顯示和隱藏之前，都會(huì)調(diào)用 shouldAnimate() 方法，來(lái)判斷是否需要執(zhí)行一個(gè)動(dòng)畫。

這么看，好像 SnackBar 是可以支持關(guān)閉動(dòng)畫的，再看看 animateView 的實(shí)現(xiàn)。

是否使用動(dòng)畫是依賴 AccessibilityManager 中的 enable 屬性決定的，而它是一個(gè)私有的屬性，并且沒有提供修改它的方法，并且如果用反射修改它的值，不確定會(huì)不會(huì)出現(xiàn)其他的問題，有待驗(yàn)證。

那么可以簡(jiǎn)單的認(rèn)為，SnackBar 的動(dòng)畫，是無(wú)法簡(jiǎn)單關(guān)閉的。

4、讓 SnackBar 顯示在頂部可以嗎?

既然 SnackBar 是有一個(gè)外部容器來(lái)承載它的，也就是說(shuō)，容器在哪里，它實(shí)際上就出現(xiàn)在哪里。

所以如果將它置為頂部，其實(shí)是可以讓它在頂部出現(xiàn)的。但是你以為這樣就完了嗎?還需要考慮動(dòng)畫的問題，雖然 SnackBar 會(huì)出現(xiàn)在頂部，但是動(dòng)畫依然是從下到上出現(xiàn)的，你就會(huì)得到一個(gè)非常詭異的 SnackBar 。

這明顯不是我們想要的。那么是不是想辦法改變它出現(xiàn)和隱藏的動(dòng)畫就可以了，繼續(xù)在源碼內(nèi)找答案。

animateViewIn() 方法就是 SnackBar 顯示時(shí)候調(diào)用的動(dòng)畫，但是實(shí)際上，它無(wú)法被重寫。

所以，將 SnackBar 置于頂部，并且***的執(zhí)行動(dòng)畫的設(shè)想是達(dá)不到的。

5、修改其他的UI樣式可以實(shí)現(xiàn)嗎?

SnackBar 原本提供的可以修改 UI 樣式的 API 非常的少，它只能修改右邊 Button 字體的顏色。

我們繼續(xù)在源碼內(nèi)找答案，看看源碼可以發(fā)現(xiàn)，它的布局是在 SnackBar 中 inflater 出來(lái)的。布局文件為，design_layout_snackbar_include.xml

SnackBar 就是用一個(gè) TextView 和一個(gè) Button 實(shí)現(xiàn)的。也就是說(shuō)，我們可以直接找到這兩個(gè)控件，來(lái)改變它的樣式。

參考 setText() 方法可以看到，實(shí)際上它是通過 mView 對(duì)象，拿到一個(gè) SnackbarContentLayout 對(duì)象進(jìn)行操作。mView 這個(gè) View 就是我們需要的。SnackBar 正好也提供了它的 get 方法，所以只需要拿到它，然后對(duì)其內(nèi)的 View 進(jìn)行樣式的修改，即可達(dá)到我們的需求。

所以，對(duì)于 SnackBar 的樣式修改，只要通過 getView() 拿到 mView 對(duì)象之后，就可以實(shí)現(xiàn)樣式的修改了。

四、題外話再說(shuō)兩句

帶著問題看源碼是一個(gè)非常好的讀源碼的方式。實(shí)際上 SnackBar 用起來(lái)，看上去非常的好用，但是它封裝的東西太多了。如果我們親愛的設(shè)計(jì)師能遵照 Material Design 來(lái)設(shè)計(jì) App，其實(shí)直接用 SnackBar 也是一個(gè)不錯(cuò)的選擇。

對(duì)于一些定制要求的類似 SnackBar 的實(shí)現(xiàn)。實(shí)際上我們已經(jīng)把 SnackBar 的源碼讀了一遍了，關(guān)鍵點(diǎn)已經(jīng)掌握，自己參照 SnackBar 的源碼實(shí)現(xiàn)一套我們自己的 XxSnackBar 也并不難，都是自己寫的代碼了，如何實(shí)現(xiàn)就看我們自己的了。

我?guī)е膯栴}，實(shí)際上也是我看到 SnackBar 會(huì)想到的問題。