按钮允许用户触发定义的操作。有五种类型的按钮
类型 |
外观 |
用途 |
---|---|---|
填充 | 具有对比色文本的实心背景。 |
用于主要操作,例如“提交”和“保存”。阴影效果突出了按钮的重要性。 |
色调 | 背景颜色变化以匹配表面。 |
用于主要或重要操作。填充按钮提供视觉权重,适用于“添加到购物车”和“登录”等操作。 |
凸起 | 阴影使其脱颖而出。 |
用于主要或重要操作。增加海拔高度以使按钮更加突出。 |
带边框 | 具有边框,无填充。 |
用于重要但不是主要的操作。带边框的按钮与其他按钮配对,以指示替代的次要操作,例如“取消”或“后退”。 |
文本 | 没有背景或边框的文本。 |
用于不太重要的操作,例如导航链接或次要操作,例如“了解更多”或“查看详细信息”。 |
版本兼容性
此实现要求您的项目 minSDK 设置为 API 级别 21 或更高。
依赖项
创建填充按钮
填充按钮组件使用基本 Button
可组合项。默认情况下,它填充了纯色。
结果

创建填充色调按钮
填充色调按钮组件使用 FilledTonalButton
可组合项。默认情况下,它填充了色调颜色。
结果

创建带边框的按钮
带边框的按钮组件使用 OutlinedButton
可组合项。默认情况下,它显示为带边框。
结果

创建凸起按钮
凸起按钮组件使用 ElevatedButton
可组合项。默认情况下,它具有表示凸起效果的阴影,并显示为带阴影的带边框按钮。
结果

创建文本按钮
文本按钮组件使用 TextButton
可组合项。在点击之前,它仅显示为文本。默认情况下,它没有实心填充或边框。
结果

要点
onClick
:用户按下按钮时调用的函数。enabled
:当为 false 时,此参数会导致按钮显示为不可用且处于非活动状态。colors
:ButtonColors
的实例,用于确定按钮中使用的颜色。contentPadding
:按钮内的填充。
包含本指南的收藏集
本指南是涵盖更广泛的 Android 开发目标的这些精选快速指南收藏集的一部分

显示交互式组件
了解可组合函数如何使您能够轻松创建基于 Material Design 设计系统的精美 UI 组件。
有疑问或反馈
访问我们的常见问题页面,了解快速指南,或联系我们分享您的想法。