Gesture Events

The Tizen Advanced UI (TAU) framework provides gesture events optimized for the Tizen Web application.

Table of Contents

  1. Gesture Events
  2. Methods
  3. Event Detail Data

Gesture Events

Gesture Description
Drag Triggered when the user drags on a gesture-enabled element.
Swipe Triggered when the user swipes on a gesture-enabled element.
Note

The drag and swipe gestures differ in their speed. A swipe is quick drag, which animates, for example, a block translation. A drag, on the other hand, connects elements with a finger position, and waits for the end event to do something during or at the end of dragging.

Methods

The following table describes custom gesture event-related methods.

Method Parameter Description
enableGesture() Element: element

Object: gesture object

Creates a gesture event listener for the element. The first parameter must be an inserted element.

disableGesture() Element: element

Object: gesture object

Removes the gesture event listener from the element. The first parameter must be an inserted element.

To use a custom event, use the following code:

/* element is your event target element */
tau.event.enableGesture(element, new tau.event.gesture.Drag(), new tau.event.gesture.Swipe());
element.addEventListener("drag", function(e)
{
   console.log("drag event fired");
});
element.addEventListener("swipe", function(e)
{
   console.log("swipe event fired");
});

Event Detail Data

TAU gesture events have "detail" object. "detail" contains informations for the events.

Property Description
timeStamp Time when the event occurs.
pointer Position of the first touch. Contains pageX and pageY.
pointers Touches (fingers or mouse) on the screen.
deltaTime Total time of the touches on the screen.
deltaX Delta of the touch move on the x axis
deltaY Delta of the touch move on the y axis
velocityX Velocity on the x axis.
velocityY Velocity on the y axis.
angle Angle at which the touch moves from the start point.
direction Move direction from the start point. The value matches "UP"|"DOWN"|"LEFT"|"RIGHT".
distance Moved distance.
scale Scaling of the touches (requires 2 touches).
rotation Rotation of the touches (requires 2 touches).
eventType Event type. The value matches "START"|"MOVE"|"END"|"CANCEL".
srcEvent Source event, such as TouchStart or MouseDown.
startEvent Same properties as above, but calculated from the first touch. The value is used to calculate, for example, distances, deltaTime, and scaling.