今天的這幾個(gè)控件的中文名字惶傻，在網(wǎng)上查了半天，沒有找到統(tǒng)一的叫法壹瘟，所以自己翻譯了一下：簡(jiǎn)易菜單對(duì)應(yīng)的是MD（Material Design鲫剿，下同）中的Simple Menu；簡(jiǎn)易對(duì)話框稻轨，對(duì)應(yīng)的是MD中的Simple Dialog灵莲，彈出框?qū)?yīng)的是iOS中的Popover。
按照慣例殴俱，我們還是從MD的控件開始說起政冻。
Google Material Design Guideline
首先，什么是簡(jiǎn)易菜單呢线欲？先放一個(gè)例子出來嚇唬嚇唬人：
好像例子沒有任何可怕的點(diǎn)明场。就是想說個(gè)冷笑話，你管我李丰。分析上面的例子苦锨，簡(jiǎn)易菜單，就是在用戶當(dāng)前操作的位置出現(xiàn)的選項(xiàng)集合趴泌。它有以下幾個(gè)規(guī)則：
消失規(guī)則：當(dāng)用戶選擇了某個(gè)選項(xiàng)舟舒，簡(jiǎn)易菜單立刻消失；當(dāng)用戶點(diǎn)擊簡(jiǎn)易菜單之外的區(qū)域嗜憔，或者點(diǎn)擊安卓系統(tǒng)的返回按鈕秃励，則簡(jiǎn)易菜單消失。
展現(xiàn)規(guī)則：簡(jiǎn)易菜單應(yīng)該出現(xiàn)在入口的正上方吉捶，也就是覆蓋住入口夺鲜。
這一條在國(guó)內(nèi)的安卓系統(tǒng)中經(jīng)常被錯(cuò)用皆尔，比如下面這種情況：
國(guó)內(nèi)很多安卓版本的應(yīng)用币励，點(diǎn)擊三個(gè)點(diǎn)之后慷蠕，菜單是出現(xiàn)在三個(gè)點(diǎn)的下方。如果僅僅是從MD規(guī)范的角度來說榄审，這是不太規(guī)范的做法砌们。
另外杆麸，簡(jiǎn)易菜單還有一個(gè)展現(xiàn)原則搁进，要把當(dāng)前已經(jīng)選擇的選項(xiàng)展現(xiàn)在入口的正上方，就像下面這樣：
下面是一個(gè)反例：
但是，也有例外旦万，如果菜單的入口剛好位于頁(yè)面的邊緣位置闹击，導(dǎo)致當(dāng)前頁(yè)面展現(xiàn)不下簡(jiǎn)易菜單了，則不必遵循“當(dāng)前已選選項(xiàng)必須在入口正上方”這個(gè)原則成艘，比如下面這個(gè)例子：
以上就是簡(jiǎn)易菜單的用法。
簡(jiǎn)易對(duì)話框和簡(jiǎn)易菜單是很相似的淆两，因?yàn)樗鼈兊墓δ芏际且粯拥模禾峁┮幌盗羞x項(xiàng)断箫。
所不同的是，簡(jiǎn)易對(duì)話框除了可以提供選項(xiàng)之外秋冰，還可以提供一些相關(guān)的操作仲义。另外，在簡(jiǎn)易對(duì)話框中剑勾，可以展現(xiàn)頭像埃撵、圖標(biāo)（icon）、一條選項(xiàng)中的說明性文字甥材、其它操作（比如上圖中的“添加聯(lián)系人”按鈕）盯另。簡(jiǎn)易對(duì)話框的呼出方式，可以是點(diǎn)擊或者長(zhǎng)按洲赵，而簡(jiǎn)易菜單一般是點(diǎn)擊鸳惯。
由于簡(jiǎn)易對(duì)話框出現(xiàn)在屏幕的中央商蕴，比簡(jiǎn)易菜單更加打擾用戶。所以MD規(guī)范簡(jiǎn)易芝发，盡量使用簡(jiǎn)易菜單而不是簡(jiǎn)易對(duì)話框绪商。
iOS Human Interface Design Guideline
彈出框（Popovers）最開始是只建議用在iPad上的一種控件，最近由于手機(jī)屏幕越來越大辅鲸，也由于安卓和iOS兩種規(guī)范的混用格郁，也越來越多地出現(xiàn)在iOS應(yīng)用里，比如下面這個(gè)例子：
可以看到独悴，iOS的彈出框和Android的菜單比較相似例书，但iOS的彈出框是出現(xiàn)在入口的下面的，且要有箭頭刻炒，指示入口的位置决采。
關(guān)于彈出框，需要注意以下幾點(diǎn)：
1. 一次只能出現(xiàn)一個(gè)彈出框坟奥。如果一個(gè)操作激發(fā)了另一個(gè)彈出框树瞭，則進(jìn)行該操作的時(shí)候，立即關(guān)閉當(dāng)前彈出框爱谁，然后再出現(xiàn)新的彈出框晒喷。
2. 彈出框上面不能覆蓋別的控件，警告框除外访敌。
3. 一般來說凉敲，在彈出框上進(jìn)行了操作，則彈出框關(guān)閉捐顷。如果需要增加“放棄操作”或者“確認(rèn)操作”的功能荡陷，則可增加“取消”、“完成”這樣的按鈕迅涮。如果在彈出框里可以進(jìn)行多項(xiàng)選擇的操作废赞，則需用戶點(diǎn)擊了“取消”、“完成”或者點(diǎn)擊彈出框以外的區(qū)域關(guān)閉彈出框叮姑。
以上就是今天的全部?jī)?nèi)容唉地。
順提一句，討論能讓我們的認(rèn)識(shí)更深刻传透，也更全面耘沼。歡迎大家留言討論。
相關(guān)閱讀
iOS和Android規(guī)范解析——提示框（Toast）對(duì)比
iOS和Android規(guī)范解析——警告框（Alerts）對(duì)比
德國(guó)海龜一枚?? 朱盐，曾任職于騰訊微生活群嗤、網(wǎng)易、宜信等公司”眨現(xiàn)為愛奇藝UDC高級(jí)交互設(shè)計(jì)師狂秘。歡迎關(guān)注骇径。
