创建按钮

按钮让用户能够触发定义的动作。按钮共有五种类型

类型

外观

用途

填充式

实心背景,文字对比鲜明。

用于主要操作,例如“提交”和“保存”。阴影效果强调了按钮的重要性。

色调填充式

背景颜色随表面变化。

用于主要或重要操作。填充式按钮提供视觉上的突出感,适用于“添加到购物车”和“登录”等操作。

凸起式

阴影使其更加突出。

用于主要或重要操作。增加凸起度可使按钮更显眼。

轮廓式

具有边框,无填充。

用于重要但不主要的操作。轮廓式按钮与其他按钮搭配使用效果很好,可用于指示替代的次要操作,例如“取消”或“返回”。

文本

无背景或边框的文本。

用于不太重要的操作,例如导航链接,或“了解详情”或“查看详细信息”等次要操作。

版本兼容性

此实现要求您的项目 minSDK 设置为 API 级别 21 或更高版本。

依赖项

创建填充式按钮

填充式按钮组件使用了基本的 Button 可组合项。默认情况下,它填充有纯色。

结果

A filled button with a purple background that reads, 'filled'.
图 1. 填充式按钮。

创建色调填充式按钮

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

结果

A tonal button with a light purple background that reads, 'filled'.
图 2. 色调填充式按钮。

创建轮廓式按钮

轮廓式按钮组件使用了 OutlinedButton 可组合项。默认情况下,它带有轮廓。

结果

A transparent outlined button with a dark border that reads, 'Outlined'.
图 3. 轮廓式按钮。

创建凸起式按钮

凸起式按钮组件使用了 ElevatedButton 可组合项。默认情况下,它带有代表凸起效果的阴影,外观类似于带阴影的轮廓式按钮。

结果

An elevated button with a gray background that reads, 'Elevated'.
图 4. 凸起式按钮。

创建文本按钮

文本按钮组件使用了 TextButton 可组合项。在点击之前,它只显示为文本。默认情况下,它没有纯色填充或轮廓。

结果

A text button that reads 'Text Button'
图 5. 文本按钮。

要点

  • onClick:当用户按下按钮时调用的函数。
  • enabled:如果为 false,此参数将使按钮显示为不可用且处于非活动状态。
  • colors:一个 ButtonColors 实例,用于确定按钮中使用的颜色。
  • contentPadding:按钮内的内边距。

包含本指南的合集

本指南属于这些精心策划的快速指南合集,涵盖了更广泛的 Android 开发目标

了解如何使用可组合函数轻松创建基于 Material Design 设计系统的美观 UI 组件。

有疑问或反馈?

访问我们的常见问题页面,了解快速指南,或者联系我们,告知您的想法。