Material Design 按钮自定义背景色时如何保留涟漪和浮动效果？

Material Design 按钮背景色自定义难题

Material Design 按钮是我们日常开发中常用的交互元素，它拥有涟漪效果、浮动效果等视觉效果，为用户提供良好的交互体验。然而，在使用自定义背景色时，这些效果可能会消失，令人头疼。

问题根源

当我们使用 Android v21 支持库时，自定义背景色的按钮可能会失去 Material Design 效果。这是因为按钮的主题可能会被背景色覆盖，从而导致效果失效。

解决方案

为了解决这个问题，我们有两种方案：

方案 1：使用 ColorStateList

ColorStateList 允许我们定义按钮在不同状态（如按下、未按下）下的背景色。通过这种方式，我们既可以自定义背景色，又可以保留 Material Design 效果。

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
          android:color="@color/my_custom_pressed_color" />
    <item android:state_enabled="true"
          android:color="@color/my_custom_enabled_color" />
    <item android:color="@color/my_custom_default_color" />
</selector>

接下来，将 ColorStateList 设置为按钮的背景属性：

<Button
    android:background="@drawable/my_custom_color_state_list"
    ... />

方案 2：使用 AppCompat v7 兼容库

AppCompat v7 兼容库为 Material Design 控件提供了向后兼容支持。即使在较旧的 Android 版本上，也可以使用 Material Design 按钮效果。

<android.support.v7.widget.AppCompatButton
    android:background="?attr/colorPrimary"
    ... />

总结

通过使用 ColorStateList 或 AppCompat v7 兼容库，我们可以在自定义按钮背景色的同时保留 Material Design 效果。这让我们能够创建既具有自定义外观又符合 Material Design 指南的按钮。

常见问题解答

1. 什么是 Material Design 按钮？

Material Design 按钮是一种具有涟漪效果和浮动效果的交互元素，可增强用户交互体验。

2. 为什么使用自定义背景色会失去 Material Design 效果？

因为自定义背景色可能会覆盖按钮的主题，导致效果失效。

3. ColorStateList 是什么？

ColorStateList 允许我们定义按钮在不同状态下的背景色，既可以自定义颜色，又可以保留效果。

4. AppCompat v7 兼容库如何帮助解决问题？

AppCompat v7 兼容库为 Material Design 控件提供了向后兼容支持，即使在较旧的 Android 版本上也可以使用效果。

5. 如何在使用自定义背景色时保留效果？

可以使用 ColorStateList 或 AppCompat v7 兼容库来保留效果，同时自定义背景色。