Tizen Wearable Web Widget visibilityChange 和 Debug答案

【问题标题】：Tizen Wearable Web Widget visibilityChange and DebugTizen Wearable Web Widget visibilityChange 和 Debug
【发布时间】：2018-07-18 22:35:19
【问题描述】：

我在使用 Tizen 可穿戴网络小部件时遇到了一些问题。

我刚刚使用 HTML + JS 创建了一个示例项目，并尝试更新生命周期中描述的事件页面 -> 在加载/可见性更改时

示例代码位于：https://github.com/Ryccoo/widget-test/blob/master/widget/StockQuote/js/main.js

当我添加小部件时，我可以看到文本“something” -> 表示 onload 函数已成功调用。

但是，滑动到另一个小部件并返回不会触发所描述的 visibilityChange 事件。

当用户滚动到这个小部件时如何正确上传内容？

另一个问题是如何调试网络小部件？您无法运行调试以使用小部件交互式调试程序（仅适用于 Web 应用程序），当我想将某些内容打印到控制台时，我只能看到

Web 控制台日志记录 API（console.log、console.info、console.warn、console.error）已被禁用。要激活它，您应该以调试模式启动项目。

如何在调试模式下启动小部件？

谢谢

【问题讨论】：

标签： debugging widget watch tizen visibilitychange

【解决方案1】：

Tizen Studio 尚不支持 Web Widget 调试功能。

但我已经测试了 Visibility Change 事件的代码，它在我的 Samsung Gear S3 上运行良好。每次我在小部件之间进行更改时，都会调用可见性更改回调。你可以试试这个代码示例：

项目文件夹> Widget文件夹> index.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" type="text/css" href="css/style.css">
</head>

<body>
    <div class="main-container Panel">
        <div id="Visibility"> Visibilty: Init </div>
    </div>
  <script src="js/main.js"></script>
</body>

</html>

项目文件夹 > 小部件文件夹> js > main.js

window.onload = function() {

};

document.addEventListener('visibilitychange', visibilitychange);

function visibilitychange() {
    if (document.visibilityState === 'hidden') {
        document.getElementById("Visibility").textContent = "Hidden";
    } else {
        document.getElementById("Visibility").textContent = "Visible";
    }
}

【讨论】：

我至少可以在小部件中看到 console.log 输出吗？我会尽快尝试您的代码并让您知道。谢谢。
据我所知，不，你不能。 IDE 显示消息：“Web 小部件项目不支持调试模式”（Debug As > Debug Configurations > 小部件项目名称）