Android button background is taking the primary color

Question

I've this issue, I don't know where it come from, I've created this buttons with custom background, but the background color talking the primary color and cannot change it unless change the primary color.

<Button
    android:id="@+id/btn_teacher"
    style="@style/normalText"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="@dimen/_16sdp"
    android:background="@drawable/btn_rounded_stroke"
    android:text="@string/txt_teacher" />

    <resources>
        <color name="colorPrimary">#008577</color>
        <color name="colorPrimaryDark">#00574B</color>
        <color name="colorAccent">#D81B60</color>
        <color name="bg_color">#FFD7A4</color>        
    </resources>

I have many buttons with different colors, so i can't change the primary color

here is my drawable background

 <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item >
        <shape android:shape="rectangle"  >
            <size android:height="@dimen/_48sdp" />
            <corners android:radius="@dimen/_24sdp" />
            <stroke android:width="@dimen/_1sdp" android:color="#59CECE" />
            <solid android:color="@android:color/white"/>
        </shape>
    </item>

</layer-list>

I'm using new material design by google

implementation "com.google.android.material:material:1.3.0-alpha02"

How can i override this color?

Answer 1

Since you are using a Theme.MaterialComponents.* your Button is replaced at runtime by a MaterialButton.

Currently the backgroundTint is still the default MaterialButton style. It means that if you are using a custom android:background, you have to make sure to null out backgroundTint to avoid that the custom background doesn't get tinted with the attr/colorPrimary defined in your theme.

You have to add app:backgroundTint="@null":

  <Button
    app:backgroundTint="@null"
    android:background="@drawable/.."

---

In any case you don't need a custom background (btn_rounded_stroke) in your case. You are just using a custom background only to define rounded corners. This feature is provided by default by the MaterialButton, then just use the cornerRadius attribute.

Use the standard MaterialButton:

    <com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="48dp"
        style="@style/Widget.MaterialComponents.Button.OutlinedButton"
        app:strokeColor="#59CECE"
        app:cornerRadius="24dp"