Quantcast
Jump to content

Sign in to follow this  
STF News

Use Tizen To Enable Galaxy Watch Rotary Events

Recommended Posts

Rotary event handling, enabled via the bezel, is supported on the Tizen platform. A bezel is a term used to describe the outside frame of a device, and in the case of a Galaxy Watch, the bezel is the outer ring of the device, which can be rotated. Rotary events are triggered from the Galaxy Watch rotary component when the bezel is rotated clockwise or counterclockwise. The event for each rotation is measured in incremental units called “detents.”

rotary_event.png

Bezel interactions can be used in a variety of ways, such as controlling the application page, controlling the snap list, changing the progress bar value, scrolling the page, changing the volume, and setting configurations such as date-time on the date-time picker.

This blog discusses how to handle rotary events in Tizen web and native applications. In the following example, you’ll learn how to let a user interact with bezel by using the rotary event to receive or reject a call. The user rotates the bezel clockwise to receive the call and counterclockwise to reject it.

galaxy-watch_lifestyle_hands-free_s.png

Note: Because Galaxy Active devices do not have bezels, rotary features will not work on them.


Prerequisites

Tizen Web
In the Tizen web application, add the following line in the config.xml file:

<feature name="tizen.org/feature/input.rotating_bezel"/>

Tizen Native
In the Tizen native application, include the <system_info.h>header file to use the functions and data types of the system information API.

#include<system_info.h>

You also must add the following line to the manifest file:

<feature name="http://tizen.org/feature/input.rotating_bezel">true</feature>

Check capability

Tizen Web

In the Tizen web application, use the following line to check if the device supports rotary events or if it uses bezel:

var isSupport = tizen.systeminfo.getCapability('http://tizen.org/feature/input.rotating_bezel'); 
console.log(' Bezel = ' + isSupport);

The getCapability() function of the Tizen web API returns with information about whether or not the device supports bezel.

Tizen Native
In the Tizen native application, use the following code to check bezel capability:

bool rotaryValue;
int rotaryReturn;
    rotaryReturn = system_info_get_platform_bool("http://tizen.org/feature/input.rotating_bezel", & rotaryValue);
    if (rotaryReturn!= SYSTEM_INFO_ERROR_NONE) {
       dlog_print(DLOG_INFO, LOG_TAG, "Rotary error");
        return;
    }
dlog_print(DLOG_INFO, LOG_TAG, "Bezel: %s", value ? "Supported" : "Not supported");

Implementation

Tizen Web
Register the rotarydetent event. After registering an event, ev.detail.direction provides the direction value. If the value is CW, the bezel is rotated clockwise. If the value of direction is CCW, the bezel is rotated counterclockwise.

document.addEventListener('rotarydetent', function(ev) {
        /* Get the direction value from the event */
        var direction = ev.detail.direction;
        var textbox = document.querySelector('.contents');
        box = document.querySelector('#textbox'); 
        
        if (direction == 'CW') {
            /* Add behavior for clockwise rotation */
            console.log('clockwise');
            box.innerHTML ="clockwise";
        } else if (direction == 'CCW') {
            /* Add behavior for counter-clockwise rotation */
            console.log('counter-clockwise');
            box.innerHTML ="counter-clockwise";
        }
  });

Tizen Native
Register the rotary event in the app using the following line:

eext_rotary_event_handler_add(_rotary_handler_cb, ad);

The handle function is defined using following code:

Eina_Bool
_rotary_handler_cb(appdata_s *data, Eext_Rotary_Event_Info *ev)
{
    if (ev->direction == EEXT_ROTARY_DIRECTION_CLOCKWISE) {
        dlog_print(DLOG_DEBUG, LOG_TAG,
                   "Rotary device rotated in clockwise direction");

    } else {
        dlog_print(DLOG_DEBUG, LOG_TAG,
                   "Rotary device rotated in counter-clockwise direction");
    }
    return EINA_FALSE;
}

If the rotation direction is equal to EEXT_ROTARY_DIRECTION_CLOCKWISE, the bezel is rotated clockwise. Otherwise, the bezel is rotated counterclockwise.


Demo

Two sample apps are attached:
Rotary Native
Rotary Web

