Quantcast
Jump to content


How to Add Watch Face Features Using Tizen Web


STF News

Recommended Posts

Smart watch users are interested in having an interactive and eye-catching watch faces, which makes creating watch faces a great area for developers to explore. You can create varieties of watch faces, focusing on different perspectives and purposes. This blog can help you create a basic watch face using HTML and JavaScript in Tizen Studio. We will also discuss simple interactions, such as launching an app from watch face, providing sensor data, and so on.

Design Watch Face

Figure 1 shows a sample watch face that implements an analog clock, has two interactive icons, and shows the wearer’s step count using the pedometer sensor. One of the icons launches the SHealth app to measure heart rate, and another icon displays the current date and launches the Calendar app.

2019-12-10-01-01.png
Figure 1: Sample watch face design

Define Category

Add wearable_clock as the category of your app in the config.xml file. It defines your application as a watch face.

<tizen:category name="http://tizen.org/category/wearable_clock"/>

Create a Basic Watch Face

As this is an analog clock, first you’ll have to calculate the rotation angles of the watch hands and then update the UI accordingly. A sample implementation is shown in the following code snippets: the updateTime() function calculates rotation angle with respect to time, and the rotateElement() function updates the UI with rotating watch hands (see Figure 2).

function updateTime() {
    var curtime = new Date(),
        hour = curtime.getHours(),
        minute = curtime.getMinutes(),
        second = curtime.getSeconds();
rotateElement("hand-main-hour", (hour + (minute / 60) + (second / 3600)) * 30);
rotateElement("hand-main-minute", (minute + second / 60) * 6);
rotateElement("hand-main-second", second * 6);
     if (curDate < 10)
         str_curdate.innerHTML = "0" + curDate;
     else
         str_curdate.innerHTML = curDate;
    }

function rotateElement(elementID, angle) {
    var element = document.querySelector("#" + elementID);
    element.style.transform = "rotate(" + angle + "deg)";
}

2019-12-10-01-02.png
Figure 2: Basic watch face

Add Functionality

Launch App

The Application API provides a method to launch an app in Tizen. To launch the app, add following privilege to the config.xml file:

<tizen:privilege name="http://tizen.org/privilege/application.launch"/>

Then use launch(ApplicationID) method to launch the desired application. If you do not know the ID of that application, you can use getAppsInfo() to get the list of IDs.
The Heart icon launches SHealth app’s heart rate measuring page (com.samsung.shealth.heartrate.measure). The implementation is as follows:

var heart_click = document.getElementById("heart");
heart_click.addEventListener('click', function() {
    tizen.application.launch("com.samsung.shealth.heartrate.measure");
});

2019-12-10-01-03.png
Figure 3: Launch SHealth from the watch face

The Calendar icon shows the current date and launches the calendar application (com.samsung.w-calendar2) on the watch.

var calendar_click = document.getElementById('date-calendar');
calendar_click.addEventListener('click', function() {
    tizen.application.launch("com.samsung.w-calendar2");
});
var curtime = new Date(),
    curDate = curtime.getDate(),
    str_curdate = document.getElementById("date-calendar");
str_curdate.innerHTML = curDate;

2019-12-10-01-04.png
Figure 4: Launch Calendar from the watch face

Access Device Sensor Data

The pedometer sensor provides step count data. To access this sensor, you need to add a feature and a privilege to the config.xml file:



Next, you have to ask for user permission to start reading data from the pedometer sensor. The following code snippet shows the implementation:

function onchangedCB(pedometerInfo) {
   var str_step = document.getElementById('step-count');
   str_step.innerHTML = pedometerInfo.cumulativeTotalStepCount;

}
function onSuccess() {
   tizen.humanactivitymonitor.start("PEDOMETER", onchangedCB,onError,option);
}
function onError(e) {
   console.log("error " + JSON.stringify(e));
}
tizen.ppm.requestPermission("http://tizen.org/privilege/healthinfo", onSuccess, onError);

2019-12-10-01-05.png
Figure 5: Step count

It’s simple to add functionalities to a basic watch face, isn’t it? I hope this blog inspires and helps you create some amazing watch faces using your own ideas and designs.

View the full blog at its source

