Touch

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

---

Related Info

• Touch Events

---

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

Figure 1: User touch interaction

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

Enable/Disable Touch Support

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

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

Floating Menu

The Floating Menu functionality is provided in the form of an overlay menu to navigate and use the functions of a remote control by using touch.

To configure the Floating Menu, the floating.navigation metadata key was introduced starting from 2024 products (Tizen 8.0).

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 floating.navigation metadata key must 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 menu is used if the application supports both input from touch (using touch.device.support=’enable’ ) and the Floating Menu (using floating.navigation=’true’).

The overlay menu below appears on touch:
Figure 2: Basic floating menu

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

This menu is used if the application does not support input from touch (using touch.device.support=’disable’) but does support the Floating Menu (using floating.navigation=’true’).

The overlay menu below appears on touch:
Figure 3: Floating menu with D-pad

The popup below appears on touch:
Figure 4: Supported floating menu toast popup

Handling Touch Events

The supported touch events are described in the W3C Touch Events.

To receive notifications 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);

2. Define the listener:

function handleTouch () {
// Something you want to do
...
}

Supported Touch Gestures

Gesture	Occurs When
Tap	User touches and releases the screen
Long Press	User touches and holds the screen
Swipe	User touches the screen and moves around
Flick	User lifts their finger during a scroll event with enough velocity

Table 1: Supported gestures