"Press and hold" button on Android needs to change states (custom XML selector) using onTouchListener

Octoth0rpe picture Octoth0rpe · Sep 25, 2012 · Viewed 27.2k times · Source

I've got a button graphic which needs to have "press and hold" functionality, so instead of using onClickListener, I'm using onTouchListener so that the app can react to

 MotionEvent.ACTION_DOWN,

and

 MotionEvent.ACTION_UP

Depending on how quickly those two events are triggered, I can run a "pressAndHoldHandler" in the time between the two.

Anyway, long story short: I have numerous "basic" buttons in the same app that don't require the press and hold functionality, so they are using the onClickListener.

Every single one of these buttons have been customized graphically with their own XML selector file:

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

    <item
        android:state_enabled="false"
        android:drawable="@drawable/btn_chicken_off" />

    <item
        android:state_enabled="true"
        android:state_pressed="true"
        android:drawable="@drawable/btn_chicken_s3" />

    <item
        android:state_enabled="true"
        android:state_focused="true"
        android:drawable="@drawable/btn_chicken_s2" />

    <item
        android:state_enabled="true"
        android:drawable="@drawable/btn_chicken_off" />

</selector>

So, the problem here is: The above selector doesn't get accessed with the onTouchListener. Only the onClickListener will pull in the state changes with the onClick() section of its own method, so these "press and hold" buttons never change state. Pretty terrible feedback for the user.

I'm currently forcing the above inside the switch case of ACTION_DOWN and ACTION_UP by doing the following:

if (action == MotionEvent.ACTION_DOWN) {
    btn_chicken.setBackgroundResource(R.drawable.btn_chicken_s3);
}
else
    if (action == MotionEvent.ACTION_UP) {
        btn_chicken.setBackgroundResource(R.drawable.btn_chicken_off);
    }

But it seems like a hack, and it's missing the "focused but not pressed" stage.

Anybody tripped across this before?

Answer

Eyal Biran picture Eyal Biran · Sep 1, 2013

Use the view.setPressed() function to simulate the pressed behavior by yourself.

You would probably want to enable the Pressed state when you get ACTION_DOWN event and disable it when you get the ACTION_UP event.

Also, it will be a good idea to disable it in case the user slide out of the button. Catching the ACTION_OUTSIDE event, as shown in the example below:

@Override
public boolean onTouch(View v, MotionEvent event) {

    switch (event.getAction() & MotionEvent.ACTION_MASK) {

    case MotionEvent.ACTION_DOWN:
        v.setPressed(true);
        // Start action ...
        break;
    case MotionEvent.ACTION_UP:
    case MotionEvent.ACTION_OUTSIDE:
    case MotionEvent.ACTION_CANCEL:
        v.setPressed(false);
        // Stop action ...
        break;
    case MotionEvent.ACTION_POINTER_DOWN:
        break;
    case MotionEvent.ACTION_POINTER_UP:
        break;
    case MotionEvent.ACTION_MOVE:
        break;
    }

    return true;
}