大彩讲堂：VisualHMI软件如何使用功能按钮

卡米拉

https://file.gz-dc.com/%E5%A4%A7%E5%BD%A9%E7%A7%91%E6%8A%80HMI-%E5%9F%BA%E7%A1%80%E8%AF%BE%E7%A8%8B8-VisualHMI%E8%BD%AF%E4%BB%B6%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8%E5%8A%9F%E8%83%BD%E6%8C%89%E9%92%AE%E6%8E%A7%E4%BB%B6.mp4

一、概述

本文档适合于 M 系列（固件版本 >= V10.0.7.0）串口屏，VisualHMI平台上开发。功能按钮控件常用于切换画面、对话框、菜单、自定义键盘等应，其中切换动作可以在特定条件下执行。

二、开发环境

2.1 VisualHMI 软件版本
需安装 V1.0.270.0 及以上的版本进行开发。打开 VisualHMI 软件，在工程→帮助→关于，可查看到当前安装的软件版本，如图2-1所示；

图2-1 VisualHMI 软件版本

2.2 串口屏固件版本

版本查看，可通过屏幕背面的贴纸查看。

三、功能按钮

3.1 属性说明

选中菜单栏→控件→【功能按钮】，如图3-1所示。

图3-1 功能按钮

3.1.1 基本属性

多状态指示灯的基本属性如图3-2所示。

图3-2 基本属性

1. 按钮用途：可支持“切换画面”、“打开对话框”、“关闭对话框”、“虚拟按键”、“打开菜单”和“关闭菜单”等功能；

(1)切换画面

·目标画面：切换到指定画面；

·动画效果：“无”、“从左到右”、“从右到左”、“从上到下”、“从下到上”；

Ø动画范围：整个画面或者指定范围；

(2)打开对话框

·目标画面：切换到指定对话框；

·蒙层：0~100,0 为透明

·弹窗位置：可指定坐标，默认在屏幕居中显示

(3)关闭对话框：搭配打开对话框使用，按钮按下，返回原来的画面

(4)虚拟按键：配置键盘功能。本章节不进行阐述

(5)打开菜单

·目标画面：切换到指定对话框；

·蒙层：0~100,0 为透明

·弹窗位置：可指定坐标，默认在屏幕居中显示

·菜单返回地址：菜单返回值写入改地址

(6)关闭菜单：搭配打开菜单使用

菜单返回值：将数写入到“打开菜单”配置的“菜单返回地址”里

2.执行时机：画面切换的时机；可配置成“按下时” 、 “弹起时” 、 “长按时”

3.条件触发：√；当条件成立时，才执行“按钮用途”；

·条件地址：执行条件的寄存器地址

·比较：比较：支持基本的逻辑运算“>”、“<”、“>=”、“<=”、“==”、“!=”、“IN”（相当于a<=x<=b）、“OUT”（相当于a<b，x<a，x>b）。

·值：条件的比较值；

4.通知功能：执行动作时发送通知给PLC设置；

·通知地址：PLC地址

·值：给“通知地址”写值

5.播放声音：点击控件时，播放指定的声音文件。

3.1.2 状态设置

功能按钮状态设置如图3-3所示。

图3-3 功能按钮状态设置

1.使用图库：

(1)松开时图库：弹起状态显示图片；

(2)按下时图库：按下状态显示图片；

(3)裁剪：是否裁剪显示图片。

2.使用文字：

(1)默认字体：显示文字的字体；

(2)字体大小：显示字体的大小；

(3)使用标签：使用标签内容作为文字显示；

(4)选择状态：分别设置“松开时”和“按下时”的文字，颜色，对齐，多语言等属性。

四、应用案例

4.1 工程配置

4.1.1 切换画面

在“0_主页” 画面中添加一个主菜单【功能按钮】，界面配置如图4-1所示：

1.按钮用途：切换画面；

2.目标画面：1_切换画面；

3.动画效果：从上到下；

4.动画范围：整个画面。

图4-1 主画面切换画面

在“1_切换画面” 中，功能按钮属性配置如图4-2所示：

图4-2 1_切换画面

4.1.2 条件执行

条件执行通常用于点击按钮，并向PLC 或某些寄存器给设置值；

在“0_主页”画面中添加字设置按钮、添加一个功能按钮，且字设置按钮层叠在功能按钮上面，界面配置如图4-3所示：

功能按钮：

1. 按钮用途：切换画面；

