如何将端点添加到圆形进度条？

Question

我想使用 Tizen web 中的 Circle-Progressbar 作为问卷的回答方法。重要的是，回答量表具有极点（或端点），例如 "Low" 表示 0%，"High" 表示 100%。是否有可能以某种方式 "pull" Progressbar 的开头和结尾分开并为每个添加标签，包含提到的单词？它看起来应该与下图相似，在 http://ieeexplore.ieee.org/document/7545959/

上找到

提前致谢

Answer 1

您是否尝试过 TAU ( Tizen Advanced UI ) 框架提供的不同类型的 'progress' UI 组件？

https://developer.tizen.org/development/api-references/web-application?redirect=/dev-guide/3.0.0/org.tizen.web.apireference/html/ui_fw_api/Wearable_UIComponents/wearable_circleprogressbar.htm

https://developer.tizen.org/development/api-references/web-application?redirect=/dev-guide/3.0.0/org.tizen.web.apireference/html/ui_fw_api/Wearable_UIComponents/wearable_progress.htm

https://developer.tizen.org/development/api-references/web-application?redirect=/dev-guide/3.0.0/org.tizen.web.apireference/html/ui_fw_api/Wearable_UIComponents/wearable_processing.htm

如果这些不能满足您的要求，请记住在 Web 应用程序开发中，您可以使用在线提供的所有 html css UI libraries/frameworks。只需为圆形可穿戴显示器添加一些技巧即可。

看来您需要一个 'input type: range '/滑块和两个带标签的圆形按钮。两个按钮会增加/减少滑块的值。您可以查看 TAU Slider。

Answer 2

我只是发布我是如何解决这个问题的，以防有人遇到同样的情况。

我从此处 http://roundsliderui.com/ 将 JQuery 插件 "roundSlider" 导入到 Tizen 项目中。 （通过 .zip 文件和导入功能）

我根据需要选择了 "pie" 形状，并在末端添加了标签。现在看起来像这样：

可以通过转动表圈或在所需位置触摸滑块来输入数值。

感谢 Soundar 的大力帮助，感谢 Armaan 提供正确方向的提示。