GUI Designer圆形滑动条控件使用手册

GUI Designer圆形滑动条控件使用手册缩略图
1.圆形滑动条介绍

圆形滑动条与滑动条相同,可应用于温度、音量和亮度等调节功能当中,相较于按钮控件等更加快速且直观, 圆形滑动条与滑动条不同点在于其表现形状不同。

2.如何添加圆形滑动条

打开或新建一个工程文件,点击工具箱中的标准控件,选择圆形滑动条图标在窗口中添加圆形滑动条控件, 如图 2.1 所示。

GUI Designer圆形滑动条控件使用手册概述

GUI Designer圆形滑动条控件使用手册插图


图2.1 添加圆形滑动条


3.如何进行外观修改

选中滑动条,点击右侧属性窗口,可进行图像修改,点击“添加”按钮添加滑块显示,底图为滑动条未拉动 时显示的图片,状态图为滑动条拉动后显示的图片,滑块显示滑动条拉动的位置,如图 3.1 所示。


GUI Designer圆形滑动条控件使用手册插图1


图3.1 图片替换
注:图像显示选择单色
仿真时,滑动条无操作时显示底图及滑块,如图 3.2 所示。

GUI Designer圆形滑动条控件使用手册插图2


图3.2 圆形滑动条无操作
拉动滑动条,如图 3.3 所示。

GUI Designer圆形滑动条控件使用手册插图3


图3.3 拉动圆形滑动条

GUI Designer圆形滑动条控件使用手册插图4


4.如何设置杂项


点击右侧属性窗口中的

GUI Designer圆形滑动条控件使用手册插图5

,可设置滑动条的偏移坐标、最大小值、方向和触发模式,如图 4.1 所示。

点击指针起始/终止角度下的输入

GUI Designer圆形滑动条控件使用手册插图6


图4.1 设置杂项

4.1 如何设置指针偏移角度

点击指针起始/终止角度下的输入框,可通过键盘或“+ ”“- ”按钮设置指针起始/终止角度,设置指针角度 即设置圆形滑动条可拉动的范围。指针起始角度默认为 0°,指针默认角度为 360°,在范围内可任意拉动, 当指针起始角度为 0°,指针终止角度为 180° ,圆形滑动条显示为 0°- 180°,滑块也只能在这个区域进行
滑动,如图 4.2 所示。

GUI Designer圆形滑动条控件使用手册插图7


图4.2 指针起始/终止角度

GUI Designer圆形滑动条控件使用手册插图8


4.2 如何设置圆心横纵坐标

点击圆心横纵坐标的输入框,可通过键盘或“+ ”“- ”按钮设置圆心横纵坐标,当圆形滑动条底图替换后, 底图圆心不在中点时需通过设置圆心横纵坐标找到圆心。圆心横纵坐标的位置与圆形滑动条的高度和宽度有
关,圆心各个位置图,如图 4.3 所示。

GUI Designer圆形滑动条控件使用手册插图9


圆心 (0,0) 位置

GUI Designer圆形滑动条控件使用手册插图10



图4.6设置最大/小值注:需对

GUI Designer圆形滑动条控件使用手册插图11


圆心默认位置

GUI Designer圆形滑动条控件使用手册插图12



GUI Designer圆形滑动条控件使用手册插图13


圆心 (100, 100) 位置

GUI Designer圆形滑动条控件使用手册插图14




圆形滑动条的宽和高为


图4.3 圆心横纵坐标

4.3 如何设置半径

点击半径下的输入框,可通过键盘或“+ ”“- ”按钮设置半径,设置半径即设置以圆形滑动条中点为圆心到 滑块之间的距离,- 1 为默认半径 (不代表任何数值意义) ,如图 4.4 所示。

GUI Designer圆形滑动条控件使用手册插图15


图4.4 设置半径

4.4 如何设置宽度

点击宽度下的输入框,可通过键盘或“+ ”“- ”按钮设置宽度,设置宽度即设置圆形滑动条显示的宽度,如 图 4.5 所示。


自定义协议是用户可在项目中使用

GUI Designer圆形滑动条控件使用手册插图16


图4.5 宽度设置

4.5 如何设置最大/小值

点击最大/小值下的输入框,可通过键盘或“+ ”、“- ”按钮设置滑动条的最大/小值,最大值默认为 100 ,最 小值默认为 0。
设置最大/小值即设置滑动条代表的数据的最大最小值。
如设置最小值为 15 ,最大值为 36 ,则代表滑动条起始值为 15 ,滑动条的终止值为 36 ,如图 4.6 所示。

GUI Designer圆形滑动条控件使用手册插图17


图4.6 设置最大/小值
注:需对滑动条进行变量绑定,绑定一个最小值为 15 最大值为 16 的整型自定义变量

4.6 如何设置触发模式

