相比于Toast，Snackbar的好處十分明顯——可讀性更強(qiáng)，還可以兼容1～2個(gè)次要操作，適用場(chǎng)景更加廣泛。因此，筆者也具體向我們介紹了Snackbar的常見(jiàn)樣式以及設(shè)計(jì)注意事項(xiàng)。

一、什么是Snackbar

Snackbar是Google Material Design中提供的一種兼容提示與操作的消息控件。這也就意味著所有Android開(kāi)發(fā)都可以直接通過(guò)官方插件來(lái)調(diào)用此控件哦～

此控件與Toast比較相似，都通常用于低干擾度的消息提示，該消息可被忽略且不會(huì)打斷用戶當(dāng)前的操作。但相對(duì)Toast而言，Snackbar的優(yōu)勢(shì)在于可讀性更強(qiáng)，還可以兼容1～2個(gè)次要操作，適用場(chǎng)景會(huì)更加廣泛，有興趣的同學(xué)不妨可以在設(shè)計(jì)開(kāi)發(fā)中嘗試使用，你會(huì)發(fā)現(xiàn)確實(shí)比Toast好用太多了！

下面就由我來(lái)為你詳解Snackbar的一些特性和玩法吧～

二、Snackbar的常見(jiàn)樣式

Snackbar的樣式可以根據(jù)設(shè)備的寬度進(jìn)行適配改變。

1. 窄屏：純文案

通常用于移動(dòng)設(shè)備豎屏。最多展示兩行，每行最大展示字?jǐn)?shù)請(qǐng)可定義，超出兩行信息展示為……

2. 窄屏：文案+按鈕

通常用于移動(dòng)設(shè)備豎屏。文案最多展示兩行，每行最大展示字?jǐn)?shù)可定義，超出兩行信息展示為……

支持展示1～2個(gè)操作按鈕，按鈕顏色需突出（可自定義），當(dāng)按鈕展示不下時(shí)（文案過(guò)長(zhǎng)或按鈕文本過(guò)長(zhǎng)）允許折行顯示。

3. 寬屏：純文案

通常用于移動(dòng)設(shè)備橫屏。文案最多展示一行，最大展示字?jǐn)?shù)可定義，超出的字?jǐn)?shù)展示為……

4. 寬屏：文案+按鈕

通常用于移動(dòng)設(shè)備橫屏。文案最多展示一行，最大展示字?jǐn)?shù)可定義，超出的字?jǐn)?shù)展示為…，支持展示1～2個(gè)操作按鈕，按鈕顏色需突出（可自定義）。

三、Snackbar的顯示與消失機(jī)制

顯示時(shí)不會(huì)打斷用戶操作，在以下情況下會(huì)消失：

1. 用戶點(diǎn)擊Snackbar上的操作，觸發(fā)操作的同時(shí)消失；
2. 用戶點(diǎn)擊屏幕任意位置時(shí)立即消失；
3. 用戶不進(jìn)行任何操作，持續(xù)4～10秒后自動(dòng)消失（時(shí)長(zhǎng)可自定義）。

四、Snackbar的顯示位置

當(dāng)頁(yè)有Bottom app bar或Bottom Navigation時(shí)，顯示在其上方（不可貼邊或發(fā)生重疊）。

當(dāng)頁(yè)無(wú)Bottom app bar或Bottom Navigation時(shí)，顯示在頁(yè)面底部（不可貼邊或發(fā)生重疊）。

當(dāng)頁(yè)底部有Floating action button時(shí)，顯示在其上方（不可貼邊或發(fā)生重疊）。

橫屏?xí)r，顯示在頁(yè)面左下方（不可貼邊）。

五、Snackbar的唯一性

需展示多個(gè)Snackbars時(shí)，每次僅能顯示1個(gè)，之后的Snackbar應(yīng)在前一個(gè)消失后再顯示。

六、Snackbar的超時(shí)重置

在Snackbar顯示期間時(shí)出現(xiàn)了Dialogs，關(guān)閉Dialog后，重新顯示該Snackbar并重置顯示時(shí)長(zhǎng)，以確保用戶能讀完Snackbar上的信息。

七、Snackbar的幾點(diǎn)“不要”

1. 不要使用與操作結(jié)果或進(jìn)程無(wú)關(guān)的文案描述
2. 不要使用“忽略”或“取消”的按鈕文案，因?yàn)閟nackbar會(huì)自動(dòng)消失
3. 不要使用text button之外的按鈕樣式，因?yàn)閟nackbar不會(huì)用于承載重要操作
4. 不要使用2個(gè)以上的按鈕，若確實(shí)需要，請(qǐng)考慮使用Dialogs
5. 不要用于承載很重要的操作，若確實(shí)需要，請(qǐng)考慮使用Dialogs
6. 不要遮擋FAB或底部導(dǎo)航

八、使用范例

當(dāng)用戶手動(dòng)將某道題目成功添加至錯(cuò)題本時(shí)，使用snackbar告知用戶收藏是否成功并顯示“添加標(biāo)簽”按鈕引導(dǎo)，用戶可選擇點(diǎn)擊按鈕去添加標(biāo)簽，也可以選擇置之不理。

當(dāng)用戶成功提交問(wèn)題反饋時(shí)，使用snackbar告知用戶提交是否成功。

最后感謝閱讀，如有問(wèn)題，歡迎留言討論哦～

本文由 @愚者秦 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議