Web中的單選和復(fù)選我們見得比較多，但是在移動端中，單選和復(fù)選控件樣式較多，需要結(jié)合不同的使用場景去選擇使用。下面我將總結(jié)一下移動端中的單選和復(fù)選控件。

      首先我們看看官方文件給的設(shè)計規(guī)范：

ios

      ios官方文件中沒有具體說單選和復(fù)選控件，只能從一些包含選擇的空間中來：
    （1）Pickers（選擇器）

      選擇器是包括一個或多個不同值的可滾動列表，每個值都具有單個選定值，常顯示在屏幕底部或彈出窗口中。

      使用選擇器需要注意的有：
    使用可預(yù)測和符合邏輯順序的值；例如使用按字母順序排列的國家/地區(qū)列表；
    避免通過打開新的界面來顯示選擇器；
    如果數(shù)值或選項(xiàng)較多，請使用列表而不是選擇器。選擇器的尺寸較小，想要快速找到想要的數(shù)值需要多次滑動，而列表的滑動范圍更大，可以更快地找到想要的數(shù)值或選項(xiàng)。
    （2）選擇列表

      使用列表的形式簡潔干凈，能高效地顯示大量或少量信息。

   Android
 （1）單選

    使用單選按鈕選擇單個項(xiàng)目
    如果可以折疊可用選項(xiàng)，請考慮使用下拉菜單，因?yàn)樗加玫目臻g更少。
    （2）復(fù)選

    使用復(fù)選框選擇列表中的多個項(xiàng)目
    再次點(diǎn)擊選項(xiàng)可以取消選擇
    對于有層級關(guān)系的復(fù)選選項(xiàng)：
    選中父復(fù)選框后，將選中所有子復(fù)選框

    如果未選中父復(fù)選框，則取消選中所有子復(fù)選框

    如果選中某些（但不是全部）子復(fù)選框，則父復(fù)選框?qū)⒆優(yōu)椴淮_定復(fù)選框

    要注意的是：單選和復(fù)選控件樣式，不要混淆。也不要在單選的情況下使用復(fù)選按鈕。

    下面，我們看實(shí)際運(yùn)用中，單選和復(fù)選控件是如何使用的。
    單選控件總結(jié)了四種樣式：按鈕式、選中打點(diǎn)、列表勾選和選擇器。
   單選
（1）單選-按鈕式
      選項(xiàng)一般是相同類型的，例如淘寶選擇商品尺寸、屬性等選項(xiàng)內(nèi)容少，選項(xiàng)數(shù)量較少；
    彈窗內(nèi)容清晰明了，選擇區(qū)域很清楚，但選擇區(qū)域較??；
    不適合選項(xiàng)較多、選項(xiàng)文案較長的場景。
   （2）單選-選中打點(diǎn)
      更多是安卓上的操作控件，適用于單選，選項(xiàng)不是同一類型的情況；
    目測選擇區(qū)域較小，但實(shí)際上只要點(diǎn)擊與文字同一排的位置即可選擇。
    （3）單選-列表勾選
      彈窗更多出現(xiàn)在安卓系統(tǒng)中，相比選中打點(diǎn)的設(shè)計，給用戶的引導(dǎo)性更強(qiáng)，目測選擇區(qū)域更大。
    因?yàn)?#10004;️離文案較遠(yuǎn)，所以選中的選項(xiàng)要突出。

      Ios系統(tǒng)中也使用列表勾選，但大部分都是跳轉(zhuǎn)一個新界面；

      選擇之后直接更改，沒有確認(rèn)鍵；
    選項(xiàng)字?jǐn)?shù)可以較長，選項(xiàng)可以較多。
    （4）單選-選擇器

    更多出現(xiàn)在ios系統(tǒng)中，一般從出現(xiàn)在界面底部；
   列表式看起來選項(xiàng)更清晰；
    一般在表單填寫中出現(xiàn)，選項(xiàng)較多，可滑動。
  多選
    多選形式較單一：
      一般是勾選加外框的形狀，避免與單選按鈕混淆；

      彈窗選擇中要盡量避免只使用單個操作按鈕的情況，會讓用戶產(chǎn)生疑惑，不知道如何關(guān)閉彈窗。

分享題目：網(wǎng)站手機(jī)版如何設(shè)計單選復(fù)選控件
本文來源：http://jinyejixie.com/news20/114820.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供虛擬主機(jī)、外貿(mào)建站、響應(yīng)式網(wǎng)站、網(wǎng)站營銷、網(wǎng)站收錄、面包屑導(dǎo)航

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)