實(shí)習(xí)期間碰到一個(gè)項(xiàng)目伤锚，是關(guān)于應(yīng)用設(shè)置項(xiàng)的梳理工作。項(xiàng)目背景是應(yīng)用版本升級志衣，信息架構(gòu)做了整改屯援，所以相應(yīng)的設(shè)置項(xiàng)也要進(jìn)行重新的整合刪改猛们。總所周知的狞洋，應(yīng)用設(shè)置頁就是一堆列表項(xiàng)弯淘，所以在設(shè)計(jì)之前我先去了解了一下列表項(xiàng)的形式都有哪些，各自都是怎么用的吉懊，做完之后現(xiàn)在才想起來可以整理一下這部分內(nèi)容庐橙。其中部分已經(jīng)整理發(fā)表出來復(fù)選框和開關(guān)的選擇，剩下的就將在本文呈現(xiàn)出來借嗽。需要說明的是态鳖，本文展現(xiàn)的是列表項(xiàng)，而不僅僅是設(shè)置頁的列表項(xiàng)淹魄。

列表樣式【1】

列表樣式一般長得如上圖郁惜，其中Primary Actionbar主要包含三類信息：圖標(biāo)、標(biāo)題和描述甲锡。其中圖標(biāo)和描述都是可選的兆蕉，標(biāo)題是一定需要的。至于Secondary Action才是區(qū)分不同形式的列表項(xiàng)最主要的部分缤沦。Secondary Action可以為空虎韵，為空的時(shí)候就是以下的第一種情況。

直接點(diǎn)擊列表項(xiàng)

當(dāng)Secondary Action為空的時(shí)候缸废，此時(shí)的列表項(xiàng)代表“點(diǎn)擊觸發(fā)”的狀態(tài)包蓝，此時(shí)Primary Action要使用“表示動(dòng)作的文案”，而不能使用“表示說明的文案”企量。舉個(gè)栗子：“立刻更新病毒庫”就是一種“表示動(dòng)作的文案”测萎，而“更新設(shè)置”就是一種“表示說明的文案”。

手機(jī)管家 6.1.0 Build 3277

進(jìn)入二級頁面列表項(xiàng)

當(dāng)Secondary Action不為空的時(shí)候届巩，此時(shí)就會(huì)有不同的情形硅瞧。第一種最常見的是代表“進(jìn)入二級頁面”的圖標(biāo)，一般是一個(gè)“向右的角”恕汇，這個(gè)角代表著點(diǎn)擊會(huì)有后續(xù)的頁面腕唧。需要說明的是，安卓原生沒有這種設(shè)計(jì)規(guī)范瘾英，但是iOS一般都會(huì)符合這種規(guī)范枣接，我只是覺得這種規(guī)范有利于與第一種情況做區(qū)分，遵守這種規(guī)范會(huì)更好缺谴。

MIUI 7

復(fù)合列表項(xiàng)

第一種列表項(xiàng)和第二種列表項(xiàng)有時(shí)候會(huì)進(jìn)行結(jié)合但惶，比如在“通話記錄列表”頁面，用戶會(huì)有一種需求是點(diǎn)擊進(jìn)入詳情頁，查看通話記錄榆骚，另一種需求是點(diǎn)擊撥打電話片拍。這兩種結(jié)合起來的時(shí)候就會(huì)形成符合列表項(xiàng)。復(fù)合列表項(xiàng)的Secondary Action是一個(gè)按鈕妓肢，按鈕代表一種操作捌省，點(diǎn)擊按鈕即進(jìn)行按鈕代表的操作，點(diǎn)擊其他部分即進(jìn)行其他部分碉钠。

手機(jī)管家 6.1.0 Build 3277

MIUI 7

重新排序列表【3】

可下拉列表項(xiàng)

可下拉列表代表的是一種選擇操作纲缓，選項(xiàng)的數(shù)量大于二，通過下拉列表可以查看更多選項(xiàng)喊废，從中進(jìn)行選擇祝高。

可下拉列表

相比較于點(diǎn)擊進(jìn)入二級頁面選擇的設(shè)定，可下拉列表項(xiàng)可以有效減少操作步驟污筷。

可編輯文字列表項(xiàng)

在可編輯文字的列表項(xiàng)中工闺，Secondary Action顯示的是文字，點(diǎn)擊會(huì)彈出文字編輯彈窗或者進(jìn)入新頁面編輯瓣蛀。

手機(jī)管家 6.1.0 Build 3277

可展開列表項(xiàng)

當(dāng)頁面內(nèi)容很多的時(shí)候陆蟆，列表項(xiàng)也可以考慮做成可折疊/展開的形式，默認(rèn)展示大類信息惋增，點(diǎn)擊可以展開更多詳情叠殷。

可展開列表【3】

開關(guān)列表項(xiàng)

開關(guān)列表項(xiàng)表示一種“狀態(tài)切換”，當(dāng)只有單個(gè)列表項(xiàng)诈皿、多個(gè)不同的列表項(xiàng)或者聯(lián)動(dòng)列表項(xiàng)時(shí)林束，選用開關(guān)列表更加適合。詳情請見：復(fù)選框和開關(guān)的選擇稽亏。

簡書 1.9.7

復(fù)選列表項(xiàng)

當(dāng)有多個(gè)相似的表示“狀態(tài)切換”的列表項(xiàng)時(shí)壶冒，可以考慮增加二級標(biāo)題，然后使用復(fù)選列表項(xiàng)截歉。

知乎? 2.4.4

單選列表項(xiàng)

復(fù)選列表是說多個(gè)列表項(xiàng)可以同時(shí)選中胖腾，單選列表項(xiàng)只能在多個(gè)列表項(xiàng)中選擇一個(gè)。需要注意的是怎披，復(fù)選框是一個(gè)正方形胸嘁，單選框是一個(gè)圓形瓶摆。

美團(tuán) v6.3.1

可滑動(dòng)列表項(xiàng)

也有一些列表凉逛，滑動(dòng)列表之后會(huì)展開一些操作項(xiàng)。不過這種設(shè)定在安卓比較少見群井，一是因?yàn)榘沧康纳蟃ab導(dǎo)航也是滑動(dòng)操作状飞，于這種可滑動(dòng)列表項(xiàng)有沖突。二是可見性確實(shí)很差。

可滑動(dòng)列表項(xiàng)【3】

【1】列表 - Material Design 中文版 - 極客學(xué)院Wiki http://wiki.jikexueyuan.com/project/material-design/components/lists.html

【2】菜單 - Material Design 中文版 - 極客學(xué)院Wiki http://wiki.jikexueyuan.com/project/material-design/components/menus.html

【3】列表控制 - Material Design 中文版 - 極客學(xué)院Wiki http://wiki.jikexueyuan.com/project/material-design/components/list-controls.html