Languages

Menu
Sites
Language
Watch face: previous time for a while after switching the screen on

Hello

I created my first watch face and I have a problem: after switching the screen on I see the previous time. It lasts only a while but it's visible and annoing. I use visibilitychange event and during this I made hands' rotation. I tried to hide hands before the screen goes out and then, when the screen is on, rotate them and show them. It doesn't help. Any ideas?

List

Responses

8 Replies
André Reus

Hi Marek Jóźwik, 
You didn't mention which API you have used to develop your watch face app. basically there are two ways to develop a watch face in Tizen web. First one is Tizen Time API with basic JavaScript and second one is Tizen Time API with Canvas. So, please give more details with some code to understand the problem. 

Marek Jóźwik

I use Tizen Time API with basic JavaScript.

I followed according this tutorial:

https://developer.tizen.org/development/training/web-application/getting-started/creating-your-first-tizen-wearable-web-watch-application

I made many changes and and everythig works fine except for this problem.

 

André Reus

I think your update function is the reason for that delay!  When you call updateTime() function...may be this one takes time ..So use the Hand update works before your heavy works in this function ..
 

function updateTime() {

 //  use these code here 
    var datetime = tizen.time.getCurrentDateTime(),
        hour = datetime.getHours(),
        minute = datetime.getMinutes(),
        second = datetime.getSeconds();

    /* Rotate the clock hands */
    rotateElement('hand-main-hour', (hour + (minute / 60) + (second / 3600)) * 30);
    rotateElement('hand-main-minute', (minute + second / 60) * 6);
    rotateElement('hand-main-second', second * 6);

// do your other works here 

}

 

Marek Jóźwik

I did the following test:

document.addEventListener("visibilitychange", function() {
    if (!document.hidden) {
      showHands();
    }
    else {
      hideHands();
    }
});
        
function showHands() {
    hourHand.style.visibility = visible;
    minuteHand.style.visibility = visible;
}        
        
function hideHands() {
    hourHand.style.visibility = hidden;
    minuteHand.style.visibility = hidden;
}

When I switch on the screen, the hands are visible and they disappear in a moment.

It means that system doesn't refresh the screen during visibilitychange event fired when the screen goes out. It does it when the screen is switched on.

André Reus

At first please make your the basic app of link given by you works fine without lagging. If not, i think the problem is in your code. May be your made your app overloaded. please check .

Alexander Smirnov

Can confirm that this lag exists in my Galaxy Watch Active with latest update. Even if I use 'Chronograph watch' with Native app or 'Basic watch' from Web app from standart examples of Tizen studio I can see small lag after the screen turn on. It may be noticeable with second hand of that watchfaces. So something additional code should be taken into account in order to avoid that lag. Imagine that, for instance, 2.5 hours left after the screen sleep down and user wake it up, not only second hand will jump, but the hour and minute ones will jump as well to the updated positions. Looks weird. 

Btw, i've checked my watchfaces from Tizen Studio and from Galaxy Watch Designer, and watchface from Tizen Studio has that lag, whereas watchface from Galaxy Watch Designer hasn't. Strange thing! 

Andrew Nex

I'm facing the same issue.

Gear S3 Frontier
One UI version 1.0
Tizen version 4.0.0.4 
Tizen Studio Project version wearable-2.3.1
Tizen Studio 3.1

Ismael Sanchez

Hi, I resolved a similar issue by using the following code:

 function onScreenStateChanged(previousState, changedState)
        {
            var background = document.getElementById("background"); // get main screen element from DOM
            if(previousState === "SCREEN_OFF") { // screen is visible
                setTimeout(updateTime,0); // we want to make sure it updates whatever we want to set correctly before making the screen visible, so we use setTimeout to incude it in the stack and assign 0 ms
                setTimeout(function() {
                    background.style.display = "block"; // we make the main scren DOM element visible, adding it to the stack (setTimeout) and making a little pause (200ms) to make sure it behaves properly
                },200);
            } else {
                background.style.display = "none"; // screen is not visible, so we remove visibility of the DOM element
            }
        }

        /* Sets the screen state change listener. */
        tizen.power.setScreenStateChangeListener(onScreenStateChanged);

Hope it works for clock hands, I haven't tried it.