磁贴最佳实践
使用集合保持井然有序 根据您的偏好保存和分类内容。

在黑色背景上设计
在黑色背景上进行设计对 Wear OS 至关重要,原因有二:
- 省电:屏幕上每个点亮的像素都会消耗电量。通过使用黑色背景,您可以最大程度地减少活动像素的数量,从而延长电池续航时间。
- 无缝美感:黑色背景有助于在视觉上最大程度地减少表圈,营造出表面延伸至设备边缘的连续感。将界面元素限制在此空间内可进一步增强此效果。
check_circle
这样做
始终将背景颜色设置为黑色。
cancel
不要这样做
不要将背景设置为完全出血图像或色块。
仅包含必要元素
选择启用后(例如,使用 ProtoLayout Material3 PrimaryLayout),Wear OS 会自动显示永久性应用图标,该图标会在用户滚动浏览磁贴轮播界面时自动显示。应用图标不应作为磁贴的一部分进行设计和添加。
如果您的磁贴具有动态主题,请确保提供的应用图标是单色的。请查看 Android 产品图标指南,了解如何为您的品牌创建应用图标。
check_circle
这样做
Wear OS 可能会在用户滚动浏览磁贴轮播界面时自动显示应用图标。无需将应用图标放入磁贴设计中。
cancel
不要这样做
请勿将应用图标添加到磁贴设计中,因为如果在系统层面也显示该图标,它可能会出现两次或重叠。
隐藏应用标题以确保最小可点按区域
为了确保在较小屏幕上有足够的空间用于交互元素,当磁贴使用两行(和一个底部部分)时,可以隐藏应用标题。这确保了行足够高(至少 48dp)。标题可以在较大屏幕上重新显示(225dp+)。
check_circle
这样做
在小屏幕上,应用标题被隐藏,以确保两行具有最小高度和 48dp 的可点按区域。
cancel
不要这样做
如果在小屏幕上不隐藏应用标题并使用两行,则组件的高度将不符合我们的无障碍标准,并且小于最小可点按区域大小。在此示例中,按钮的空间小于 48dp,因此会被剪裁。
选择突出显示单个主要用例
为了确保用户知道如何使用每个磁贴(无论是打开应用、启动活动还是了解更多信息),我们需要它们在布局中包含至少一个交互元素。
check_circle
这样做
这个特定的磁贴很有效,因为它提供了一小部分选项,然后可以选择查看更多内容
cancel
不要这样做
此解决方案对用户帮助较小,因为它提供了太多选项,导致用户难以做出决定
包含(至少)一个容器
应用中的每个磁贴必须包含至少一个容器元素并完全可点按,链接到应用内相应的屏幕。无论容器中的信息还是独立显示的信息,都必须清晰地传达链接的内容或可用的操作。
如果使用按钮,它们应符合标准设计约定并明确指示其功能。
check_circle
这样做
此磁贴效果很好,因为用户可以对提供的每个功能执行操作,因为它们具有清晰的点按功能区
cancel
不要这样做
此磁贴效果较差,因为它没有明确指出用户可以点按内容以查看更多信息
使操作一目了然
手表上的体验没有充足的空间来传达其含义,因此最有效的磁贴具有易于预测的交互组件。
check_circle
这样做
成功的磁贴充分利用了可用空间来清晰地传达每项操作的结果
cancel
不要这样做
此磁贴中的操作不明确——带有专辑封面的容器会将用户带到哪里,这与“播放”按钮不同吗?
在视觉上优先处理操作
为了帮助用户理解磁贴上最重要的操作,应在视觉上优先处理交互式容器。
- 在主要操作按钮上使用主色。
- 在次要操作上使用次要/第三色
check_circle
这样做
此磁贴结合使用了填充样式(使用主色和次要颜色角色)以及清晰的第三底部按钮角色,使用色调填充样式
cancel
不要这样做
此磁贴使用了太多填充样式的按钮,此外所有按钮都使用了主色角色
简化到更少的容器
磁贴应避免使用多个交互组件来触发特定操作,而应尝试将整体布局简化到更少的容器。
check_circle
这样做
此磁贴使用了多个容器,每个容器都充当一个按钮来执行特定操作,例如开始计时器或创建新的计时器
cancel
不要这样做
此处使用 4 个容器是不必要的,因为所有信息都将导航到同一位置
将容器用于功能目的
为了确保用户可以预测磁贴中每个组件的功能,我们不建议将容器用于装饰或结构目的,以避免点按无效。
check_circle
这样做
此解决方案有效,因为磁贴的唯一操作是创建流程,所有其他内容都浮动在黑色背景上
cancel
不要这样做
此磁贴更令人困惑,因为用户似乎可以与所有容器互动
显示图表和图表的快速查看表示
快速查看是 Wear OS 设计的关键。由于屏幕时间有限(约 7 秒),请优先以清晰易懂的格式显示必要信息,以便一目了然。
请记住,手表补充了手机体验,提供了对关键详情的快速访问。
check_circle
这样做
显示数字或统计信息的快速查看表示,并允许用户在需要时点按以在应用中查看更多信息
cancel
不要这样做
在磁贴上显示详细的数字或统计信息
本页上的内容和代码示例受 内容许可 中所述许可的约束。Java 和 OpenJDK 是 Oracle 和/或其关联公司的商标或注册商标。
上次更新时间:2025 年 5 月 20 日 UTC。
[[["易于理解","easyToUnderstand","thumb-up"],["解决了我的问题","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少所需信息","missingTheInformationINeed","thumb-down"],["太复杂 / 步骤过多","tooComplicatedTooManySteps","thumb-down"],["过时","outOfDate","thumb-down"],["示例 / 代码问题","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新时间:2025 年 5 月 20 日 UTC。"],[],[]]