无法将 android:background 与新 material 组件中的按钮一起使用

Can't use android:background with button from the new material components

我将新的 material 组件 com.google.android.material:material 与 android x 一起使用,但我无法为按钮设置自定义背景。

我知道我可以用app:backgroundTint来改变颜色

但是默认背景有一些我想去掉的填充,以及使用 android:background 设置我自己的背景的旧方法,但这不再有效。

我查看了 docs,但找不到任何提及此更改的内容。

The documentation for the MaterialButton class 说:

Do not use the android:background attribute. MaterialButton manages its own background drawable, and setting a new background means MaterialButton can no longer guarantee that the new attributes it introduces will function properly. If the default background is changed, MaterialButton cannot guarantee well-defined behavior.

然而,the GitHub readme 表示:

Note: MaterialButton is visually different from Button and AppCompatButton. One of the main differences is that AppCompatButton has a 4dp inset on the left and right sides, whereas MaterialButton does not.

这只提到了 left/right 插图,但是自述文件的 the Attributes section 显示支持所有四个插图:

所以您可以将这些属性添加到您的 <MaterialButton> 标签中:

android:insetTop="0dp"
android:insetBottom="0dp"

在Material组件库中,MaterialButton的默认样式为insetBottominsetTop的默认样式为6dp

您可以使用以下方式更改它:

  <com.google.android.material.button.MaterialButton
      android:insetTop="0dp"
      android:insetBottom="0dp"
      ../>

如果你想改变背景颜色你可以使用app:backgroundTint属性或者你可以覆盖默认样式的一些主题属性然后你可以使用新的materialThemeOverlay 属性.

在你的情况下,你可以这样做:

<style name="MtButtonStyle"
 parent="Widget.MaterialComponents.Button">
   <item name=“materialThemeOverlay”>@style/GreenButtonThemeOverlay</item>
</style>

<style name="GreenButtonThemeOverlay">
  <item name="colorPrimary">@color/green</item>
</style>

最后从版本 1.2.0-alpha06 开始,您可以在 [=13] 中使用 android:background 属性=].

<MaterialButton
    app:backgroundTint="@null"
    android:background="@drawable/button_drawable"
    ... />

查看 https://medium.com/@velmm/material-button-in-android-e4391a243b17 我发现 app:backgroundTint(和 app:backgroundTintMode)有效。它改变颜色,但不改变可绘制选择器。

您可以将 <Button 替换为 <android.widget.Button

当我在 Button 中使用 state drawable 时,我遇到了同样的问题,但它并没有改变按钮的背景。找了半天,找到了如下2个解决方案:
第一个解决方案是在 values/themes.xml 文件中将应用程序主题从 MaterialComponents 更改为 AppCompat。然后 state drawable 会很好地工作。

    <style name="Theme.MyApplication" parent="Theme.AppCompat.DayNight.DarkActionBar">

如果您仍然想使用 MaterialComponents 主题,那么您可以尝试第二种解决方案。
使用 <android.widget.Button 而不是 <Button 或 <com.google.android.material.button.MaterialButton

    <android.widget.Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/state_test"
        android:text="Button" />

我在

找到的第二个解决方案

如果您想使用渐变绘图作为 MaterialButton 的背景,

将您的 MaterialButton 设置如下:

<com.google.android.material.button.MaterialButton
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_margin="16dp"
     app:backgroundTint="@null"
     android:background="@drawable/group_47"
     app:layout_constraintEnd_toEndOf="@+id/input_password"
     app:layout_constraintStart_toStartOf="@+id/input_password"
     app:layout_constraintTop_toBottomOf="@+id/input_password" />

只需使用 android:backgroundTint

<style name="MyButtonStyle" parent="Widget.MaterialComponents.Button">
    <item name="android:backgroundTint">@color/pink</item>
</style>


<com.google.android.material.button.MaterialButton
    android:id="@+id/followButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="@dimen/channel_header_item_margin"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/titeChannelTV"
    style="@style/MyButtonStyle"/>

google 设计团队决定从 material 库的初始版本中排除功能 android:background="@drawable/" 的主要原因是为了使开发人员能够构建一致且以更快的速度为应用程序设计具有专业外观的设计。这是因为像我这样的大多数开发者在做出与应用程序的设计和颜色相关的决定时都很糟糕。

此外,我在迁移到 MDC 时从 google tutorial 中找到了这个片段。

如果您想保留您的

android:background="@drawable/button_background"

并且有MaterialButton尊重它,那么你必须设置

app:backgroundTint="@null"
app:backgroundTintMode="add" // it doesn't matter the value, but it must be set

请注意,您也可以改用 app:background,尽管我已经注意到足够多的重大更改,所以我仍然更喜欢上面的方法。