Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Custom Holo Button

Tags:

android

button

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!

like image 475
AndroidPenguin Avatar asked May 17 '13 19:05

AndroidPenguin


1 Answers

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).

like image 117
Dalmas Avatar answered Oct 07 '22 00:10

Dalmas