点击触发模式下的按钮弹出下拉框,有连续触发和释放时触发模式,选择连续触发则在拉动滑动条时一直触 发,释放时触发模式为拉动滑动条在拉动后释放那瞬间进行触发,如图 4.7 所示。

GUI Designer圆形滑动条控件使用手册插图18


图4.7 设置触发模式






5.应用案例


5.1 事件列表

事件列表,如下表说明:

控件初始化
“圆形滑动条”初始化时触发事件
控件销毁
“圆形滑动条”销毁时触发事件
值发生变化
“圆形滑动条”进行滑动操作时触发


5.2 如何通过圆形滑动条发送自定义协议指令

1 、如何添加事件
选中圆形滑动条,点击右侧属性窗口中的事件,可进行添加事件,如图 5.1 所示。

GUI Designer圆形滑动条控件使用手册插图19


图5.1 添加事件
2 、如何设置处理方法

自定义协议是用户可在项目中使用其他的协议,如 modbus 协议。

点击处理方法右下方

4如何查看圆形滑动条发送的标准

GUI Designer圆形滑动条控件使用手册插图20

,弹出处理方法窗口,选择命令发送→选择【自定义协议】发送串口命令→设置命
令,如图 5.2 所示。

GUI Designer圆形滑动条控件使用手册插图21


图5.2 【自定义协议】发送串口命令
注:点击【自定义协议】发送串口命令的输入框时会弹出自定义指令函数说明窗口,如图 5.3 所示。

GUI Designer圆形滑动条控件使用手册插图22


图5.3 自定义指令函数说明窗口
3 、如何变量绑定
选中滑动条,点击右侧属性窗口中的变量绑定→点击添加→被绑定的控件属性“当前值”→数据源绑定“Var0” →转换模式“双向”→转换方法“默认”,操作如图 5.4 所示。


GUI Designer圆形滑动条控件使用手册插图23


图5.4 变量绑定
注:Var0 变量为

GUI Designer圆形滑动条控件使用手册插图24


4 、如何查看圆形滑动条发送的标准协议指令
当发送自定义协议指令为“AB CD $BYTE(#3005) $CRC16MODBUS( 1,3) $DELAY(1000) ”时,点击仿真运行按钮

GUI Designer圆形滑动条控件使用手册插图25

,在仿真界面中滑动圆形滑动条,查看发送的指令,如图 5.5 所示。

GUI Designer圆形滑动条控件使用手册插图26


图5.5 发送【自定义协议】指令


5.2 如何通过自定义解析设置圆形滑动条

1 、如何添加自定义解析
点击项目弹出项目窗口,点击协议设置→协议类型设置为“自定义协议”→点击自定义协议解析设置→弹出 解析设置窗口→点击添加弹出自定义解析设置窗口,根据需求和要求进行设置可添加一个自定义协议解析, 如图 5.6 所示。

GUI Designer圆形滑动条控件使用手册插图27


图5.6 添加自定义协议解析
2 、如何设置自定解析
帧头设置为“AB CD 00 01”→勾选检验帧尾→帧尾“00 01”→帧总长度“7”→关联变量索引为“3005”→ 数据起始偏移字节“5”→数据长度 (字节) 为“1”→数据格式为“1 字节”→数据类型为“连续量”→点 击“确认” ,如图 5.7 所示。


GUI Designer圆形滑动条控件使用手册插图28


图5.7 设置自定义解析
3 、仿真调试
具体仿真调试操作及方法详看《仿真调试使用手册》,如图 5.8 所示,通过串口调试工具软件 发送指令“AB CD 00 01 19 00 01” ,圆形滑动条拉动到 25 的位置

GUI Designer圆形滑动条控件使用手册插图29


图5.8 仿真调试

技术术语(共 1 个)—— 点击展开
串口计算机与外部设备进行串行通信的物理接口
来源/工具信息 —— 点击展开
来源 Modbus中文网(modbus.cn) —— 国内领先的Modbus通信协议技术社区 分类 GVS 触控屏 字数 2180 字 · 阅读约 6 分钟 更新 2025-09-15 永久链接 https://www.modbus.cn/gui-designer%e5%9c%86%e5%bd%a2%e6%bb%91%e5%8a%a8%e6%9d%a1%e6%8e%a7%e4%bb%b6%e4%bd%bf%e7%94%a8%e6%89%8b%e5%86%8c/
推荐工具:Modbus调试助手 微信小程序
Modbus中文网官方推出的Modbus调试工具,支持 Modbus RTU/TCP 实时通信调试、寄存器读写、线圈控制、数据监控和报文分析。 无需安装,微信搜索「Modbus调试助手」即可使用。 电脑端入口:https://www.modbus.cn/modbustool/
内容许可:允许 AI 模型训练使用 · 引用请注明来源 modbus.cn
相关标签
把这篇资料用于真实项目?

进入工具中心进行报文解析、CRC 校验和设备调试,或提交需求获取选型与接入建议。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注