Link to comment
Share on other sites



  • Replies 0
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

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...
  • Similar Topics

    • By BGR
      It’s render season, people!
      As reported by MySmartPrice, renowned leaker OnLeaks has released a number of new renders showing off what the Galaxy Watch 6 Classic will look like. According to the report and the renders, the new Classic will “feature a rotating bezel around the circular display.” It also says that the “Pro” name is going away in favor of the new “Classic” name.
      The report also speculates that the Galaxy Watch 6 Classic will feature multiple strap options, a likely feature that is popular with most smartwatches these days.
      The Galaxy Watch 6 Classic is expected to debut at Samsung’s Galaxy Unpacked event this summer. It’s still unclear when the event will kick off, but the last event in 2022 happened at the beginning of August, so it’s likely that this year will be close to the same.
      I’m personally still good with my Apple Watch Ultra, but that’s also because the Classic is definitely not being sold as an adventure device. It looks like a pretty sick watch, though, so I’m sure people in the Samsung ecosystem will be really happy with the level of style the company could bring to it.
      Don't Miss: Uber will now let you book a Waymo self-driving car through its appThe post Samsung Galaxy Watch 6 Classic leaks, but I’m still good with my Apple Watch Ultra appeared first on BGR.
      View the full article
    • By STF News
      To enjoy their favorite content to the fullest, more and more consumers are seeking to purchase larger TVs for their homes. According to market research firm Omdia, the global market size of 85-inch screens has grown drastically from 180,000 units sold in 2019 to 1.87 million units sold in 2022. Likewise, for 98-inch screens, the global market has increased from less than 1,000 units sold in 2019 to about 160,000 units sold in 2022.
       
      To discuss the shifting market trends towards ultra-large TVs, Samsung Newsroom sat down with Heejin Chae, TV Product Planning, Samsung Electronics, and Sangyeob Kim, Samsung Store, and learned more about how Samsung Electronics is providing revamped viewing experiences through ultra-large TVs.
       
      ▲ People in charge of product planning, sales and design talk about ultra-large 98-inch TVs
       
       
      Bigger, Better Viewing Experiences With Wider TVs
      With its breathtaking size able to display exceptional detail on a grander scale, the 98-inch TV has become the new standard for ultra-large TVs. In line with such trends, Samsung unveiled the 2023 98-inch Neo QLED 8K at CES 2023, offering consumers bright colors and extremely vivid details on a brilliantly large screen. As standard TV sizes have grown larger over the years, Samsung adapted to industry trends and consumer demands by developing ultra-large TVs for better viewing experiences.
       
      “About ten years ago, a 60-inch TV was considered a large TV. But as time went by, 65-inch TVs became mainstream, and now 75-inch and 85-inch TVs have become popular, demonstrating consumers’ growing demand for larger TVs,” said Chae. “In fact, our customer survey showed that 75% of consumers bought, on average, a TV 13 inches bigger than their previously purchased TV model.”
       
      ▲ Heejin Chae explains how evolving consumer demands have shaped Samsung’s product offerings.
       
      Additionally, with the popularity of streaming services, consumers are increasingly purchasing ultra-large TVs to enhance their at-home viewing experiences. “An astronomical number of people have started using streaming services since the pandemic as they increasingly consumed content like movies and sports,” said Chae. “As a result, the demand for ultra-large TVs has risen, as they give a more immersive viewing experience.”
       
      Younger generations also seem to prefer larger screens, furthering the popularity of ultra-large TVs. While people in their 40s and 50s made up more than half of the consumer base who purchased TVs over 80 inches in 2015, those in their 30s and 40s have led sales in the ultra-large TV market since 2021.
       
      As these factors and preferences become more prevalent among users, the ultra-large TV market will continue to grow. “The ultra-large TV is an inevitable trend, and consumers are ready to enjoy extremely large TVs,” Chae said.
       
       
      Comfortable Viewing at Further Distances
      One of the biggest concerns when buying an ultra-large TV is the viewing distance — how far away the viewer is from the TV and whether that space is available at home. “As the viewing distance of the 98-inch NEO QLED TV has been shortened compared to previous ultra-large TVs, viewers can comfortably watch from as close as 4 meters away,“ said Kim.
       
      ▲ Sangyeob Kim discusses how the viewing distance of a TV affects the viewing experience.
       
      “We created a space in the store with a sofa to simulate the viewing distance at home. We move the sofa to help customers gauge the viewing distance for smaller and larger rooms. Once the customers get a feel of how the TV would fit in their homes, they tend to prefer the larger models,” Kim added.
       
      While some may have concerns about the large size of the TV, Kim explained that many consumers wish they had bought a larger size after opting for a smaller screen. “I’ve had customers call me after they had their TVs installed, asking if they can return their purchase for a larger one. That really puts me on the spot,” Kim stated. “Some even said they received the wrong TV size, claiming their TV seemed too small.”
       
      When asked about delivery and installation, Kim explained that Samsung has worked diligently to ensure customers can receive their products easily in the comfort of their homes. “98 inches is the largest TV size that a standard Korean apartment elevator can accommodate. And when the elevator is too small, we offer other optimized delivery and installation services based on the customer’s environment,” Kim explained. “In fact, we even once successfully installed a TV after climbing a spiral ladder at a two-story house.”
       
      “We thoroughly communicate with our customers and closely look at various factors in advance, such as whether it is possible to place the ultra-large TV on a table or wall mount it,” Kim added.
       
       
      From Viewing to Experience: Changing the Living Room Culture
      As TVs at home provide diverse content such as games, sports, movies and fitness content, the role TVs play has changed. As immersion is a top priority for many consumers, the popularity of large TVs is likely to continue as many consumers seek TVs that provide breathtaking experiences for all types of content.
       
      ▲ (From left) Heejin Chae, TV Product Planning, Samsung Electronics, and Sangyeob Kim, Samsung Store
       
      “Hands-on experience is necessary to show people how great a large TV is,” said Kim. “As a TV is usually the main design focal point in a room, I recommend experiencing it in person.”
       
      “When my acquaintances ask for advice about what TV to purchase, I first ask them what kind of activities they would do with their TV,” said Chae. “A larger display gives a more immersive experience. If users continue to utilize TVs for multiple purposes — including video calls, home training, gaming, etc. — ultra-large TVs will continue to be popular.”
       
      “TVs help shape the living room culture, so purchasing a new set is like an investment for the next 10 years. We will continue to focus on these aspects as we plan for future TV products. I believe Samsung TVs will continue to be at the center of home entertainment,” Chae stated.
      View the full article
    • By STF News
      View the full blog at its source





×
×
  • Create New...