1、应用场景
百分比控件可以直观地表现出某一项变量数据占总量的占比,例如展示设备在线率,
2、操作示例
2.1 绑定数据
百分比可绑定设备变量和系统变量,点击【选择】按钮,选择要绑定变量,当选择设备变量时,可双击百分比控件,弹出绑定设备变量弹窗进行绑定数据
设备变量
![](https://saas.bk-cdn.com/t/a45a380f-8a20-431d-876a-4e44296f7150/u/c2af0dd0-dfda-4254-a0a2-e26ea5bae794/1661235662809/image.png)
系统变量
![](https://saas.bk-cdn.com/t/a45a380f-8a20-431d-876a-4e44296f7150/u/c2af0dd0-dfda-4254-a0a2-e26ea5bae794/1661235676825/image.png)
2.2 设置显示范围
选择百分比的显示范围,可根据绑定变量的实际数值进行设置范围,比如最小值设置为0,最大值设置为1000,当实时数据为300时,填充控件的色块就按设置方向填充整个控件的30%。
![](https://saas.bk-cdn.com/t/a45a380f-8a20-431d-876a-4e44296f7150/u/c2af0dd0-dfda-4254-a0a2-e26ea5bae794/image1641781457349.png)
2.3 设置动画效果
控件动画效果是控件对于一个或多个数据条件的动画响应功能,当指定数据满足设置的指定条件时,百分比控件可进行显隐,旋转,闪烁例如为百分比控件设置显隐动画效果,当变量达到判断条件时,百分比控件进行隐藏
![](https://saas.bk-cdn.com/t/a45a380f-8a20-431d-876a-4e44296f7150/u/c2af0dd0-dfda-4254-a0a2-e26ea5bae794/image1641781655332.png)
其他动画使用方法和显隐类似
2.4 样式设置
在为控件做完数据设置之后,为了适应组态画面,以达到展示的美观性,可为控件进行一些样式设置,可在外观属性栏中选择百分比的样式,设置背景、填充、边框等颜色以及百分比透明度、方向,数值的文字样式大小、显示方式等
![](https://saas.bk-cdn.com/t/a45a380f-8a20-431d-876a-4e44296f7150/u/c2af0dd0-dfda-4254-a0a2-e26ea5bae794/1661235805013/image.png)
2.5 效果展示
![](https://saas.bk-cdn.com/t/a45a380f-8a20-431d-876a-4e44296f7150/u/c2af0dd0-dfda-4254-a0a2-e26ea5bae794/%E7%99%BE%E5%88%86%E6%AF%94%E6%95%88%E6%9E%9C%E5%B1%95%E7%A4%BA1641781697899.gif)