使用 Button 组件执行用户易于理解且不需要文本标签的操作。按钮与其圆形形状区分于芯片。
结构
A. 内容
按钮只有一个插槽保留给图标或文本。选择与按钮执行的操作相关的图标。如果图标无法描述相关操作,则可以使用最多三个字符的文本。如果图标无法清晰地描述操作,请考虑使用芯片组件。
B. 容器
按钮容器仅限于单一纯色填充。
切换按钮
切换按钮 使用户能够在两种状态之间切换。
紧凑型按钮
紧凑型按钮 显得较小,但具有更大的可点击区域。默认的可点击区域为 48x48 dp。
层次结构
使用不同的颜色填充来表示按钮层次结构。
高强调
高强调按钮包含应用的主要操作。对于高强调按钮,请为容器使用主要或次要颜色,为内容使用主要颜色和次要颜色。有关更多信息,请参阅 Wear Material 主题。
中等强调
中等强调按钮以对比度较低的颜色填充来区分。它们包含的操作不如主要操作重要。为容器使用界面颜色,为内容使用界面颜色。
或者,为中等强调按钮使用自定义 OutlinedButton 组件。它具有透明背景、60% 不透明度的主要变体彩色描边和主要彩色内容。
低强调(仅限图标)
低强调按钮以没有填充来区分。它们最适合手表表盘上的较小区域,在这些区域需要紧凑的排列。为内容使用界面颜色。
尺寸
使用不同尺寸的按钮来强调或弱化操作。
大型
图标 (30 x 30 dp)
容器 (60 x 60 dp)
默认
图标 (26 x 26 dp)
容器 (52 x 52 dp)
小型
图标 (24 x 24 dp)
容器 (48 x 48 dp)
特小型
图标 (24 x 24 dp)
容器 (32 x 32 dp)
建议在此按钮周围添加其他填充,以创建至少 48 dp 的点击目标。这是我们为无障碍功能设置的最小点击目标尺寸。
用法
使用标准按钮使用户能够执行单个操作,例如接听或拒绝电话或启动计时器。
使用切换按钮允许用户打开或关闭选项,例如选择和取消选择一周中的日期或暂停和重新启动计时器。
自适应布局
响应行为
1 个按钮
内部填充将保持不变,边距应为百分比,以防止按钮拉伸得太远,并保持相对大小。
2 个按钮
当有 2 个按钮时,会添加百分比内部边距,以防止按钮拉伸得太远,并保持相对大小。
输入法
1 或 2 个按钮
具有 2 个或单个按钮锁定功能的输入法始终会一直延伸到侧边距,无论屏幕尺寸如何。
3 个按钮
在小于 225 dp 的屏幕上,按钮保持圆形且不会拉伸。在 225 dp 或更大的屏幕上,按钮会一直延伸到侧边距。