Android button background color

Question

I am trying to set the background color of a button in my app and I am unable to achieve the result that I want...

The color that I am trying to set is holo_green_light(#ff99cc00). In order to do it, I am using setColorFilter(0xff99cc00, PorterDuff.Mode.MULTIPLY);

The color that I get is not the holo_green_light but a mix of lightgrey and holo_green_light.

I have tried using the LightingColorFilter without much success.

Is there a way to do it programatically, so that the button appears like a button and not a flat rectangle with the color that I need.

try using android:background="@drawable/button" – Giant Aug 06 '13 at 00:58 — Giant, Aug 06 '13 at 00:58

score 90 · Accepted Answer · edited Aug 19 '18 at 15:30

90

If you want to keep the general styling (rounded corners etc.) and just change the background color then I use the backgroundTint property

android:backgroundTint="@android:color/holo_green_light"

edited Aug 19 '18 at 15:30

John Joe

12,412
16
70
135

answered Nov 16 '17 at 10:30

Mark Proctor

936
7
2

16

`android:backgroundTint` will be used only for api >= 21. use `app:backgroundTint` instead – repitch Feb 19 '18 at 09:37
1

@repitch will `app:backgroundTint` worked for every api? – John Joe Aug 19 '18 at 15:30
Between Proctor and Repitch that should be the most common answer to this question – C. Skjerdal Jan 11 '19 at 00:03

score 50 · Answer 2 · edited Oct 20 '21 at 08:27

50

This is my way to do custom Button with a different color:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke android:width="3dp"
        android:color="#80FFFFFF" />
 
    <corners android:radius="25dp" />
 
    <gradient android:angle="270"
            android:centerColor="#90150517"
            android:endColor="#90150517"
            android:startColor="#90150517" />
</shape>

This way you set as background:

<Button android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:layout_marginBottom="25dp"
        android:layout_centerInParent="true"
        android:background="@drawable/button" />

edited Oct 20 '21 at 08:27

Ryan M

18,333
31
67
74

answered Aug 07 '13 at 09:45

Bebin T.N

2,539
1
24
28

14

For noob's like me, it would be helpful if you get be more explicit about where the first code sample should go. Is it a file named Button.xml in the drawables folder? – Zefira Apr 11 '14 at 06:41
2

hai Geoff. please make a drawable folder in the res folder and make one button.xml. please copy paste this code. call this xml in ur Button background. It will work. – Bebin T.N Apr 11 '14 at 07:15

score 18 · Answer 3 · answered Jul 17 '14 at 14:04

18

If you don't mind hardcoding it you can do this ~> android:background="#eeeeee" and drop any hex color # you wish.

Looks like this....

<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/textView1"
    android:text="@string/ClickMe"
    android:background="#fff"/>

answered Jul 17 '14 at 14:04

V.Nice

275
3
9

8

You lose the rounded corners and default selection states by just changing the background color though. – eliasbagley Mar 04 '16 at 00:13

score 16 · Answer 4 · edited Dec 04 '15 at 17:46

Create /res/drawable/button.xml with the following content :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<!-- you can use any color you want I used here gray color-->
 <solid android:color="#90EE90"/> 
    <corners
     android:bottomRightRadius="3dp"
     android:bottomLeftRadius="3dp"
  android:topLeftRadius="3dp"
  android:topRightRadius="3dp"/>
</shape>

And then you can use the following :

<Button
    android:id="@+id/button_save_prefs"
    android:text="@string/save"
    android:background="@drawable/button"/>

I had to make the corner radius 13dp to make it visible; thanks! — Phlip, Apr 11 '22 at 17:22

score 15 · Answer 5 · answered May 26 '20 at 07:13

15

Just use a MaterialButton and the app:backgroundTint attribute:

<MaterialButton
  app:backgroundTint="@color/my_color_selector"

answered May 26 '20 at 07:13

Gabriele Mariotti

320,139
94
887
841

score 6 · Answer 6 · edited May 23 '17 at 12:10

6

Why not just use setBackgroundColor(getResources().getColor(R.color.holo_light_green))?

Edit: If you want to have something which looks more like an Android button you are going to want to create a gradient and set it as the background. For an example of this, you can check out this question.

edited May 23 '17 at 12:10

Community

1
1

answered Aug 06 '13 at 00:41

Jonathan

3,369
4
22
27

1

Wouldn't that make the button look like a flat rectangle? – user2260040 Aug 06 '13 at 00:45
It looks like default Android buttons have a gradient as their background, so if you want to imitate that effect you're probably going to need to create a gradient yourself and set it as a background. I added an edit to that effect. – Jonathan Aug 06 '13 at 01:09

score 5 · Answer 7 · edited Jun 19 '19 at 15:09

5

No need to be that hardcore.
Try this :

YourButtonObject.setBackground(0xff99cc00);

edited Jun 19 '19 at 15:09

Vadim Kotov

8,084
8
48
62

answered Aug 11 '15 at 23:39

Mehdi

329
1
3
14

Salman · Answer 8 · 2021-01-26T12:34:02.153

5

Try this

<androidx.appcompat.widget.AppCompatButton
    android:layout_width="wrap_content"
    android:layout_height="34dp"
    android:text="Check Out"
    android:textAllCaps="true"
    android:background="#54c2bc"
    android:textColor="#FFFFFF"
    android:textSize="9sp"/>

edited Jan 26 '21 at 12:34

answered Jan 26 '21 at 12:25

Salman

51
1
2

score 1 · Answer 9 · edited Jan 08 '18 at 21:17

1

In order to keep the style, use:

int color = Color.parseColor("#99cc00");
button.getBackground().mutate().setColorFilter(new PorterDuffColorFilter(color, PorterDuff.Mode.SRC));

edited Jan 08 '18 at 21:17

dferenc

7,918
12
41
49

answered Jan 08 '18 at 20:55

BluEOS

576
6
13

why did you add mutate? – Karan Harsh Wardhan Feb 20 '19 at 08:41

score 1 · Answer 10 · answered Sep 12 '22 at 12:26

1

try this

app:backgroundTint="@color/colorGreen"

answered Sep 12 '22 at 12:26

Misbahul KIadery Prodhan

29
3

score 0 · Answer 11 · answered Jul 23 '18 at 12:53

In addition to Mark Proctor's answer:

If you want to keep the default styling, but have a conditional coloring on the button, just set the backgroundTint property like so:

android:backgroundTint="@drawable/styles_mybutton"

Create the associated file /res/drawable/styles_mybutton.xml, then use the following template and change the colors as per your tastes:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Disabled state-->
    <item android:state_enabled="false"
        android:color="@android:color/white">
    </item>
    <!-- Default state-->
    <item
        android:color="#cfc">
    </item>
</selector>

score 0 · Answer 12 · answered May 23 '20 at 08:02

0

With version 1.2.0-alpha06 of material design library, now we can use android:background="..." on MaterialButton components:

<com.google.android.material.button.MaterialButton
    android:background="#fff"
    ...
/>

answered May 23 '20 at 08:02

Mahozad

18,032
13
118
133

You can use `android:background` for a drawable. If you want just to change the color, use the `app:backgroundTint ` attribute. – Gabriele Mariotti May 26 '20 at 07:11
1

To be able to use the background (e.g. using a drawable) with MaterialButton you need also to set app:background tint to null app:backgroundTint="@null" android:background="@drawable/bg_drawable" – Max Cruz Apr 16 '21 at 00:45

score 0 · Answer 13 · edited May 10 '23 at 15:21

I've faced the same problem with Android Studio Flamingo default setup. But found out that you need to change the Theme to AppCompat.NoAction or so, so that the color can be visible by your designer view. There is also a theme selector option on the top of the Designer view in android studio to select theme options.

After that you should be able to see the changes in button style. You can use your custom drawables as android:background="@drawble/some_asset" or using android:backgroundTint="some_hex_color".

Hope that solves the problem.

score 0 · Answer 14 · answered Jun 22 '23 at 05:52

Programmatically way:

val pressedColor = ColorDrawable(Color.LTGRAY)
val states = arrayOf(
    intArrayOf(android.R.attr.state_pressed),
    intArrayOf(android.R.attr.state_focused),
    intArrayOf()
)
val drawables = arrayOf(
    pressedColor,
    pressedColor,
    ColorDrawable(Color.TRANSPARENT)
)
val stateListDrawable = StateListDrawable()

for (i in states.indices) {
    stateListDrawable.addState(states[i], drawables[i])
}

button.background = stateListDrawable

Android button background color

14 Answers14

try this

Linked

Related