·目标画面：2_条件执行；

2. 条件触发：√

·条件地址：LW1000

·比较：==

·值：1

字设置按钮：

写入地址：LW1000

操作模式：写入常量

·常量值：1

图4-3 “0_主页” 属性配置

同理在“2_条件执行”画面中，添加字设置按钮、添加一个功能按钮，且字设置按钮层叠在功能按钮上面，界面配置如图4-4所示：

功能按钮：

1.按钮用途：切换画面；

(1)目标画面：0_主画面；

2. 条件触发：√

·条件地址：LW1000

·比较：==

·值：1

字设置按钮：

1. 写入地址：LW1000

2. 操作模式：写入常量

·常量值：10

图4-4 “1_条件执行” 属性配置

4.1.3 对话框

对话框通常用重要的参数设置，弹出对话框在进一步确认或取消；若确认操作给PLC通知并返回，若取消直接返回。

在“0_主页”画面中添加一个功能按钮，界面配置如图4-5所示：

功能按钮：

1. 按钮用途：打开对话框；

·目标画面：3_对话框；

·背景蒙版：50；0-全透明，100不透明

图4-5 “0_主页” 对话框属性配置

同理在“3_对话框” 画面中，添加两个功能按钮，界面配置如图4-6所示：

“YES” 功能按钮:

1. 按钮用途：关闭对话框；

2. 通知功能：√

·通知地址：LW1001

·写值：1

“NO” 功能按钮:

1. 按钮用途：关闭对话框；

图5-6 “3_对话框”属性配置

4.1.4 菜单

弹出菜单功能：点击按钮触发弹出菜单，通过预设值的选项，并返回菜单项的数值。在“0_主页”画面中添加一个功能按钮，一个多状态指示灯，界面配置如图4-7所示：

功能按钮：

1. 按钮用途：打开菜单

(1)目标画面：“4_菜单”

(2)背景蒙版：50；0-全透明，100不透明

(3)弹出位置：自定义

·X坐标：300

·Y[color=rgba(0, 0, 0, 0.9)]坐标：85

(4)菜单返回地址：LW1002

2. 通知功能：√

·通知地址：0x0F00。改地址和“4_菜单”画面中的多状态指示灯对应

·写值：65535。复位0x0F00 的值

多状态指示灯：

1. 读取地址：LW1002

2. 状态数：6

3. 选择状态：S0~S5依次为自动、制冷、制热、送风、除湿、睡眠

图4-7 “0_主页”菜单属性配置

在“4_菜单”画面中添加5个功能按钮，5个多状态指示灯，以“自动”为例，界面配

置如图4-8所示：

“自动”功能按钮：

1.按钮用途：关闭菜单

·菜单返回：0。该值将写入“打开菜单” 配置的“菜单返回地址：LW1002”

2. 条件触发： √

·条件地址：LW0F00

·比较：==

·值：0

“多状态按钮” ：

写入地址：LW0F00

1.操作模式：写入常量

·常量值：0

图4-8 “4_菜单”属性配置

同理：制冷、制热、送风、除湿、睡眠等模式。功能按钮配置里的菜单返回值依次为1、2、3、4、5，条件触发的比较值依次为：1、2、3、4、5；字设置按钮写入的常量值：依次为1、2、3、4、5。此处不一一阐述。

4.2 运行预览

选中工程→编译下载→【编译运行】，点击相应的按钮，如图4-9所示：

图4-9 模拟运行

广州大彩智能科技有限公司(总部)

广州大彩光电科技有限公司

地址：广州市增城区宁西街新耀北路56号

销售与技术支持：(020)82186683-601

大彩深圳办事处

地址：深圳市龙岗区坂田街道深汇大厦1栋1108

邮箱：fujq@gz-dc.com
销售与技术支持：付先生 13828461018

大彩成都办事处
地址：四川省成都市高新区天府大道中段500号东方希望天祥广场C座39楼3910号
邮箱：niesl@gz-dc.com
销售与技术支持：聂经理 18180927176

大彩上海办事处
地 址：上海市浦东新区长清路1200弄森宏旗臻商务楼39号813
邮箱：sales103@gz-dc.com
销售与技术支持：刘经理 13671882080

大彩长沙办事处
地 址：湖南省长沙市开福区福元西路148号万科金MALL坊5楼5020
邮箱：sales107@gz-dc.com
销售与技术支持：徐经理  18988933535