android change image of ImageButton on pressed with selector xml

Question

I have an ImageButton in Android, and need to change the image when the button is pressed so it's clear to the user that the button is being pressed.

What I've tried is to use an xml with a selector in the drawable folder my images are in. My code is as follows:

xml

<ImageButton
    android:id="@+id/upButton"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    android:scaleType="fitXY"
    android:src="@drawable/up_button"
    android:background="#00000000"/>

up_button.xml

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

    <item android:drawable="@drawable/up_pressed"
        android:state_pressed="true"/>
    <item android:drawable="@drawable/up"/>

</selector>

java onTouchListener

The text of textView is changed when the button is pressed, and changed back when the button is released.

upButton.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {
            switch (motionEvent.getAction()){
                case MotionEvent.ACTION_DOWN:
                    textView.setText("Up button pressed.");
                    break;
                case MotionEvent.ACTION_UP:
                    textView.setText("Up button released.");
                    break;
            }
            return true;
        }
    });

When searching for similar questions on this site, I found Android button on pressed, but this wasn't very helpful as it didn't have an answer. I've also found a lot of other similar questions and tried those answers, but none of it worked. I started with what is in the Android documentation, and when going through other questions tried variations of it. https://developer.android.com/guide/topics/ui/controls/button.html

Try to set `android:background="@drawable/up_button"` and remove the `src` altogether. — Vucko, Jul 23 '16 at 17:27
@Vucko Thanks. Just tried that, but it doesn't work. Also, the image gets stretched vertically. Because of the `wrap_content` it stretches around the (vertical) size of the image, which is bigger than I want it to be on the button. — Abby, Jul 23 '16 at 17:30
Check out [this question](http://stackoverflow.com/questions/18507351/how-to-create-custom-button-in-android-using-xml-styles) — Vucko, Jul 23 '16 at 17:33
@Vucko I made a style for my imageButton in `styles.xml`, and created a `themes.xml` like in the answer from Gramowski. I changed `` to `` because I'm working with an `ImageButton`. This didn't work... Also, I'm not sure if this would be the right solution, had it worked, considering this generates one `ImageButton` and changes all of them in ones like these as it overrides the default. I need more different ImageButtons (one for up and one for down), but you couldn't have known that. Sorry about the lack of detail there. — Abby, Jul 23 '16 at 17:54

score 2 · Accepted Answer · answered Jul 23 '16 at 20:09

If you use onTouch() on a button, its onClick() functionality will not work. So you can let it work by adding certain methods for the button you touch like this:

upButton.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {
            switch (motionEvent.getAction()){
                case MotionEvent.ACTION_DOWN:
                    textView.setText("Up button pressed.");
                    upButton.setPressed(true);
                    //Use this if you want to perform onClick() method.
                    //upButton.performClick();
                    break;
                case MotionEvent.ACTION_UP:
                    textView.setText("Up button released.");
                    upButton.setPressed(false);
                    break;
            }
            return true;
        }
    });

android change image of ImageButton on pressed with selector xml

1 Answers1