Web
When you run the web sample app and turn the bezel clockwise, the following text appears on the watch face:

CW_web.png

When you turn the bezel counter counterclockwise, “counterclockwise” appears on the watch face:

CCW_web.png

Native
When you run the native sample app and turn the bezel clockwise, the following text appears on the watch face:

CW_native.png

When you turn the bezel counterclockwise, the following text appears:

CCW_native.png


For more information

The bezel is the physical controller of some Samsung wearable devices. Understanding the physical characteristics of the bezel will help you design better interactions.

References:

View the full blog at its source

Share this post


Link to post
Share on other sites


Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Similar Topics

    • By STF News
      Start Date Mar 31, 2020
      Location Online
      We are excited to announce our Progressive Web Apps (PWA) evening talks, a virtual event by GDG Oslo, GDG Bergen, GDG Sorlandet, and GDG Stavanger collaboration. Tonight's meetup includes Laura from the Samsung Internet team.
      Watch the meetup here.
      Taking your web app offline (in a good sense)
      Speaker: Maxim Salnikov - Microsoft
      Description:
      Web as an application platform is amazing: evergreen browsers or some form of web views exist almost on every device with UI, we have native APIs to access the hardware, we use versatile language with the excellent tooling, we are the huge (the largest ever) developer community after all! But the web historically tightly coupled with the connection state... In my session, we confirm: the modern web APIs and some best practices allow us to build offline-first web apps: always available, caring about data consumption, preserving and sync, providing UX which is comparable (if not better) to the native apps, regardless of the connection. Plus, the current state of the tooling makes it possible to add these features in a fast and reliable way. Let's explore the offline web in a very practical manner - by building the offline-first app! This session will be useful for web front-end developers who have heard about progressive web apps (who haven't :), maybe even tired of PWA-hype, and thus want to understand some of UX benefits on practice. As this is not another "What is PWA" session, I focus exclusively on the modern APIs making offline-first approach possible, in a form of task+solution sections - to maximize the usefulness.
      Backend developers and mobile developers will get a nice overview of what web can do today (they will be impressed).
      Make your app installable
      Speaker: Laura Morinigo - Samsung Internet
      Description:
      A progressive web app is a way to bring a native-app experience into the browser. One of the main features is the ability to make your app installable on different platforms like desktop and smartphones. During this talk, we are going to review what we need to make our app installable, the best practices and standards that we have to follow in order to bring a good user experience, trends, and a reference to the manifest file. View the full blog at its source
    • By STF News
      Hackers’ Playground, the first hacking experience event at the Samsung Developer Conference (SDC), was held during SDC19 in San Jose. The security team at Samsung Research hosted this event to help developers learn about the importance of security and how to protect their own code. The event was open to any software developer or security researcher. Many developers, from newbies to masters, attended the event to learn or show off their hacking skills.

      Hackers’ Playground featured two programs, Hacking 101 and Open CTF.
      Hacking 101
      Hacking 101 was a hacking tutorial zone where developers could learn hacking skills such as Attack, Defense, and Reversing. The security team prepared fascinating examples with their own step-by-step guide, and the skilled engineers from the team assisted the attendees. In addition, attendees had a chance to get cool souvenirs after the tutorial.

      Open CTF
      Among hackers, Capture The Flag (CTF) is a well-known hacking competition. The Security team prepared Jeopardy-game-show-style challenges in five categories: Attack, Defense, Reversing, Crypto, and Coding. At the end of each session, there was an awards ceremony and a drawing. The winners of each category received brand new Samsung products such as a Portable SSD or JBL Bluetooth Speakers. The winners received the latest Galaxy Watch Active II as well as serious bragging rights.

      Many attendees stayed in the event zone for hours and were eager to find and fix security vulnerabilities. They left review comments such as “It was nice to be able to think of code from an attackers’ point of view, not a developers’” and “I want to participate in this event again in next SDC.”
      Samsung takes Security very seriously and is involved in a variety of security-related activities. Among the various activities, the 3rd Samsung Security Tech Forum (SSTF) ended with unprecedented success in Seoul, South Korea.
      View the full blog at its source


×
×
  • Create New...