53

In this android project im creating a default button style. my styles.xml

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:buttonStyle">@style/ButtonStlye123</item>
</style>

<style name="ButtonStlye123" parent="android:style/Widget.Button">
    <item name="android:textSize">19dp</item>
    <item name="android:layout_margin">8dp</item>
    <item name="android:padding">8dp</item>
    <item name="android:textColor">@color/ColorDivider</item>

    <item name="android:background">@color/ColorAccent</item>
</style>

my button in a fragment.

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/btnLogin"
    android:id="@+id/btn_login"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:theme="@style/ButtonStlye123"
    android:onClick="login" />

In the preview in android studio it looks exactly like I want, but when I run the app on my device the background color is gray ("default button color"). If i change the text color in my styles.xml like:

<item name="android:textColor">@color/ColorPrimary</item>

it changes (also on my device) so the custom style is loading, i tryd different colors (that worked for the text) for the button but it wont change.

Why isnt my background color loading?

Sven van den Boogaart
  • 11,134
  • 17
  • 82
  • 155

10 Answers10

159

Try use AppCompactButton instead of

<Button

use

<androidx.appcompat.widget.AppCompatButton

that will do the trick

Update: 01/06/2021

Found out that the above will not work on earlier Android versions. For materiel design Button use

app:backgroundTint="@color/green"
Hezy Ziv
  • 2,778
  • 2
  • 12
  • 8
  • 2
    Interestingly, for me even settings "android:background" directly on the Button did not work. But it works for AppCompatButton. So I guess, it has something to do with the way AppCompatActivity and simple Activity are styled... Anyway, this solution works for me (with AppCompatActivity). – Dmitrii Semikin Dec 02 '20 at 10:35
  • 4
    It worked. But I don't understand the reason behind this. – Aman Dec 23 '20 at 14:45
  • I see this issue is common now. Never knew that changing to `AppCompatButton` would fix it. While this isn't really an answer directed to the original question, it certainly helps us now. – MJV Jan 05 '21 at 01:25
  • 3
    Seems that for a Button, the primary color defined in the app theme takes precedence over any custom background you want to apply to a Button, but it is not the case for the AppCompatButton. Not sure if this is a bug or a feature of Android – ceyquem Jan 05 '21 at 03:06
  • Follow this link https://stackoverflow.com/questions/30556804/difference-between-an-appcompat-view-and-a-normal-android-view?answertab=active#tab-top, we know Button should be AppCompatButton automatically, but actually it's not. – BollMose Feb 04 '21 at 01:21
  • 2
    backdroundTint worked for me, thanks mate. – thesamoanppprogrammer May 02 '21 at 11:06
  • 1
    Worked fine, I guess we are moving from button to AppCompatButton gradually – vin shaba Aug 13 '21 at 13:27
  • Thanks a lot, that's the solution I was looking for. – Dinesh Phalwadiya Nov 27 '21 at 06:20
30

Please Use androidx.appcompat.widget.AppCompatButton insteas of Button.

  <androidx.appcompat.widget.AppCompatButton
        android:id="@+id/button_id_Login"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/textInnputLayout_editText_id_password"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="50dp"
        android:text="@string/Login_screen_button_text"
        android:background="@drawable/login_button_style"
        android:textAllCaps="false">
    </androidx.appcompat.widget.AppCompatButton>
vinay shetty
  • 625
  • 7
  • 13
26
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">

Replace with

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

Changing MaterialComponents to AppCompat works for me..

sagar adhikari
  • 261
  • 3
  • 3
25

You might be using targetSdkVersion 30 material theme

The solution is change theme.xml style

From

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">

To

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
Hor Chanpheng
  • 501
  • 5
  • 7
14

I think you need to change your attribute from "theme" to "style". These files are intended for different things, so are used differently.

Style is used to assign attributes to individual views or components, and Theme is used to apply attributes to the entire app.

So try this instead:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/btnLogin"
    android:id="@+id/btn_login"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    <!-- This attribute was changed -->        
    android:style="@style/ButtonStlye123"
    android:onClick="login" />

You should also split these different types of XML into the correct files as appropriate (styles.xml and themes.xml - instead of keeping them all in the same file). This is convention, and won't effect the code compilation or execution, but is recommended as a code style.

