Detecting Touch Gestures in Android
Mobile users interact with apps in many ways, a major one is through touch. Following motion guidelines and supporting common touch gestures goes a long way toward providing an intuitive experience to your users.
This article goes through the basics of touch gestures in Android, including single touch gestures, multi-touch gestures and some out-of-the-box common gestures Android supports. Along the way, you’ll see how these concepts are used to build a simple drawing app.
Touch gestures
As a user touches a View, the system sends signals to the View with information about each touch event, including its nature and where exactly it occurred. This allows you to track the user’s touch interactions with the View, and potentially detect gestures.
The term “pointer” is used to refer to the finger or object (e.g. stylus) that interacts with the View. Therefor, a touch event may be the result of 1 or multiple pointers. When the Android device’s screen supports multi-touch, the system can track and report information about all the pointers as they interact with the View.
To track touch events occurring on a View, set its OnTouchListener.
Tracking Single Touch Gestures
When dealing with single touch gestures, handle each event using its type and coordinates.
The event’s type is available through MotionEvent.getAction(). It returns an integer whose value can be one of the following: ACTION_DOWN, ACTION_UP, ACTION_MOVE and ACTION_CANCEL, which signal that a new touch gesture has started, finished, moved or been cancelled respectively.
The event’s coordinates are represented by a pair of x and y coordinates where the touch event occurred. The coordinates are relative to the View and not the whole screen, meaning that a touch event at the upper left corner of the View will have the coordinates (0, 0). The coordinates are decimals when the device has sub-pixel precision, and are otherwise integers.
A set of consecutive events between ACTION_DOWN and ACTION_UP represent a gesture, for example, a scroll gesture starts with the user’s finger touching the screen (ACTION_DOWN), it then moves up the screen (ACTION_MOVE), before finally stopping and being lifted off the screen (ACTION_UP).
Single Touch Gestures Example
The following sample tracks single touch events on a View and allows the user to draw on it. The drawing follows the user’s finger (pointer).
Tracking Multi-Touch Gestures
When dealing with multi-touch gestures, you may have more than a single pointer touching a View, the system provides information about each of the pointers and tracks them during a gesture, from the moment the first pointer touches the View until the last pointer is lifted off the View.
Some of the information you’ll use for multi-touch events includes the event’s type, pointer id, pointer index and coordinates.
The event’s type is provided by MotionEvent.getActionMasked(). It returns an integer whose value can be one of the following: ACTION_DOWN, ACTION_POINTER_DOWN, ACTION_MOVE, ACTION_POINTER_UP, ACTION_UP , which respectively signal that the first pointer has touched the View and the gesture has started, a new pointer has touched the View, a pointer has moved, a pointer has been lifted and the last pointer has been lifted.
The event may have multiple pointers, each pointer is identified by an id and an index, the id is unique throughout the entire gesture, whereas the index is unique per event, but may change as pointers go up and down throughout the gesture. As a result, a pointer’s index makes sense and should be used in the context of a multi-touch event, since it will always be 0 in a single touch event. You can get a pointer’s id using MotionEvent.getPointerId(), and you can get its index using MotionEvent.getActionIndex(). The value of the pointer index will always be between 0 -inclusive- and MotionEvent.getPointerCounter() -exclusive-.
Multi-Touch Gestures Example
The following sample tracks multi-touch events on a View and allows the user to draw on it. The drawings follow the user’s fingers (pointers).
Detecting Gestures
Detecting gestures on a View such as when it’s long pressed and scrolled is accomplished by analyzing a set of consecutive touch events received from the View’s OnTouchListener.
Detecting Common Gestures
Android supports detecting certain common gestures including single tap, double tap, long press, scroll and fling with GestureDetector. Implement an OnGestureListener, attach it to a GestureDetector and use it inside the View’s OnTouchListener by passing it each touch event the View receives. If the GestureDetector detects any of the gestures is supports, it will trigger its appropriate callback.
To use GestureDetector’s OnGestureListener, you must implement all its gesture callbacks. If you only need to detect a subset of these gestures, use a SimpleOnGestureListener instead.
Common Gestures Example
The following sample tracks double taps on a View and allows the user to clear any drawings it may contain.
Detecting Scale Gestures
Another common gesture on Android is the scale gesture, where using 2 fingers, you pinch or reverse pinch a View. This gesture is used for example in camera apps to zoom in and out of the camera preview, or in image gallery apps to zoom in and out of a photo.
To detect a scale gesture, follow the same pattern as above, implement an OnScaleGestureListener, attach it to a ScaleGestureDetector and pass it each incoming touch event from the View’s OnTouchListener.
To use ScaleGestureDetector’s OnScaleGestureListener, you must implement all its callbacks, if you’re only interested in getting the factor by which the scale has changed, use instead SimpleOnScaleGestureListener.
Scale Gestures Example
The following sample tracks scale gestures on a View, so that when the user pinches it, the View zooms in, and when they reverse pinch it, the View zooms out.
Touch Gestures Code Sample
The code snippets used in this articles were taken from the following repo.
Conclusion
In summary:
- Track a
View’s touch events and gestures using itsOnTouchListener. - Track a single touch gesture by using the type of its touch events, and the coordinates of its single pointer.
- Track a multi-touch gesture by using the types of its touch events, their pointer ids, pointer indices, and their coordinates.
- Detect common gestures like single and double taps, long presses, scrolling and flings using
GestureDetector. Implement its listener and attach it to aView’sOnTouchListener. - Detect scale gestures using
ScaleGestureDetector. Implement its listener and attach it to aView’sOnTouchListener.
For more on touch gestures, check out the following:
