Standard Android Button with a different color

Question

I'd like to change the color of a standard Android button slightly in order to better match a client's branding.

The best way I've found to do this so far is to change the Button's drawable to the drawable located in res/drawable/red_button.xml:

<?xml version="1.0" encoding="utf-8"?>     <selector xmlns:android="http://schemas.android.com/apk/res/android">     <item android:state_pressed="true" android:drawable="@drawable/red_button_pressed" />     <item android:state_focused="true" android:drawable="@drawable/red_button_focus" />     <item android:drawable="@drawable/red_button_rest" /> </selector> 

But doing that requires that I actually create three different drawables for each button I want to customize (one for the button at rest, one when focused, and one when pressed). That seems more complicated and non-DRY than I need.

All I really want to do is apply some sort of color transform to the button. Is there an easier way to go about changing a button's color than I'm doing?

Answer 1

I discovered that this can all be done in one file fairly easily. Put something like the following code in a file named custom_button.xml and then set background="@drawable/custom_button" in your button view:

<?xml version="1.0" encoding="utf-8"?> <selector     xmlns:android="http://schemas.android.com/apk/res/android">      <item android:state_pressed="true" >         <shape>             <gradient                 android:startColor="@color/yellow1"                 android:endColor="@color/yellow2"                 android:angle="270" />             <stroke                 android:width="3dp"                 android:color="@color/grey05" />             <corners                 android:radius="3dp" />             <padding                 android:left="10dp"                 android:top="10dp"                 android:right="10dp"                 android:bottom="10dp" />         </shape>     </item>      <item android:state_focused="true" >         <shape>             <gradient                 android:endColor="@color/orange4"                 android:startColor="@color/orange5"                 android:angle="270" />             <stroke                 android:width="3dp"                 android:color="@color/grey05" />             <corners                 android:radius="3dp" />             <padding                 android:left="10dp"                 android:top="10dp"                 android:right="10dp"                 android:bottom="10dp" />         </shape>     </item>      <item>                 <shape>             <gradient                 android:endColor="@color/blue2"                 android:startColor="@color/blue25"                 android:angle="270" />             <stroke                 android:width="3dp"                 android:color="@color/grey05" />             <corners                 android:radius="3dp" />             <padding                 android:left="10dp"                 android:top="10dp"                 android:right="10dp"                 android:bottom="10dp" />         </shape>     </item> </selector>