Android: Detect if user touches and drags out of button region?

Question

In Android, how can we detect if a user touches on button and drags out of region of this button?

Entreco · Accepted Answer · 2013-05-11T16:57:02.750

98

~~Check the MotionEvent.MOVE_OUTSIDE:~~ Check the MotionEvent.MOVE:

private Rect rect;    // Variable rect to hold the bounds of the view

public boolean onTouch(View v, MotionEvent event) {
    if(event.getAction() == MotionEvent.ACTION_DOWN){
        // Construct a rect of the view's bounds
        rect = new Rect(v.getLeft(), v.getTop(), v.getRight(), v.getBottom());

    }
    if(event.getAction() == MotionEvent.ACTION_MOVE){
        if(!rect.contains(v.getLeft() + (int) event.getX(), v.getTop() + (int) event.getY())){
            // User moved outside bounds
        }
    }
    return false;
}

NOTE: If you want to target Android 4.0, a whole world of new possibilities opens: http://developer.android.com/reference/android/view/MotionEvent.html#ACTION_HOVER_ENTER

edited May 11 '13 at 16:57

answered Nov 09 '11 at 18:42

Entreco

12,738
8
75
95

1

Sorry but it doesn't work. I only can catch ACTION_UP, ACTION_DOWN and ACTION_MOVE but not ACTION_OUTSIDE. – anticafe Nov 10 '11 at 14:07
It's available from API Level 3 onwards: http://developer.android.com/reference/android/view/MotionEvent.html#ACTION_OUTSIDE – Entreco Nov 12 '11 at 16:02
4

According to this answer (http://stackoverflow.com/questions/6162497/when-would-action-outside-be-triggered/8059266#8059266) I believe we only can use ACTION_OUTSIDE to detect if touch is outside an Activity, not a view. – anticafe Nov 13 '11 at 03:11
1

See FrostRocket's answer for an update to rect.contains test to make this work for individual views that aren't positioned at the origin. – Dan J May 11 '13 at 02:26
I believe if you want to get `ACTION_OUTSIDE` you will need to use `getActionMasked()`. Or you could compared the masks instead: `if ((event.getAction() & MotionEvent.ACTION_OUTSIDE) == MotionEvent.ACTION_OUTSIDE)`. This is because `ACTION_OUTSIDE` will never trigger without already having another action, so it will be masked. – Chad Bingham May 13 '17 at 04:10
@ChadBingham Not receiving `ACTION_OUTSIDE` when dragging out of the button, either with `getAction()` or `getActionMasked()` – User Feb 27 '18 at 17:09
p.s. confirmed - `ACTION_OUTSIDE ` doesn't work for views. – User Feb 27 '18 at 17:10

score 22 · Answer 2 · edited Oct 29 '16 at 04:42

22

The answer posted by Entreco needed some slight tweaking in my case. I had to substitute:

if(!rect.contains((int)event.getX(), (int)event.getY()))

for

if(!rect.contains(v.getLeft() + (int) event.getX(), v.getTop() + (int) event.getY()))

because event.getX() and event.getY() only apply to the ImageView itself, not the entire screen.

edited Oct 29 '16 at 04:42

Suragch

484,302
314
1,365
1,393

answered Jan 04 '13 at 05:46

0xMatthewGroves

3,181
3
26
43

+1 thanks, that's the more universal approach and works in custom view implementations too – Knickedi Jun 14 '14 at 20:17

Adil Hussain · Answer 3 · 2020-05-04T11:34:13.173

I had this same problem as the OP whereby I wanted to know when (1) a particular View was touched down as well as either (2a) when the down touch was released on the View or (2b) when the down touch moved outside the bounds of the View. I brought together the various answers in this thread to create a simple extension of View.OnTouchListener (named SimpleTouchListener) so that others don't have to fiddle around with the MotionEvent object. The source for this class can be found here or at the bottom of this answer.

To use this class, simply set it as the parameter of the View.setOnTouchListener(View.OnTouchListener) method follows:

myView.setOnTouchListener(new SimpleTouchListener() {

    @Override
    public void onDownTouchAction() {
        // do something when the View is touched down
    }

    @Override
    public void onUpTouchAction() {
        // do something when the down touch is released on the View
    }

    @Override
    public void onCancelTouchAction() {
        // do something when the down touch is canceled
        // (e.g. because the down touch moved outside the bounds of the View
    }
});

Here is the source of the class which you are welcome to add to your project:

public abstract class SimpleTouchListener implements View.OnTouchListener {

    /**
     * Flag determining whether the down touch has stayed with the bounds of the view.
     */
    private boolean touchStayedWithinViewBounds;

    @Override
    public boolean onTouch(View view, MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                touchStayedWithinViewBounds = true;
                onDownTouchAction();
                return true;

            case MotionEvent.ACTION_UP:
                if (touchStayedWithinViewBounds) {
                    onUpTouchAction();
                }
                return true;

            case MotionEvent.ACTION_MOVE:
                if (touchStayedWithinViewBounds
                        && !isMotionEventInsideView(view, event)) {
                    onCancelTouchAction();
                    touchStayedWithinViewBounds = false;
                }
                return true;

            case MotionEvent.ACTION_CANCEL:
                onCancelTouchAction();
                return true;

            default:
                return false;
        }
    }

    /**
     * Method which is called when the {@link View} is touched down.
     */
    public abstract void onDownTouchAction();

    /**
     * Method which is called when the down touch is released on the {@link View}.
     */
    public abstract void onUpTouchAction();

    /**
     * Method which is called when the down touch is canceled,
     * e.g. because the down touch moved outside the bounds of the {@link View}.
     */
    public abstract void onCancelTouchAction();

    /**
     * Determines whether the provided {@link MotionEvent} represents a touch event
     * that occurred within the bounds of the provided {@link View}.
     *
     * @param view  the {@link View} to which the {@link MotionEvent} has been dispatched.
     * @param event the {@link MotionEvent} of interest.
     * @return true iff the provided {@link MotionEvent} represents a touch event
     * that occurred within the bounds of the provided {@link View}.
     */
    private boolean isMotionEventInsideView(View view, MotionEvent event) {
        Rect viewRect = new Rect(
                view.getLeft(),
                view.getTop(),
                view.getRight(),
                view.getBottom()
        );

        return viewRect.contains(
                view.getLeft() + (int) event.getX(),
                view.getTop() + (int) event.getY()
        );
    }
}

