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

Question

I\'m using the new material components com.google.android.material:material with android x but I can\'t set a custom background to the button.

I know that I

Answer 1

In the Material Components Library, the MaterialButton has a default style with insetBottom and insetTop with a value of 6dp.

You can change it using:

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

If you want to change the background color you can use the app:backgroundTint attribute or you can override some theme attributes from a default style then you can use new materialThemeOverlay attribute.

In your case you can do something like:

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

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

Finally starting with the version 1.2.0-alpha06 you can use the android:background attribute in the MaterialButton.

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

Answer 2

Looking at https://medium.com/@velmm/material-button-in-android-e4391a243b17 I found that app:backgroundTint (and app:backgroundTintMode) works. It changes a color, but not a drawable selector.

Also you can replace <Button with <android.widget.Button.

Answer 3

I face the same issue when I use state drawable in a Button but It does not change the background of the button. After searching for a long time, I found 2 solutions as below:
The first solution is change the application theme from MaterialComponents to AppCompat in values/themes.xml file. then state drawable will work well.

to

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

If you still want to use MaterialComponents theme then you can try the second solution.
Use <android.widget.Button instead of <Button or <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" />

The second solution I found at Here

Answer 4

The documentation for the MaterialButton class says:

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.

However, the GitHub readme says:

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.

This mentions only left/right inset, but the Attributes section of the readme shows that all four insets are supported:

So you could add these attributes to your <MaterialButton> tag:

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