本文對(duì)APP中常見(jiàn)彈窗的分類(lèi)、特點(diǎn)與應(yīng)用場(chǎng)景進(jìn)行了總結(jié)~
在使用APP過(guò)程中，經(jīng)?？吹礁鞣N各樣的彈窗提示。那么這些彈窗提示有哪些類(lèi)型？每種類(lèi)型特點(diǎn)及對(duì)應(yīng)的應(yīng)用場(chǎng)景是什么？本文結(jié)合經(jīng)驗(yàn)、網(wǎng)絡(luò)資料，對(duì)此進(jìn)行了簡(jiǎn)單總結(jié)分析，歡迎交流指正~~在產(chǎn)品設(shè)計(jì)時(shí)要在合適的時(shí)機(jī)選用合適的彈窗類(lèi)型，以保證產(chǎn)品使用流暢及良好的用戶(hù)體驗(yàn)。
開(kāi)門(mén)見(jiàn)山，彈窗分類(lèi)如下圖所示：
彈窗分為兩大類(lèi)：模態(tài)彈窗與非模態(tài)彈窗，兩者的區(qū)別在于是否打斷用戶(hù)操作，用戶(hù)是否必須回應(yīng)才能進(jìn)行下一步操作。模態(tài)彈窗作為強(qiáng)提示，會(huì)打斷用戶(hù)操作，非模態(tài)彈窗作為輕提示，對(duì)用戶(hù)影響比較小。
接下來(lái)，分別對(duì)這兩類(lèi)、六種彈窗進(jìn)行說(shuō)明。
一、 模態(tài)彈窗
1. 對(duì)話(huà)框：Dialog/Alerts
特點(diǎn)：通常包含標(biāo)題、內(nèi)容、選擇按鈕（按鈕<=2個(gè)），有些對(duì)話(huà)框可以進(jìn)行內(nèi)容輸入。一般出現(xiàn)在頁(yè)面中間位置。用戶(hù)必須對(duì)此彈窗操作后，才能進(jìn)行其他操作。安卓叫Dialog，iOS叫Alerts。
應(yīng)用場(chǎng)景：常用于重要信息通知；需要二次確認(rèn)的操作，如：刪除操作的二次確認(rèn)。
2. 功能框：Actionbar/Action Sheets
特點(diǎn)：包含多個(gè)選項(xiàng)按鈕、取消按鈕，形式包括文字、圖標(biāo)+文字等，警示性?xún)?nèi)容可使用紅色字體。出現(xiàn)在頁(yè)面底部。用戶(hù)可以選擇某個(gè)按鈕，可以點(diǎn)擊彈窗外區(qū)域或取消按鈕以關(guān)閉功能框。安卓叫Actionbar，iOS叫Action Sheets/Activity Views。
應(yīng)用場(chǎng)景：常用于有多個(gè)選項(xiàng)按鈕供用戶(hù)選擇的情況。
3. 浮出層：Popover
特點(diǎn)：點(diǎn)擊某個(gè)控件或某個(gè)區(qū)域后，出現(xiàn)在頁(yè)面之上的半透明臨時(shí)視圖。用戶(hù)可以選擇某個(gè)按鈕，可以再次點(diǎn)擊觸發(fā)浮層的控件或點(diǎn)擊浮出層以外區(qū)域來(lái)關(guān)閉浮出層彈窗。一般出現(xiàn)在頁(yè)面頂部。Popover浮出層是iOS控件。
應(yīng)用場(chǎng)景：將APP高頻功能放入首頁(yè)浮出層菜單，或?qū)㈦[藏的一些功能入口放入浮出層菜單。
二、 非模態(tài)彈窗
1. 提示框：Toast/HUD
特點(diǎn)：信息傳遞或操作反饋，停留一定時(shí)間自動(dòng)消失，用戶(hù)無(wú)需操作。形式包括文字、圖標(biāo)+文字等。一般出現(xiàn)在頁(yè)面中軸線(xiàn)的中部/頂部/底部位置。Toast是安卓叫法，iOS類(lèi)似控件叫HUD透明指示層。
應(yīng)用場(chǎng)景：用戶(hù)操作結(jié)果提示或低層級(jí)信息提示，如：已保存、刷新成功等。
2. 提示對(duì)話(huà)框：Snackbar
特點(diǎn)：信息反饋+一個(gè)操作按鈕，同時(shí)停留一定時(shí)間自動(dòng)消失。出現(xiàn)在頁(yè)面底部。提示對(duì)話(huà)框Snackbar為安卓特有控件，但iOS也有用到。
應(yīng)用場(chǎng)景：向用戶(hù)提供信息反饋，同時(shí)還可以引導(dǎo)用戶(hù)進(jìn)行操作，如：提示信息刪除后，給出“撤銷(xiāo)刪除”的選項(xiàng)；收藏文章成功后，給出“添加標(biāo)簽”選項(xiàng)。
3. 提示欄：Tips
特點(diǎn)：嵌入頁(yè)面內(nèi)的提示信息。通常位于頁(yè)面頂部。
應(yīng)用場(chǎng)景：需要給出明顯提示，但又不影響用戶(hù)操作。