this is a great answer, especially for people working with the issue for when ACTION_CANCEL not triggering as it should. — New Guy, Mar 07 '18 at 16:27

score 8 · Answer 4 · answered May 25 '15 at 14:49

8

I added some logging in my OnTouch and found out that MotionEvent.ACTION_CANCEL was being hit. That's good enough for me...

answered May 25 '15 at 14:49

Boy

7,010
4
54
68

2

You'll get a `MotionEvent.ACTION_CANCEL` callback if your `View` is contained within a parent `ViewGroup` like `ScrollView` which is interested in stealing move touches from its children but otherwise there's no guarantee you'll get a `MotionEvent.ACTION_CANCEL` callback in your `View`. – Adil Hussain Mar 26 '17 at 16:14
The only solution that worked out for me, thanks saved me – Mohammad Elsayed Dec 13 '20 at 23:11

Bart Burg · Answer 5 · 2017-03-07T08:18:33.373

The top 2 answers are fine except when the view is inside a scrollview: when scrolling takes place because you move your finger, it is still registered as a touch event but not as a MotionEvent.ACTION_MOVE event. So to improve the answer (which is only needed if your view is inside a scroll element):

private Rect rect;    // Variable rect to hold the bounds of the view

public boolean onTouch(View v, MotionEvent event) {
    if(event.getAction() == MotionEvent.ACTION_DOWN){
        // Construct a rect of the view's bounds
        rect = new Rect(v.getLeft(), v.getTop(), v.getRight(), v.getBottom());

    } else if(rect != null && !rect.contains(v.getLeft() + (int) event.getX(), v.getTop() + (int) event.getY())){
        // User moved outside bounds
    }
    return false;
}

I tested this on Android 4.3 and Android 4.4

I haven't noticed any differences between Moritz's answer and to top 2 but this also applies for his answer:

private Rect rect;    // Variable rect to hold the bounds of the view

