列表

列表是连续的、垂直的元素索引。使用 ScalingLazyColumn 在 Wear OS 上创建列表。

ScalingLazyColumnLazyColumn 的定制版本,专为 Wear OS 构建。列表提供缩放和透明度,允许内容在屏幕顶部和底部缩小和淡出,以帮助用户了解重点关注的内容。列表锚定在屏幕中心,这为列表中间的项目提供了额外的强调。

列表可以包含固定或可变高度的项目。列表内容应有足够的边距以适应圆形屏幕。

内边距

根据元素,创建列表时使用标准化的内边距。如果更复杂的列表需要额外的垂直内边距,间距以 4 dp 的倍数设置以保持一致性。

部分之间

顶部、中部和底部部分之间的内边距应设置为 16 dp。

标题和内容之间

顶部、中部和底部部分之间的内边距应设置为 12 dp。

槽位之间

中部部分的槽位之间的内边距应设置为 16 dp。

组之间

槽位内的组之间的内边距应设置为 8 dp。

元素之间

组内的元素之间的内边距应设置为 4 dp。

吸附行为

滚动时为了强调列表项,请使用吸附。当项目较高但不高于屏幕时使用吸附。

吸附行为有两种形式。ItemCenter 使用项目中心作为参考点。ItemStart 使用项目边缘作为参考点。使用前者将一个项目居中在屏幕上,使用后者将两个项目居中在屏幕上。使用 anchorType 参数设置此行为。

为了进一步控制列表中的吸附行为,请将 flingBehavior 设置为 ScalingLazyColumnDefaults.snapFlingBehavior,并将 rotaryScrollableBehavior 设置为 RotaryScrollableDefaults.snapBehavior

用法

请参阅以下关于如何在手表上使用列表的示例。

自适应布局

以下图片展示了自适应布局的几个示例。有关实现指南,请访问针对不同屏幕尺寸进行开发页面。

响应式行为

列表组件会拉伸以填充较大显示屏上的可用宽度。

顶部外边距

顶部外边距根据顶部部分包含哪些元素而有所不同。

列表以标题开头

列表以 1 个或 2+ 个按钮开头

列表以其他元素开头

底部外边距

底部外边距根据底部部分包含哪些元素而有所不同。

列表以按钮结尾

列表以其他元素结尾

侧边外边距

所有列表类型的侧边外边距都使用标准的 5.2% 比例,以确保在较大显示屏上的可伸缩性。

内部外边距

标题

增加了 7.3% 的内部外边距,以确保标题不被裁剪。

底部按钮

底部按钮填充了超过 225 断点的可用宽度。为了保持视觉层级,在较大屏幕上增加了 14.56% 的内部内边距。