Booger
  • 18,259
  • 7
  • 52
  • 71
  • Is it possible to apply to all buttons automaticly? – Sven van den Boogaart Aug 07 '15 at 10:46
  • If you want to apply a style universally, you would need to create a Java class (of your own custom making), that extends the Button class, and then assign the style in that Java class. Otherwise, there is no built-in way to make a certain style apply universally. You CAN put a lot of attributes in the style (including width, height, etc) so this IS way to centalize this stuff (again, you will need to put that _style_ attribute in XML manually (no way to do this automatically) – Booger Aug 07 '15 at 13:11
  • im trying this http://stackoverflow.com/questions/2410836/how-do-i-apply-a-style-to-all-buttons-of-an-android-application solution but i cant get it to work – Sven van den Boogaart Aug 07 '15 at 13:17
  • I have never used this. I think it is easy enough to just apply the style attribute to each view in XML (don't feel the need to apply that universally). – Booger Aug 07 '15 at 15:09
6

if you are using Android Studio Version 4.1 and above (Beta) check your themes.xml file in values.

<style name="Theme.NavaFlashLightV4" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/purple_500</item>
        <item name="colorPrimaryVariant">@color/purple_700</item>
        <item name="colorOnPrimary">@color/white</item>
</style>

change the attribute to @null

<style name="Theme.NavaFlashLightV4" parent="Theme.MaterialComponents.DayNight.NoActionBar">
            <!-- Primary brand color. -->
            <item name="colorPrimary">@null</item> <!-- HERE -->
            <item name="colorPrimaryVariant">@color/purple_700</item>
            <item name="colorOnPrimary">@color/white</item>
    </style>

for other old versions of Android Studio

just change this attribute

<item name="colorPrimary">@color/colorPrimary</item>

to

        <item name="colorPrimary">@color/@null</item>

finally set the background of the button to the drawable icon you want. example:

<Button
        android:id="@+id/btnSwitch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="@drawable/ic_launcher_background" /> <!--the drawable you want-->
Samer Kasseb
  • 172
  • 3
  • 10
  • Setting the primary color to null causes the app to crash on Android Studio 4.2. – Andrew S Feb 08 '22 at 06:46
  • I think if you want to properly style your app and especially the buttons you need to stop using the MaterialComponents style as they replace the buttons with appCompat equivalents causing complexities. – Andrew S Feb 08 '22 at 07:01
6

You only need to change your App Theme from Theme.MaterialComponents.DayNight.DarkActionBar to Theme.AppCompat.Light.NoActionBar inside styles.xml file

example :

from : style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar"

To : style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"

Deepanshu
  • 103
  • 1
  • 3
3

Use this attribute backgroundTint it will help you. It work for me. Example :

android:backgroundTint="@color/md_orange_800"
Aldan
  • 529
  • 6
  • 20
  • This doesn't work well when using a drawable as background so changing to AppCompatButton is the better option so far as mentioned here https://stackoverflow.com/a/66950268/8015914 – Loveth Sep 28 '21 at 09:18
0

your style should be like this....

<style name="ButtonStlye123" >
    <item name="android:textSize">19dp</item>
    <item name="android:layout_margin">8dp</item>
    <item name="android:padding">8dp</item>
    <item name="android:textColor">@color/ColorDivider</item>

    <item name="android:background">@color/ColorAccent</item>
</style>

and in layout

<Button
     android:id="@+id/btn3"
     style="@style/ButtonStlye123"
     android:layout_width="@dimen/sixzero"
     android:layout_height="@dimen/sixzero"
     android:text="3" />
Shabbir Dhangot
  • 8,642
  • 9
  • 58
  • 78
0

I am using targetSdk 30 and compileSdk 32 and I am using Button widget. Android Studio version 2021.1.1

In my case, following change worked,

In AndroidManifest.xml, under "application" tag changing "android:theme" from

android:theme="@style/Theme.AppCompat.Light.NoActionBar"

to

android:theme="@style/Theme.MaterialComponents.DayNight.NoActionBar"

I moved to Theme.AppCompat.Light.NoActionBar to remove the title bar. At first I tried to change "style" to "Theme.AppCompat.Light.NoActionBar" inside themes.xml but it didn't work for me.