列表是包含元素的容器,具有内置的滚动和焦点功能。

原则
清晰的组织结构:列表应以清晰且易于浏览的垂直排列方式呈现信息。
一致的商品呈现方式:列表项应遵循一致的视觉结构。
可聚焦性与导航:在依赖方向性导航的界面中,列表必须清晰指示聚焦的项。
互动性:列表项通常表示可选择或可操作的元素。
使用和放置
列表可以包含各种具有可重复元素的同级内容。与堆栈不同,列表会填充应用视图容器。

使用遮罩来指示溢出内容
当列表包含的项数超过视图可容纳的项数时,会在列表边界附近使用黑色幕帘。

列表可以根据需要使用标题
为了清晰起见,可以在列表中使用静态或粘性标题。
错误做法
每个视图包含多个列表,这在视觉上和专注度方面都令人难以承受。
使用深度来指示焦点
列表项在未聚焦和聚焦状态下,深度介于 0 和 +4 之间。

列表项可以具有可操作性
列表中的项目可以充当操作。将操作保留在列表项中
解剖学
列表由滚动容器和间距一致的列表项组成。当商品数量超过视口时,列表应垂直滚动,并尽量减少过冲。
A. 容器 - 可滚动区域
B. 列表项
C. 系统栏
List
Item:列表中的每个单独元素。
A. 形状
B. 边框
C. 前置图标
D. 文字内容
E. 尾随指标
自定义
大多数自定义操作都是通过列表项完成的。
| 属性 | 自定义 | 默认值 |
|---|---|---|
| 列表项:形状 | 是 | 40 dp |
| 列表项:前置和后置图标 | 是 | 中等符号图标 |
| 列表项:填充值 | 是 | 2 天 DP,20 天 DP |
| 列表项:内容 | 是 | 单行:一个 Text 可组合函数,用于显示主要标签,使用 Body Small 双行:一个 Column,包含两个 Text 可组合函数,用于显示主要标签和次要标签 主要:Title Small 次要:Body Small |
| 列表:verticalArrangement | 是 | 20 dp |