Android: Button does not change color when pressed

Question

I have made a custom_button.xml in my drawable folder for when my buttons are pressed, and for default. It looks as follows:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_pressed="true" >
    <shape>
        <gradient
            android:startColor="@color/red"
            android:endColor="@color/light_red"
            android:angle="270" />
        <corners
            android:radius="5dp" />
    </shape>
</item>

<item>
    <shape>
        <gradient
            android:startColor="@color/light_purple"
            android:endColor="@color/purple"
            android:angle="270" />
        <corners
            android:radius="5dp" />
    </shape>
</item>

My buttons look fine when not pressed, it shows the default purple button. But when I press it, it does not change to the red button as it should be when state_pressed .

In my activity_main.xml , the buttons are defined as follows:

<Button
    android:id="@+id/button1"
    android:layout_width="0dp"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:background="@drawable/custom_button"
    android:layout_margin="5dp"/>

I'm using nested LinearLayout if that makes any difference.

Please let me know if there's something I've missed!

EDIT: I found out the source of the problem, but not sure how to fix it. When I remove these following listeners from my createListeners , the buttons change color as they should.

 b1.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if(event.getAction() == MotionEvent.ACTION_DOWN) {
                int beat = getBeat(1);
                m1 = MediaPlayer.create(MainActivity.this, beat);
                m1.start();
                m1.setLooping(true);
                return true;
            } else if (event.getAction() == MotionEvent.ACTION_UP) {
                m1.release();
            }
            return false;
        }
    });

What it's basically doing is that it plays a song for as long as the button is pressed. How does this interfere with the button color?

Answer 1

I tried your selector and it is working on my side. I noticed that the width of your button is 0dp and when I used that XML on my side, it doesn't work.

Try changing it to this:

<Button
    android:id="@+id/button1"
    android:layout_width="warap_content"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:text="test"
    android:background="@drawable/custom_button"
    android:layout_margin="5dp"/>

And this is the custom_buttom.xml that I used:

<?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="#FF0000"
                android:endColor="#FF00FF"
                android:angle="270" />
        </shape>

    </item>
    <item>
        <shape>
            <gradient
                android:startColor="#1E669B"
                android:endColor="#1E669B"
                android:angle="270" />

        </shape>
    </item>
</selector>

Answer 2

Alright, so I've managed to make it work but it might be a roundabout way of doing it. I basically changed the setOnTouchListener so it looks like this:

b1.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if(event.getAction() == MotionEvent.ACTION_DOWN) {
                int beat = getBeat(1);
                m1 = MediaPlayer.create(MainActivity.this, beat);
                m1.start();
                m1.setLooping(true);
                b1.setPressed(true);
                return true;
            } else if (event.getAction() == MotionEvent.ACTION_UP) {
                b1.setPressed(false);
                m1.release();
            }
            return false;
        }
    });

Just manually changing the pressed state of the button.

Answer 3

It seems that onTouchListener() doesn't work correctly with selector. You have to change background manually in ACTION_DOWN and ACTION_UP.