Why does a Button loses its original behaviour after changing its color?

Question

I am writing an Android app and now I am styling it. I am using a custom theme which is a child of Theme.Holo.Light. I really like Theme.Holo.Light because its buttons have a special effect when you click and hold it. Like the lower button in the picture below:

Not click:

click:

The upper button has been changed color. Now when I click on that button, it doesn't have that effect. I really don't understand why. Can anyone tell me why this happens and how can I get the same effect with a colored button?

And also, the colored button seems fatter.

Answer 1

This is because the button uses a selector to display different colors/effects/drawables based on the state of the click. You can check out the link on Color State List Resource.

To create your own you have to create a slecetor cml file and put it in your drawables folder.

For example.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/shape_btn_default_normal_gray" android:state_enabled="true" android:state_pressed="false"/>
    <item android:drawable="@drawable/shape_btn_default_pressed_gray" android:state_pressed="true"/>
    <item android:drawable="@drawable/shape_btn_default_disabled_gray"/>
</selector>

or with colors

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/dark_green" android:state_enabled="true" android:state_pressed="false"/>
    <item android:drawable="@color/light_green" android:state_pressed="true"/>
    <item android:drawable="@color/gray"/>
</selector>

To apply this you have to set the background drawable in your layout xml like this.

<Button
    android:id="@+id/my_btn"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:text="Some text"
    android:background="@drawable/selector_btn_default_gray"/>

Answer 2

That is the "ripple effect" of material design.
You have define you own style for that effect.
Link below may help you or you may search for many other answers on StackOverflow.
Material effect on button with background color

Answer 3

It does not loses its behavior you can see after click (in your second image) the button show same scale as the above have...so by default the background is set as to show that it is button (like with padding or so) and can changes to show oncklick effect... So when you set your desire background to button...It takes complete change on what is on presently on it and then you have to manually set onclick effect..