摘要

了解 Compose 布局模板和示例设计布局,以便设计和构建独特的应用界面。

大多数应用都使用非滚动或滚动布局,其中包含以下元素:

  • 时间文本:鉴于设备是手表,我们建议即使在应用历程中也显示时间文本(可选,但建议这样做)。
  • 页面标题:导航信息和提醒用户当前在旅程中的位置(可选,但建议填写)。
  • 滚动指示器:仅适用于滚动布局;表示屏幕折叠线下方还有内容。
  • 操作按钮:建议放置在底部;用于确认、结束或继续用户体验历程。

应用布局部分

顶部版块

顶部部分提供了时间文本、紧凑按钮和标题选项,可用作路线查找器和清晰的导航工具。所有这些都是可选的。

在页面非常长的特殊情况下,可以使用紧凑型按钮,搜索或操作按钮可帮助用户浏览列表,而无需滚动到底部。

中间部分

中间部分可以包含列表中的任何可用 Compose(非全屏)或自定义组件。此部分可以包含用于分组内容的其他标题和滚动条。

中间内容部分中的所有组件都应采用响应式设计,填充可用宽度,直到达到百分比边距。所有滚动布局都将具有缩放延迟列行为,显示组件缩放并淡出屏幕。

底部版块

底部部分可用于放置主要操作按钮和次要操作按钮,如果这是历程的结束,则可以留空。

建议使用列表底部的边缘贴合按钮,因为它可以充分利用有限的空间,并与圆形屏幕相得益彰。

您可能需要多个操作,这些操作可以显示在按钮堆叠或两个图标的按钮组中。

非滚动应用视图

带标题
无标题

包含标题但不含底部部分
不含标题或底部部分

滚动应用视图

带标题
无标题

包含标题但不含底部部分
不含标题或底部部分