定義?
選項(xiàng)卡指一個(gè)長條形控件，有至少兩個(gè)分段組成学歧，每個(gè)分段互相獨(dú)立罩引、等寬。像按鈕一樣枝笨，選項(xiàng)卡可以承載文字或 icon袁铐，在同功能和布局，但不同類別的頁面之間切換伺帘。例如在地圖當(dāng)中昭躺，選項(xiàng)卡可以實(shí)現(xiàn)視圖在地圖、交通圖和衛(wèi)星地圖之間切換伪嫁。
Tab 與 Segment一樣领炫，都是在同功能和布局，但不同類別的頁面之間切換张咳，在本質(zhì)上二者沒有區(qū)別帝洪，但 tab 是 segment 的延展，在本文中脚猾，筆者將二者統(tǒng)稱為segmented controls/選項(xiàng)卡葱峡。
龍爪槐守望者在他的文章中指出了一些 tab 和 segment 的不同，筆者認(rèn)為稍顯牽強(qiáng)龙助，原因：
1砰奕、對(duì)于控件的定義不取決于來源，而取決于控件本身的作用。
2军援、控件的交互形式有待優(yōu)化仅淑，左右滑動(dòng)可能會(huì)造成手勢(shì)的沖突。目前而言點(diǎn)擊是最精確的交互形式胸哥。
3涯竟、二者同為可見性更強(qiáng)的菜單，將菜單橫向平鋪更易于用戶在不同類別間切換空厌。
原文鏈接：http://www.ftium4.com/segment-controls.html
使用規(guī)范
避免選項(xiàng)卡中出現(xiàn)過多分段以提升可用性庐船。分段越寬越容易點(diǎn)擊，一般來說分段最好不要超過5個(gè)嘲更，如果選項(xiàng)卡超過5個(gè)筐钟，請(qǐng)使用滾動(dòng)選項(xiàng)卡。?
保證各個(gè)分段中的內(nèi)容格式統(tǒng)一哮内。因?yàn)樗械姆侄蔚葘挼量茫哉?qǐng)保證其中的內(nèi)容屬性也一致。
避免圖標(biāo)和文字混合使用北发。雖然選項(xiàng)卡可以包含圖標(biāo)和文字纹因，但將二者混合會(huì)弱化各個(gè)分段之間的并列關(guān)系，并使用戶疑惑琳拨。?
選項(xiàng)卡的調(diào)性要與用戶自定義色調(diào)統(tǒng)一瞭恰。如果用戶切換了白天/深夜模式、或者切換了應(yīng)用程序的皮膚狱庇，請(qǐng)保證選項(xiàng)卡的調(diào)性與其統(tǒng)一惊畏。
?
延展
滾動(dòng)選項(xiàng)卡
滾動(dòng)選項(xiàng)卡為選項(xiàng)卡的延伸，出現(xiàn)位置一般在導(dǎo)航欄的下方密任。其特點(diǎn)在于可以通過手指滑動(dòng)看到更多的分段颜启，優(yōu)勢(shì)在于保證易用性的基礎(chǔ)上容納多個(gè)分段。
優(yōu)先考慮使用選項(xiàng)卡浪讳，而不是滾動(dòng)選項(xiàng)卡缰盏。在頁面層級(jí)上，2-5個(gè)分段使頁面邏輯更為清晰淹遵；在用戶體驗(yàn)上口猜，合理清晰的頁面布局可以讓用戶對(duì)產(chǎn)品產(chǎn)生更強(qiáng)的掌控感。
徽標(biāo)選項(xiàng)卡
允許在選項(xiàng)卡的各個(gè)分段上顯示徽標(biāo)透揣，可以提示用戶某個(gè)分段中內(nèi)容的更新济炎。使用規(guī)范請(qǐng)參考控件集——Badge/通知徽標(biāo)/小紅點(diǎn)/Notice point。
?
自定義選項(xiàng)卡
自定義選線卡有諸多使用場(chǎng)景辐真，例如時(shí)間段须尚，或活動(dòng)的階段崖堤。
何時(shí)使用？
當(dāng)分段中的各個(gè)內(nèi)容平級(jí)恨闪，且頁面中顯示內(nèi)容布局一致時(shí)倘感，可考慮使用選項(xiàng)卡。
使用選項(xiàng)卡的目的咙咽，是在同功能和布局，但不同類別的頁面之間切換淤年。區(qū)別于 Tab Bars的一點(diǎn)是钧敞，底部導(dǎo)航欄可以實(shí)現(xiàn)一個(gè) app 中不同功能的快速切換。
小結(jié)
在使用場(chǎng)景上選項(xiàng)卡提供了一級(jí)頁面中各個(gè)平級(jí)頁面之間的切換弄诲，而不是一級(jí)頁面之間的切換愚战。在使用時(shí)也應(yīng)該保證嚴(yán)謹(jǐn)?shù)氖褂眠壿嫞杏浻刑嗟姆侄喂┯脩暨x擇而降低用戶的期待與掌控感齐遵。
