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?

Viscacha

Post @drwable/btn_round_stroke xml – Danndanna

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"

Highflier

tried it not working, it turns it to blue not my custom background – Viscacha

@Viscacha post also style="@style/normalText" – Highflier

really thank you so much from the bottom of my heart....❤ – Cystic

Thank you so much!! The parent style Theme.MaterialComponents.NoActionBar was the culprit! – Raeleneraf

Answer 2

When Material theme is used then Button view is mapped to MaterialButtton. There is one more way to setup the button background in this case.

    <style name="AppTheme" parent="Theme.MaterialComponents.DayNight.DarkActionBar"
...
        <item name="materialButtonStyle">@style/ColoredButton</item>
    </style>

    <style name="ColoredButton" parent="Widget.MaterialComponents.Button.TextButton">
        <item name="backgroundTint">@color/customButtonColor</item>
    </style>

Montage

Answer 3

What worked for me

First create btn_style in your styles.xml or themes.xml

<style name="btn_style" parent="Widget.MaterialComponents.Button">
    <item name="backgroundTint">@null</item>
</style>

then in you layout apply the style and use the color or drawable that you want

        <Button
            android:id="@+id/btn"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textStyle="bold"
            android:background="@color/Red"
            style="@style/btn_style"
            android:text="Button"/>

Ejective

Answer 4

In your Gradle just replace this line

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

with this

 implementation 'com.google.android.material:material:1.2.1'

Brutify

Answer 5

All you need to do is simply go to your themes.xml file and change the style name to:

style name="Theme.AnimatedLogin" 
parent="Theme.AppCompat.Light.NoActionBar"

in Light theme mode and to:

style name="Theme.AnimatedLogin"
parent="Theme.AppCompat.DayNight.NoActionBar"

in Dark theme mode in your theme.xml(night) file and then you can customize your button and change its colour.

Picoline

Answer 6

Try this .

Your Button:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textColor="#FFFFFF"
    android:layout_margin="5dp"
    android:background="@drawable/round_btn"
    android:padding="20dp"
    android:text="My Text" />

Here is your round_btn drawable:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#008577" />
    <corners android:radius="20dp" />
</shape>

Cabinda

here is my drawable class but nothing change: ---------------------------------------------------------------------------- <layer-list xmlns:android="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> – Viscacha