上次的文章（點擊查看），介紹了Android MD設(shè)計規(guī)范中對于“底板（Bottom Sheets）”的定義，這次的文章來跟大家介紹一下iOS設(shè)計規(guī)范中的底部浮層。

在iOS規(guī)范中，出現(xiàn)在頁面底部的浮層有兩種：上拉菜單（Action Sheets）和活動視圖（Activity Views）。

上拉菜單

上拉菜單，是當用戶激發(fā)一個操作的時候，出現(xiàn)的浮層?！笆褂蒙侠藛巫層脩艨梢蚤_始一個新任務(wù)或者對破壞性操作（例如：刪除、退出登錄等，筆者注）進行二次確認?！?使用上拉菜單開始一個新任務(wù)，在蘋果官方的郵件應(yīng)用里有很多案例，比如下面這個：

點擊了那個長得很像“回復(fù)”的按鈕，出現(xiàn)了三個操作供用戶選擇：回復(fù)、轉(zhuǎn)發(fā)、打印。

在用戶進行破壞性操作的時候，上拉菜單成為一個確認性質(zhì)的存在，防止用戶誤操作引起了破壞性結(jié)果。比如刪除照片時，如下圖：

有心的好奇寶寶（比如筆者）這里可能就會想了：之前介紹過的警告框（Alerts），在進行一些重要操作的時候也會有再次提示的作用，那么它和上拉菜單有什么區(qū)別呢？筆者經(jīng)過研究，終于在一個英文論壇上找到了答案：

警告框比較打擾用戶的使用，一般是告知出現(xiàn)的問題、希望用戶來處理一下；而上拉菜單，往往出現(xiàn)在在用戶點擊了刪除按鈕之后，用戶比較對此有預(yù)期。

其實這兩者在功能上差別不是太大，警告框打擾更大一些。

另外，對于這種破壞性操作的上拉彈框，蘋果建議在設(shè)計上突出那個破壞性的操作。比如上面那張圖的“刪除照片”按鈕，就文案的顏色被設(shè)計成了紅色。此外，上拉菜單必須要在底部有個“取消”按鈕；同時，應(yīng)盡量避免出現(xiàn)滾動條。

活動視圖

這里的“活動”，指的就是浮層里包含的每一個操作?；顒右晥D里包含的操作，必須是在對當前場景有用的操作。

iOS規(guī)范里提到，活動視圖，可以是從底部出現(xiàn)的浮層，也可以是從按鈕處展現(xiàn)的彈出框（popover），如下圖所示：

左邊是活動視圖，右邊是彈出框

至于使用哪一種，蘋果建議是根據(jù)尺寸和屏幕的放置方向決定。其實，原來手機屏幕較小時，popover這種控件，是專屬于iPad設(shè)備的，現(xiàn)在隨著手機屏幕尺寸越來越大，popover也開始出現(xiàn)在手機應(yīng)用的設(shè)計里。這也是合理的情況。

另外，在設(shè)計活動視圖的時候，需要注意圖標要能表現(xiàn)出操作的意義，文案要盡量簡短明確。如果是系統(tǒng)自帶的一些操作，如復(fù)制、黏貼，蘋果建議直接使用系統(tǒng)自帶的樣式，不要創(chuàng)造新樣式。規(guī)范里還特別指出，點擊活動視圖里的操作，不可在原有活動視圖之上疊加出現(xiàn)活動視圖或者上拉菜單，最多可以出現(xiàn)警告框這種控件。

以上介紹了iOS設(shè)計規(guī)范中上拉菜單和活動視圖這兩種控件。我們來總結(jié)一下：

上拉菜單可以展示操作（文字形式），也可以對用戶的破壞性操作進行二次確認；而活動視圖也可以展示操作，只是展示的操作數(shù)量更多，且可以使用圖標+文字的展現(xiàn)形式。

所以，當操作數(shù)目較少的時候，可以考慮使用上拉菜單，而數(shù)目較多的時候，最好使用活動視圖；對破壞性操作的二次確認，則必須使用上拉菜單。

對于Android MD規(guī)范中底部浮層——“底板（Bottom Sheets）”感興趣的小伙伴，可以查看下面的鏈接：iOS和Android規(guī)范解析——底部浮層（上）

底板示例

最后順提一句，討論會使我們更清楚地認識這個控件。歡迎大家留言討論。

相關(guān)閱讀

iOS和Android規(guī)范解析——底部浮層（上）

iOS和Android規(guī)范解析——提示框（Toast）對比

iOS和Android規(guī)范解析——警告框（Alerts）對比

#專欄作家#

沐風，微信公眾號：“沐風與體驗設(shè)計”。人人都是產(chǎn)品經(jīng)理專欄作家，2017年度作家評選最佳人氣獎。愛奇藝Phone和PC端交互團隊負責人。留德海龜，曾任職騰訊微生活、網(wǎng)易、宜信。6年交互設(shè)計經(jīng)驗，專注設(shè)計領(lǐng)域，歡迎關(guān)注。

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

題圖來自 Unsplash，基于CC0協(xié)議。