如何添加端点以圈出进度条?

时间:2017-06-23 16:20:36

标签: tizen tizen-wearable-sdk tizen-web-app

我想在Tizen网站上使用Circle-Progressbar作为问卷的回答方法。重要的是,应答音阶具有极点(或端点),如“低”为0%,“高”为100%。是否有可能以某种方式“拉”进度条的开头和结尾,并为每个包含所提到的单词添加标签?它应该与http://ieeexplore.ieee.org/document/7545959/

上的下图相似

Scale with enpoint-labels

提前致谢

2 个答案:

答案 0 :(得分:1)

您是否尝试过TAU(Tizen Advanced UI)框架提供的不同类型的“进度”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库/框架。只需添加一些圆形可穿戴显示技巧。

似乎你需要一个'输入类型:范围'/滑块和两个带标签的圆形按钮。两个按钮会增加/减少滑块的val。你可以查看TAU Slider。

答案 1 :(得分:1)

我只是发布了我如何完全解决这个问题,万一有人遇到同样的情况。

我导入了JQuery插件" roundSlider"从这里:http://roundsliderui.com/进入Tizen项目。 (通过.zip文件和导入功能)

我选择了"馅饼"为我的需求塑造形状并在末端添加标签。现在它看起来像这样:Screenshot of Wearable with roundslider

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

感谢Soundar的大力帮助,感谢Armaan为正确的方向提供了暗示。