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? this the image for buttons

Post `@drwable/btn_round_stroke` xml – chand mohd Aug 09 '20 at 15:48 — chand mohd, Aug 09 '20 at 15:48

Gabriele Mariotti · Answer 1 · 2021-04-14T09:42:13.690

39

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"

edited Apr 14 '21 at 09:42

answered Aug 09 '20 at 20:36

Gabriele Mariotti

320,139
94
887
841

tried it not working, it turns it to blue not my custom background – Fath.Saif Aug 11 '20 at 22:44
@Fath.Saif post also style="@style/normalText" – Gabriele Mariotti Aug 12 '20 at 06:58
1

really thank you so much from the bottom of my heart....❤ – Aviroxi Apr 03 '21 at 12:25
Thank you so much!! The parent style `Theme.MaterialComponents.NoActionBar` was the culprit! – 6rchid Mar 19 '23 at 05:33

score 4 · Answer 2 · answered Mar 07 '21 at 15:09

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>

score 2 · Answer 3 · answered Nov 16 '21 at 19:39

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"/>

score 0 · Answer 4 · edited Aug 09 '20 at 16:01

0

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>

edited Aug 09 '20 at 16:01

Satan Pandeya

3,747
4
27
53

answered Aug 09 '20 at 15:51

Pratik Fagadiya

1,195
7
21

here is my drawable class but nothing change: ---------------------------------------------------------------------------- – Fath.Saif Aug 09 '20 at 16:36

score 0 · Answer 5 · answered Jan 12 '21 at 10:21

0

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'

answered Jan 12 '21 at 10:21

Mahmoud Zaher

559
6
6

score 0 · Answer 6 · edited May 09 '21 at 07:51

0

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.

edited May 09 '21 at 07:51

AndroidFreak

866
1
10
31

answered May 07 '21 at 17:18

Ansh Jaiswal

1

Android button background is taking the primary color

6 Answers6

Linked

Related