CODEWITHSUNDEEP
javaandroidbuttoncolorsbackground
Matt
Matt

Reputation: 3912

Highlight effect on Button's onClick is gone after changing background to a color

When a button is left unchanged from the default grey, it highlights when clicked before performing its onClick action. I have changed the background of the button to red and now the highlight effect when clicked is gone. How do I make this happen again with the new background? I guess what I want is just a highlighted red color or a little lighter red when clicked.

I've looked around on SO and found a lot of people saying create a onclickbuttonhighlight.xml file in the res/drawable folder. I did so below.

<selector
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@color/blue"
        android:state_focused="true"
        android:state_pressed="true"/>
    <item
        android:drawable="@color/blue"
        android:state_focused="false"
        android:state_pressed="true"/>
    <item
        android:drawable="@color/blue"
        android:state_focused="true"
        android:state_pressed="false"/>
    <item
        android:drawable="@color/blue"
        android:state_focused="false"
        android:state_pressed="false"/>
</selector>

I wasn't quite sure what to put for the lines that say android:drawable="@color/blue". I just used blue for testing. Then in the XML file I added android:background="@drawable/onclickbuttonhighlight" under the buttons. I am not seeing any highlight effect when clicked though.

Am I doing this way incorrectly? Or is there a better way to do this? XML or programmatically will work; I have no preference.

Upvotes: 2

Views: 2264

Answers (2)

Rachit Mishra
Rachit Mishra

Reputation: 6112

For custom button style 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="IMAGE_FOR_DISABLED_STATE" android:state_enabled="false"/>
    <item android:drawable="IMAGE_FOR_PRESSED_STATE" android:state_enabled="true" android:state_pressed="true"/>
    <item android:drawable="IMAGE_FOR_FOCUSED_STATE" android:state_enabled="true" android:state_focused="true"/>
    <item android:drawable="IMAGE_FOR_ENABLED_STATE" android:state_enabled="true"/>

</selector>

See there are different drawable(images) for pressed state and focused state.

In case of default android system we have the drawables

default holo drawable for the enabled button

default focused drawable for the focused state

default disabled drawable for the disabled state

And so we see the bluish border when we press the button or focus it.

Now when you are changing the default background you are changing the drawable to a color value, and you are not specifying the other button states through a drawable. So, the color value itself is used by the system for all states and you don't see any hover effect.

So if you wish to implement a custom button, instead of setting a color directly as background, specify a drawable file as background which specifies the color/drawables images for all the button states, such as pressed, focused, enabled, disabled.

Upvotes: 3

sharshi
sharshi

Reputation: 1003

In my experience overriding one part of the button style gets rid of all the styles. I use http://android-holo-colors.com/ and make the button styles there.

Upvotes: 1

Related Questions