用法

列表控制分為如下四種:

• 狀態(tài)
• 主操作(包括文本字符串)
• 次要操作
• 次要信息

列表標題的元素要容易分辨，首先要注意閱讀順序，所以，狀態(tài)和主操作放在標題列表的左邊。在這里，列表里面的文本內(nèi)容也被認為是主操作的操作目標的一部分。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-listcontrols-listcontrols_03_large_mdpi.png" alt="" />

不要把兩個展示圖標和操作圖標放在一起，比如復選框和頭像

如果列表的主操作是做導航作用的，那么就不要使用icon。列表它本身以及它的上下文就已經(jīng)可以讓用戶明白這個列表的用處是什么。

次要操作以及信息應該放在標題的右邊，次要操作通常要和主要操作分開單獨可點擊，因為越來越多的用戶希望每個圖標都能觸發(fā)一個動作。

列表控制的類型

復選框(Checkbox)

復選框既可以被定義成是主操作也可以是次要操作。

類型: 主動作/狀態(tài)

單獨可點擊

Desktop on hover only

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_08_large_mdpi.png" alt="" />
在這個列表中，復選框是主要操作和狀態(tài)標志符

類型: 次要操作

單獨可點擊

當控制一系列的變量而不僅僅只是控制一個變量的情況下，考慮使用開關(guān)控件來替換。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_10_large_mdpi.png" alt="" />
在這個列表中，復選框是次要操作

開關(guān)

類型: 次要操作

單獨可點擊

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_30_large_mdpi.png" alt="" />

重新排序

類型: 次要動作

通常都是單獨可點擊，視當前列表所處的模式而定。

該動作允許用戶給列表中項通過拖動變換位置。通常，這個按鈕出現(xiàn)在列表編輯的模式下。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_18_large_mdpi.png" alt="" />

展開/折疊

類型: 次要動作

單獨可點擊

垂直展開或者折疊列表來顯示或者隱藏當前列表

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_26a_large_mdpi.png" alt="" />

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_26b_large_mdpi.png" alt="" />

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_28a_large_mdpi.png" alt="" />

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_28b_large_mdpi.png" alt="" />

Leave Behinds

類型: 其他

Leave-behind 是在當某一項列表被滑開之后的操作提示。Leave-behind可以被轉(zhuǎn)換成一項操作。

無論從哪個方向滑動列表，都會出現(xiàn)操作圖標?；瑒恿酥螅僮鲌D標就會居中顯示于列表空白處。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_22a_large_mdpi.png" alt="" />

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_22b_large_mdpi.png" alt="" />

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_22c_large_mdpi.png" alt="" />

不推薦的做法:導航列表控制

通常情況下，列表本身的內(nèi)容就已經(jīng)隱含了導航信息，因此，列表里面就不需要額外的圖標。

查看更多

類型: 主要操作（連同行內(nèi)其他內(nèi)容）

非單獨可點擊

點擊之后跳轉(zhuǎn)到與當前列表相關(guān)詳細信息的頁面，通常這都是一個新的頁面或者面板。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesoflistcontrols-listcontrols_16_large_mdpi.png" alt="" />

菜單控制的類型

選中

類型: 狀態(tài)

非單獨可點擊

僅適用于菜單。用來表示當前列表是否通過不同的操作之后被選中。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesofmenucontrols-listcontrols_06_large_mdpi.png" alt="" />

內(nèi)聯(lián)信息

類型: 次要信息

非單獨可點擊

僅適用于菜單。內(nèi)聯(lián)信息是列表中一小段文字用來提供當前標題相關(guān)的信息或者提示，比如快捷鍵。不能被刪除。

http://wiki.jikexueyuan.com/project/material-design/images/components-listcontrols-typesofmenucontrols-listcontrols_12_large_mdpi.png" alt="" />

原文：List controls 翻譯：leiweibo 校對：cxytomo