Custom Holo Button

Question

I've tried searching and using custom selectors other people have posted here, using the set colour filter and various other things. I think I'm getting it completely wrong because in complete honesty I'm not great with designing having just started developing, but I still don't imagine it can be as complex to do what I want as I have seen:

I've developed an app for froyo and up. I want the background colour of the button to be the holo green and holo orange as on the swatches on the Android developer website. That's all I want to be different. I want the standard blue highlight when pressing the button on holo or the standard button onpress etc. behaviour expected in froyo, gingerbread etc.

I would really appreciate any guidance on this. Thank you guys in advance!

Dalmas · Accepted Answer · 2013-05-25T20:34:48.117

EDIT :

There is a much easier way to change the colors of the holo theme. This website will do it for you :

http://android-holo-colors.com

The only way to customize the holo buttons is to edit the button drawables with an image editor like Photoshop. Here is how :

Open the platforms/android-17/data/res folder in your SDK directory and find the holo buttons in the drawable folders (they start with btn_default_holo_...).
Open them with your image editor and simply change their colors (hue/saturation) to match the color you want. There are 3 or 4 different drawables, one per button state.
Save them in the corresponding drawable folder of your app. You have to do this for each screen density you want to handle (mdpi, hdpi, xhdpi are usually enough).

I haven't tested, but it may be enough to just edit the xhdpi buttons. They will be scaled down to the lower densities.

Once you customized each drawable, you have to create a selector that you will use as your custom button. Here is an example of a selector I use in one of my apps to create a green holo button :

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_window_focused="false" android:state_enabled="true"
          android:drawable="@drawable/__btn_green_normal_holo_light"/>
    <item android:state_window_focused="false" android:state_enabled="false"
          android:drawable="@drawable/__btn_default_disabled_holo_light"/>
    <item android:state_pressed="true"
          android:drawable="@drawable/__btn_default_pressed_holo_light"/>
    <item android:state_focused="true" android:state_enabled="true"
          android:drawable="@drawable/__btn_default_focused_holo_light"/>
    <item android:state_enabled="true"
          android:drawable="@drawable/__btn_green_normal_holo_light"/>
    <item android:state_focused="true"
          android:drawable="@drawable/__btn_default_disabled_focused_holo_light"/>
    <item
          android:drawable="@drawable/__btn_default_disabled_holo_light"/>
</selector>

Here is an example of a modified green holo button drawable. You can check the other drawables of my project if you are interested, I do exactly what you want to do (I also have a red button).

Thank you for your answer! My only worry is for this I would have to adapt it for each Android version so as to mimic the usual (orange in gingerbread and blue in ics etc.), or have I got this wrong? — AndroidPenguin, May 17 '13 at 20:42
You're right, but you can also use holo buttons for all versions. That's what I do, and what several well known apps do. They are better than the old 2.1 buttons. — Dalmas, May 17 '13 at 20:47
Worked amazingly! Though I used the paint tool rather than hue and saturation. Now I've just got to work out how to unflatten the buttons. — AndroidPenguin, May 18 '13 at 12:17

Custom Holo Button

1 Answers1