LongPress Gesture

The LongPress gesture provides support for a long press and hold on a touchable component. The user triggers a LongPress by tapping and holding on a component.

Properties

Property Type Default Description
type "LongPress" REQUIRED Must be "LongPress"
onLongPressStart Array of commands [] Commands to run when a long-press is first detected.
onLongPressEnd Array of commands [] Commands to run when a long-press finishes.

onLongPressStart

Commands to run when a long-press event occurs. The onLongPressStart commands run after the user holds the pointer down for a sufficient length of time. The onLongPressStart commands run until the user releases the pointer.

The event generated has the form:

"event": {
  "source": {
    "type": "COMPONENT_TYPE", // The type of the component
    "handler": "LongPressStart",
    ...                     // 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 component's transformed bounds
}

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

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

The onLongPressStart handler runs in fast mode in the component data-binding context.

onLongPressEnd

Commands to run when a long-press has been released. The onLongPressEnd commands run after the user releases the pointer.

The event generated has the form:

"event": {
  "source": {
    "type": "COMPONENT_TYPE", // The type of the component
    "handler": "LongPressEnd",
    ...                     // 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 component's transformed bounds
}

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

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

The onLongPressEnd handler runs in normal mode in the component data-binding context.

Event sequence for the LongPress gesture

A long-press event triggers the following event handlers:

  1. onDown
  2. onMove (if applicable)
  3. onCancel (long press identified)
  4. onLongPressStart
  5. onLongPressEnd (when the user release the component)

The operating system and accessibility settings determine the amount of time the user must hold the component for the gesture to be considered a long-press.

Example LongPress gesture

The following example demonstrates the LongPress gesture. Each touchable component handler runs a command that displays the ID of the component and the name of the handler that ran. When you do a short press and release, the onPress handler runs. When you press and hold the component for a longer time, the onLongPressStart handler runs, followed by onLongPressEnd when you release the press.

Was this page helpful?

Last updated: Feb 29, 2024