Tap Gesture

The Tap gesture detects a deliberate tap on a component, in a manner that is more restrictive than onPress. Tap imposes the following additional restrictions with respect to the initial down and final pointer up events:

  1. They must occur within a short distance, to rule out drag-like gestures.
  2. They must describe a vector of little or no velocity, to rule out swipe-like gestures.

Properties

Property Type Default Description

type

"Tap"

REQUIRED

Describes the type of gesture

onTap

Array of commands

[ ]

Commands to run when a tap occurs

onTap

Commands to run when a Tap event is detected. This event can occur after the pointer has been released. These commands are executed after the onCancel event handler has executed.

The event generated has the following form.

"event": {
  "source": {
    "type": COMPONENT_TYPE, // The type of the component
    "handler": "Tap",
    ...                     // Component source properties
  },
  "component": {
    "x": Number,       // X-position of the up event in the component (dp)
    "y": Number,       // Y-position of the up event in the component (dp)
    "width": Number,   // Width of the component in dp
    "height": Number,  // Height of the component in dp
  },
  "inBounds": Boolean  // True if the pointer is within the components transformed bounds
}

The inBounds calculation for the pointer position doesn't consider overlapping components.

Refer to Event source for a description of event.source properties.

The onTap handler executes in normal mode.

Event sequence for the Tap gesture

A Tap gesture triggers the following event handlers:

  1. onDown
  2. onUp (optional)
  3. onCancel (when a tap has been detected)
  4. onTap (when the pointer is released)

The maximum velocity and maximum travel that qualify a touch as a Tap are defined by the runtime operating system.

Was this page helpful?

Last updated: Nov 28, 2023