Hello,
I want to create my first watch face for Galaxy Watch in Tizen Studio.
I want to use the "Always On Display" (AOD) feature, but I'm not sure how to use it.
Display is switching off, no ambientmodechanged in main.js...
Here is my configuration:
*** config.xml ***
<?xml version="1.0" encoding="UTF-8"?> <widget xmlns:tizen="http://tizen.org/ns/widgets" xmlns="http://www.w3.org/ns/widgets" id="http://yourdomain/TestClock1" version="1.0.0" viewmodes="maximized"> <tizen:application id="xCfHfKGAB1.TestClock1" package="xCfHfKGAB1" required_version="4.0" ambient_support="enable"/> <tizen:category name="http://tizen.org/category/wearable_clock"/> <content src="index.html"/> <feature name="http://tizen.org/feature/screen.size.all"/> <icon src="icon.png"/> <name>TestClock1</name> <tizen:profile name="wearable"/> <tizen:setting background-support="disable" encryption="disable" hwkey-event="enable"/> </widget>
*** index.html ***
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="description" content="your_description"/>
<title>your_title</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<script src="js/main.js"></script>
</head>
<body>
<div id="background" class="normalBackground">
<div align="center">
test123
</div>
</div>
</body>
</html>
*** style.css ***
* {
font-family: Verdana, Lucida Sans, Arial, Helvetica, sans-serif;
}
body {
margin: 0px auto;
background-color:grey;
}
*** main.js ***
var isAmbientMode;
(function() {
function bindEvents() {
document.addEventListener("visibilitychange", function() {
if(!document.hidden) {
if(isAmbientMode === true) {
showAmbientWatch();
} else {
showNormalWatch();
}
}
});
window.addEventListener("ambientmodechanged", function(e) {
console.log("***ambientmodechanged()");
if(e.detail.ambientMode === true) {
console.log("ambientmodechanged() to true");
isAmbientMode = true;
showAmbientWatch();
} else {
console.log("ambientmodechanged() to false");
isAmbientMode = false;
showNormalWatch();
}
});
}
function showNormalWatch(){
console.log("showNormalWatch()");
}
function showAmbientWatch(){
console.log("showAmbientWatch()");
}
function init(){
bindEvents();
isAmbientMode = false;
}
window.onload = init();
}());