List controls display information and actions for list items.
【翻譯】
列表控制列表項的顯示信息和操作。
List controls provide information, indicate a state, or present actions for list items. List controls appear as icons to the left or right of list text.
【翻譯】
列表控件提供列表項的信息，指示狀態或顯示操作。列表控件在列表文本的左側或右側顯示為圖標。
List control placement:
States and primary actions are placed on the left side of a list tile.
Secondary actions and info are placed on the right side of the tile.
【翻譯】
列表控件展示位置：
狀態和主要操作放置在列表圖塊的左側。
次要動作和信息放在圖塊的右側。
Types - 類型
Checkbox
Switch
Reorder
Expand/collapse
Leave-behinds
【翻譯】
復選框
開關
重新排序
展開/折疊
留下
Menu controls - 菜單控件
Check
Inline information
Nested menu indicator
【翻譯】
檢查
內聯信息
嵌套菜單指示器
Usage - 用法
List controls fall under four categories:
State
Primary action (including text strings)
Secondary action
Secondary info
【翻譯】
列表控件分為四類：
狀態
主要操作（包括文本字符串）
次要行動
次要信息
Distinguishing elements of list tiles need to be on the left for left-to-right interfaces, and vice versa. States and primary actions are placed on the left side of a list tile. Text within a list item should be considered part of the primary action target.
Don’t place two icons or actions next to one another, such as a checkbox next to an avatar.
If the primary action of the list item is navigational, don’t use an icon. The list item itself and its context should be sufficient to communicate the destination.
Secondary actions and info should be placed on the right side of the title. Secondary actions are always a separate target from the primary action, as users increasingly expect every icon to trigger an action.
【翻譯】
列表圖塊的區分元素需要在左側用于從左到右的接口，反之亦然。 狀態和主要操作放置在列表圖塊的左側。 列表項中的文本應被視為主要操作目標的一部分。
不要將兩個圖標或操作彼此相鄰放置，例如頭像旁邊的復選框。
如果列表項的主要操作是導航，則不要使用圖標。列表項本身及其上下文應足以傳達目的地。
次要操作和信息應放置在標題的右側。次要操作始終是與主要操作不同的目標，因為用戶越來越期望每個圖標觸發操作。
[圖片上傳失敗...(image-c2de6c-1552294894386)]
States and primary actions are placed on the left side of a list tile. The secondary action and secondary info should be placed on the right side of the title.
【翻譯】
狀態和主要操作放置在列表圖塊的左側。次要操作和輔助信息應放置在標題的右側。
Types of list controls - 列表控件的類型
Checkbox - 復選框
A checkbox can either be a primary action or a secondary action.
Type: primary action/state
Desktop checkboxes should appear only on hover and focus.
【翻譯】
復選框可以是主要操作或輔助操作。
類型：主要操作/狀態
桌面復選框只應在懸停和焦點上顯示。
[圖片上傳失敗...(image-11f7ba-1552294894386)]
The checkbox is the primary action and the state indicator for the list item.
【翻譯】
復選框是列表項的主要操作和狀態指示器。
Type: secondary action
Separate target
When controlling a family of variables, consider using switches instead.
【翻譯】
類型：二級動作
單獨目標
當控制一系列變量時，請考慮使用開關。
[圖片上傳失敗...(image-4c63e3-1552294894386)]
The checkbox is the secondary action for the list item.
【翻譯】
該復選框是列表項的輔助操作。
Switch - 開關
Type: secondary action
Separate target
【翻譯】
類型：二級動作
單獨目標
[圖片上傳失敗...(image-8983cd-1552294894386)]
The switch is the secondary action and a separate target.
【翻譯】
開關是輔助操作和單獨的目標。
Reorder - 重新排序
Type: secondary action
Usually a separate target, depending on which mode list it is in.
Allows dragging of the list item to other locations within the list. It usually appears in list editing mode.
【翻譯】
類型：二級動作
通常是一個單獨的目標，取決于它在哪個模式列表。
允許將列表項拖動到列表中的其他位置。它通常出現在列表編輯模式。
[圖片上傳失敗...(image-d1cc82-1552294894386)]
The reorder icon is the secondary action for the list item.
【翻譯】
重新排序圖標是列表項的輔助操作。
Expand/collapse - 展開/折疊
Type: secondary action
Separate target
Expands and collapses a list view vertically to show and hide details of existing list items.
【翻譯】
類型：二級動作
單獨目標
垂直擴展和折疊列表視圖以顯示和隱藏現有列表項的詳細信息。
[圖片上傳失敗...(image-d2f1e3-1552294894386)]
By touching the list control, the user expands the list.
【翻譯】
通過觸摸列表控件，用戶將展開列表。
[圖片上傳失敗...(image-e9ddf7-1552294894386)]
The list is expanded.
【翻譯】
列表被擴展。
[圖片上傳失敗...(image-8bfb3b-1552294894386)]
Collapsed single-line item
【翻譯】
折疊的單行項目
Expanded single-line item
【翻譯】
展開的單行項目
Leave-behinds
Type: Other
A leave-behind is an informative hint as to what swiping a list item away will do to that item. The leave-behind can transform into an action.
Swiping on a list item from either direction will reveal an icon indicating the action. After swiping, a follow-up action can appear as a text button within the space of the list item.
【翻譯】
類型：其他
留下是一個提示性的提示，即清除項目將會對該項目執行什么操作。留下的東西可以變成一個動作。
從任一方向在列表項上滑動將顯示指示動作的圖標。在滑動后，后續操作可以作為列表項目空間中的文本按鈕顯示。
[圖片上傳失敗...(image-f83c90-1552294894386)]
Swiping on a list item from right to left will reveal an icon indicating the action.
【翻譯】
從右向左滑動列表項將顯示一個表示操作的圖標。
[圖片上傳失敗...(image-a47af-1552294894386)]
Swiping on a list item from left to right will reveal an icon indicating the action.
【翻譯】
在列表項上從左向右滑動將顯示指示操作的圖標。
Types of menu controls - 菜單控件的類型
A menu is a special type of list. In menus, use controls that are appropriate for dropdown menus, overflow menus, and so on. Don’t use these controls in regular lists. Use the regular list controls instead.
【翻譯】
菜單是一種特殊類型的列表。在菜單中，使用適用于下拉菜單，溢出菜單等的控件。不要在常規列表中使用這些控件。請改用常規列表控件。
Check - 檢查
Type: state
Not a separate target.
Menus only. Indicates that the list item has been selected. The selection is done through a different control.
【翻譯】
類型：狀態
不是一個單獨的目標。
僅菜單。表示已選擇列表項。通過不同的控制來進行選擇。
[圖片上傳失敗...(image-3bcc11-1552294894386)]
The check indicates that the list item has been selected.
【翻譯】
檢查表示已選擇列表項。
Inline information - 內聯信息
Type: secondary info
Not a separate target.
Menus only. Inline information is a small snippet of text related to the line title that can provide information or a tip, like a keyboard shortcut. It cannot be truncated.
【翻譯】
類型：次要信息
不是一個單獨的目標。
僅菜單。內聯信息是與線標題相關的一小段文本，可提供信息或提示，如鍵盤快捷鍵。它不能被截斷。
[圖片上傳失敗...(image-c5dac1-1552294894386)]
The inline information for Bold, Italic and Underline provide keyboard shortcuts.
【翻譯】
Bold，Italic和Underline的內聯信息提供鍵盤快捷鍵。
**Nested menu indicator - 嵌套菜單指示器 **
Type: primary action
Not a separate target.
Menus only. The glyph indicates that a secondary menu will fly out upon hover, focus, and/or selection.
【翻譯】
類型：主要操作
不是一個單獨的目標。
僅菜單。字形表示當懸停，聚焦和/或選擇時，輔助菜單將飛出。
[圖片上傳失敗...(image-cbc97-1552294894386)]
The glyphs for the menu items indicate that a secondary menu will fly out upon hover, focus, and/or selection.
【翻譯】
菜單項的字形表示當懸停，聚焦和/或選擇時，輔助菜單將飛出。
