Android - Custom Button gets stuck “Pressed”

Question

I've created a custom button in my Android app that has basically two different views. There is an image for when the button isn't being pressed and another image for use while it is being pressed. Below is how I've implemented the button and how it responds to the user.

private void registerListeners() {

    calcButton.setOnTouchListener(new View.OnTouchListener() {

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            calcButton.requestFocusFromTouch();
            calcButton.setImageResource(R.drawable.calc_button_pressed);
            return false;
        }
    });

    calcButton.setOnFocusChangeListener(new View.OnFocusChangeListener() {

        @Override
        public void onFocusChange(View v, boolean hasFocus) {
            calcButton.setImageResource(R.drawable.calc_button_not_pressed);
        }
    });

    calcButton.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {           
            mathCalculation();
            calcButton.setImageResource(R.drawable.calc_button_not_pressed);
        }
    });
}

My problem is that there is a "bug" where if the user touches the button and drags their figure off the button the button stay pressed down. The one work around I've implemented above is the "setOnFocusChangeListener" so once the user select something it else it will pop back up.

I want to have it so the button pops back out when the user drags there touched figure off the button.

All suggestions are greatly appreciated!!!

Thank you,

Answer 1

You don't need to write a separate button class to get that behavior, you can implement it through a drawable xml. Have this in your xml and set it as the background for your button:

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

Answer 2

In your onTouch method, check for the event action.

• If it's MotionEvent.ACTION_DOWN, then proceed as you have.
• If it's ACTION_UP or ACTION_CANCEL, then call calcButton.setImageResource(R.drawable.calc_button_not_pressed);

http://developer.android.com/reference/android/view/MotionEvent.html

Answer 3

You Could use use onTouch . Then use the ACTION_OUTSIDE which is fired when the users touch moves out the the bound of the view.

Edit 1: to be more specific:

OnTouchListener(MotionEvent e) {
   switch(e.getAction()) {
      case MotionEvent.ACTION_OUTSIDE: // switch the image if the button
    }
}

Answer 4

It's because the click event "happens" only when touching and releasing . If you're touching and moving outside that's not a click.

To do what you want use a StateListDrawable , it's made just for that.