public boolean onTouch(View v, MotionEvent event) {
    if(event.getAction() == MotionEvent.ACTION_DOWN){
        // Construct a rect of the view's bounds
        rect = new Rect(v.getLeft(), v.getTop(), v.getRight(), v.getBottom());

    } else if (rect != null){
        v.getHitRect(rect);
        if(rect.contains(
                Math.round(v.getX() + event.getX()),
                Math.round(v.getY() + event.getY()))) {
            // inside
        } else {
            // outside
        }
    }
    return false;
}

I've just implemented this code on a button which is contained in an item of a RecyclerView and works perfectly. I just wanted to say that you can get rid of the new Rect on the **ACTION_DOWN** if you add it before getHitRect. **Rect rect = new Rect(); getHitRect(rect);** — Jose M Lechon, Mar 06 '17 at 16:26

score 3 · Answer 6 · answered Jan 31 '20 at 02:13

Reuseable Kotlin Solution

I started with two custom extension functions:

val MotionEvent.up get() = action == MotionEvent.ACTION_UP

fun MotionEvent.isIn(view: View): Boolean {
    val rect = Rect(view.left, view.top, view.right, view.bottom)
    return rect.contains((view.left + x).toInt(), (view.top + y).toInt())
}

Then listen to touches on the view. This will only fire if ACTION_DOWN was originally on the view. When you release your finger, it will check if it was still on the view.

myView.setOnTouchListener { view, motionEvent ->
    if (motionEvent.up && !motionEvent.isIn(view)) {
        // Talk your action here
    }
    false
}

score 2 · Answer 7 · answered Oct 06 '15 at 22:17

view.setClickable(true);
view.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (!v.isPressed()) {
            Log.e("onTouch", "Moved outside view!");
        }
        return false;
    }
});

view.isPressed uses view.pointInView and includes some touch slop. If you don't want slop, just copy the logic from the internal view.pointInView (which is public, but hidden so it's not a part of the official API and could disappear at any time).

view.setClickable(true);
view.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            v.setTag(true);
        } else {
            boolean pointInView = event.getX() >= 0 && event.getY() >= 0
                    && event.getX() < (getRight() - getLeft())
                    && event.getY() < (getBottom() - getTop());
            boolean eventInView = ((boolean) v.getTag()) && pointInView;
            Log.e("onTouch", String.format("Dragging currently in view? %b", pointInView));
            Log.e("onTouch", String.format("Dragging always in view? %b", eventInView));
            v.setTag(eventInView);
        }
        return false;
    }
});

score 1 · Answer 8 · answered Oct 17 '14 at 10:37

While the answer from @FrostRocket is correct you should use view.getX() and Y to account for translations changes as well:

 view.getHitRect(viewRect);
 if(viewRect.contains(
         Math.round(view.getX() + event.getX()),
         Math.round(view.getY() + event.getY()))) {
   // inside
 } else {
   // outside
 }

score 1 · Answer 9 · answered Jan 19 '15 at 09:04

Here is a View.OnTouchListener that you can use to see if MotionEvent.ACTION_UP was sent while the user had his/her finger outside of the view:

private OnTouchListener mOnTouchListener = new View.OnTouchListener() {

    private Rect rect;

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (v == null) return true;
        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            rect = new Rect(v.getLeft(), v.getTop(), v.getRight(), v.getBottom());
            return true;
        case MotionEvent.ACTION_UP:
            if (rect != null
                    && !rect.contains(v.getLeft() + (int) event.getX(),
                        v.getTop() + (int) event.getY())) {
                // The motion event was outside of the view, handle this as a non-click event

                return true;
            }
            // The view was clicked.
            // TODO: do stuff
            return true;
        default:
            return true;
        }
    }
};

score 0 · Answer 10 · answered Mar 30 '22 at 19:56

If drag to outside of view, 'ACTION_CANCEL' event call. So need disallow parent view to intercept touch event:

override fun dispatchTouchEvent(event: MotionEvent): Boolean {
    when (event.action) {
        MotionEvent.ACTION_DOWN -> {
            (parent as? ViewGroup?)?.requestDisallowInterceptTouchEvent(true)
        }
        MotionEvent.ACTION_UP -> {
            (parent as? ViewGroup?)?.requestDisallowInterceptTouchEvent(false)
        }
        else -> {
        }
    }
    return true
}

and then you can check touch point is outside of your view or not!

Android: Detect if user touches and drags out of button region?

10 Answers10

Reuseable Kotlin Solution

Linked