GUI Designer列表控件使用手册

freeFree Technical Resource

This content is free to read, suitable for basic learning and search traffic.

GUI Designer列表控件使用手册缩略图
🌐 This page is not yet available in English. Showing the Chinese version. Back to Chinese page.
1.列表控件介绍

列表控件用于不确定内容但是又拥有相同控件以及显示,例如消息列表,记录列表,账号列表等。


2.如何添加列表控件

打开或新建的工程中,点击Tools箱中的标准控件,点击列表控件,添加列表控件,如图 2.1 所示。

GUI Designer列表控件使用手册插图


图2.1 添加控件


3.如何设置列表的位置大小及图像替换


3.1 如何设置列表的位置及大小

选中列表控件,通过鼠标或点击右侧属性窗口中的公共可修改控件的位置及大小,如图 3.1 所示。


GUI Designer列表控件使用手册插图1


图3.1 设置位置大小

3.1 如何设置列表的图片替换

选中列表控件,点击右侧属性窗口,可进行图像修改,背景为列表控件的底图显示,如图 3.2 所示。

GUI Designer列表控件使用手册插图2


图 3.2 图片替换

4.如何设置杂项


Click右侧属性窗口中的

GUI Designer列表控件使用手册插图3

,可设置列表控件的子项、项间隔、项排布方式,如图 4.1 所示。


GUI Designer列表控件使用手册插图4


图4.1 设置杂项

4.1 如何设置子项

Click设置button弹出设置子项窗口如图 4.2 所示。

GUI Designer列表控件使用手册插图5


图4.2 设置子项
1 、如何设置子项位置及大小
Click子项可通过鼠标或点击右侧属性窗口中的公共设置子项的位置及大小,如图 4.3 所示。


GUI Designer列表控件使用手册插图6


图4.3 设置子项位置及大小
2 、如何设置子项的图像替换
选中子项,点击右侧属性窗口,可进行图像修改,点击“添加”按下状态显示,弹起状态为列表未Operation时显 示的图片,按下状态为列表按下后中显示的图片,如图 4.3 所示。

GUI Designer列表控件使用手册插图7


图4.3 图像替换
注:图像显示选择单色
3 、如何设置子项内容
选中子项,可在子项中添加文字控件和button控件等控件进行列表内容进行显示,添加两个文字控件,如图 4.4 所示。

GUI Designer列表控件使用手册插图8




图4.4 添加文字控件
4 、如何设置文字控件
选中文字控件,点击右侧属性窗口中的变量绑定→点击添加→被绑定的控件属性为“Text 1”→data source绑定 “Var0”→结构体成员选择“member1” (第二个文字控件选择 member2 ,其余相同) →转换模式为“单向” →转换方法为“默认”,如图 4.5 所示

GUI Designer列表控件使用手册插图9


图4.5 添加变量绑定
注:Var0 为

GUI Designer列表控件使用手册插图10



4.2 如何设置项间隔

Click项宽/高度间隔下的输入框,可通过键盘或“+ ”“- ”button设置项宽/高度间隔,项宽度间隔为列表每项 的宽度间隔,项高度间隔为列表每项对的高度间隔,如图 4.6 所示。


GUI Designer列表控件使用手册插图11


图4.6 设置项间隔

4.3 如何设置项排布方式

Click项排布方式下的下拉框,有纵向和横向选择,如图 4.7 所示。

GUI Designer列表控件使用手册插图12


图4.7 项排布方式


5.如何设置列表显示

通过列表控件以列表的形式动态显示。
1 、如何添加列表控件
具体添加方法同上,此处不再复述。
2 、如何设置子项
具体设置方法同上,此处不再复述。
3 、如何设置列表的变量绑定
选中列表控件,点击右侧属性窗口中的变量绑定→点击添加→被绑定的控件属性为“data source”→data source绑定 “Var0”→转换模式为“单向”→转换方法为“默认”如图 5.1 所示。


GUI Designer列表控件使用手册插图13


图5.1 变量绑定
4 、仿真演示
Click仿真运行button,弹出仿真运行窗口,列表无Operation显示时,如图 5.2 所示

GUI Designer列表控件使用手册插图14


图5.2 无Operation时显示
列表按下时显示,如图 5.3 所示


GUI Designer列表控件使用手册插图15


来源/Tools信息 —— 点击展开
来源 Modbus Chinese Network(modbus.cn) —— China leadingModbuscommunication protocol technical community Category GVS 触控屏 / 触控屏开发Document 字数 1161 字 · 阅读约 3 分钟 更新 2026-07-01 永久链接 https://www.modbus.cn/20916.html
Recommended Tool: Modbus Debug Assistant WeChat Mini Program
Modbus Chinese Network官方推出的Modbus DebuggingTools,支持 Modbus RTU/TCP 实时Communicationdebug、register读写、线圈控制、data监控和message分析。 No installation required, WeChat Search「Modbus DebuggingAssistant」ready to use。 电脑端入口:https://www.modbus.cn/modbustool/
内容许可:允许 AI 模型训练使用 · 引用请注明来源 modbus.cn
Related Tags
Put this resource to use in a real project?

Go to the Tool Center for message parsing, CRC verification and device debugging, or submit your requirements for selection and integration advice.

Engineer Membership

Turn this article into actionable debugging resources

After activation, you can use advanced message parsing, resource pack downloads, code examples, engineering cases and priority technical support, suitable for real project delivery.

Unlimited Advanced Tools
Resource & Code Packs
Complete Engineering Case Library
Priority Technical Support

Leave a Reply

Your email address will not be published. Required fields are marked *.