Touch

This topic describes how your application can detect and receive input from touch


Related Info


For touch supported devices, user can interact with your application using touch events

Figure 1. User touch interaction

Multiple concurrent touch events are supported (Support up to 20 multi-touch)

Enable/Disable Touch Support

Touch on LPF5DS model are disabled by default. To enable touch function in your application, the touch.device.support metadata key should be set to enable on application's "config.xml" file:

<tizen:metadata key="http://samsung.com/tv/metadata/touch.device.support" value="enable"/>

Floating Menu

Floating menu is provided in the form of an overlay menu to navigate and use functions of a remote control by using touch
The floating.navigation metadata key was introduced starting from 2024 products (Tizen 8.0) to configure the Floating menu.

Enable/Disable Floating Menu:

The Floating menu is enabled by default. The floating.navigation metadata key does not need to be explicitly added to the application's "config.xml" to enable the Floating menu.
To disable the Floating menu, the value of the floating.navigation metadata key should be set to false.

<tizen:metadata key="http://samsung.com/tv/metadata/floating.navigation" value="false"/>

Floating Menu Types:

Type (1): Basic Floating Menu

This is used if the application supports both input from touch touch.device.support=’enable’ and floating menu floating.navigation=’true’
Below overlay menu appears on touch

Figure 2. Basic floating menu

Type (2): Floating menu with D-pad for screen navigation

This is used if the application does not support input from touch touch.device.support=’disable’ but supports floating menu floating.navigation=’true’
Below overlay menu appears on touch

Figure 3. Floating menu with D-pad

Below pop-up appears on touch

Figure 4. Supported floating menu toast pop-up

Handling Touch Event

The supported touch events are described in the W3C Touch Events.
To receive notification for touch events, for example, the touchstart event:

  1. Create a listener for the touchstart event. The listener is notified each time a finger comes in contact with the element
<div id='touchable' ... ontouchstart='handleTouch();'> ... </div>

or

document.getElementById('touchable').addEventListener('touchstart', handleTouch);
  1. Define the listener:
function handleTouch () {
// Something you want to do
...
}

Supported Touch Gestures

Gesture

Occurs When

Tap

User touch and release the screen

Long Press

User touch and holds the screen

Swipe

User touch the screen and move around

Fling

User lifted a finger during scroll with enough velocity