1 应用架构

2 IDE界面

如上图所示,整个IDE由以下几部分组成:
1) 菜单栏: 系统主要功能菜单
2) 工具栏: 功能快捷方式
3) 项目视图: 项目资源管理视图
4) 编辑区: 界面设计器、代码编辑器
5) 大纲视图: 用户创建控件的列表
6) 控件面板: 可视化控件选择面板
7) 控制台: 信息输出窗口
8)属性视图: 控件属性编辑窗口
3 菜单栏
下面列出常用功能
菜单 |
菜单项 |
功能说明 |
文件 |
新建 |
新建项目 |
导入... |
将其它人创建的工程导入到IDE中 |
|
导出... |
编译导出HMI程序 |
|
编辑 |
拷贝/粘贴 |
常规编辑功能,适用于源码和控件设计
|
查找/替换 |
||
源码 |
切换注释 |
用于对代码的格式化处理功能 |
添加块注释 |
||
除去块注释 |
||
格式化 |
||
对齐 |
||
更正缩进 |
||
搜索 |
|
源码、文本搜索功能 |
运行 |
运行 |
编译、运行、调试、下载功能。
调试程序时“继续”、“暂停”、“停止”、“断开连接”、“单步跳入”、“单步跳出”、“单步返回”。 |
调试 |
||
下载 |
||
继续 |
||
终止 |
||
工具 |
同步日期时间 |
用于设备管理 |
查看运行日志 |
||
清理已有程序 |
||
下载应用程序 |
||
重启HMI设备 |
||
连接设备信息 |
||
窗口 |
编辑器 |
用于视图管理,可用于打开没有开启的视图, 配置首选项等。 |
显示视图 |
||
透视图 |
||
首选项 |
||
帮助 |
检查更新 |
检查是否有最新更新 |
安装软件 |
用于安装新插件 |
4 工具栏
工具栏主要是“编译”、“运行”“下载”、“控件排序”、“视图控制”等快捷方式;
图标 | 名称 | 功能说明 | |
![]() |
编译 | 编译项目 | |
![]() |
运行 | 在电脑上仿真运行APP程序 | |
![]() |
调试 | 在电脑上调试运行APP程序 | |
![]() |
下载 | 下载程序到HMI | |
![]() |
新建... | 新建项目 | |
![]() |
保存 | 保存和全部保存 | |
![]() |
调试栏 | 调试程序时“继续”、“暂停”、“停止”、“断开连接”、“单步跳入”、“单步跳出”、“单步返回”。 | |
![]() |
跳转 | 返回上一编辑视图和跳至下一编辑视图 | |
![]() |
撤销和恢复 | ||
![]() |
对齐与尺寸 | 对所选控件进行位置和尺寸大小调整 | |
左对齐 | 将所选控件相对父控件进行左对齐 | ||
水平居中对齐 | 将所选控件在父控件中水平居中对齐 | ||
右对齐 | 将所选控件相对父控件进行右对齐 | ||
顶部对齐 | 将所选控件顶部对齐父控件 | ||
垂直居中对齐 | 将所选控件在父控件中垂直居中对齐 | ||
底部对齐 | 将所选控件底部对齐父控件 | ||
相同大小 | 将所选多个控件设置为最后一个控件大小 | ||
相同宽度 | 将所选多个控件设置为最后一个控件宽度 | ||
相同高度 | 将所选多个控件设置为最后一个控件高度 | ||
![]() |
等距 | 等大、横向等距和竖向等距 | |
![]() |
复制 | 多矩阵式复制选中控件 | |
![]() |
格式刷 | 用刷子来刷控件样式 | |
![]() |
缩放 | 控制设计窗体缩放比例 | |
![]() |
视图 | 点击切换不同视图,如设计、调试等 |
5 项目视图
项目管理视图将同一个工作空间下所有项目集中在一个视图中显示, 以树状结构来组织和管理项目资源,包括设备、工程设置、画面、代码等。如下图所示:
功能说明如下:
图标/名称 |
说明 |
|
![]() |
项目名称 |
|
|
添加和删除设备,设置设备与HMI的接口及通讯参数 |
|
|
对项目的变量、配方、事件、用户权限等进行设置维护 |
|
实时变量 |
定义和维护普通变量、设备变量,支持变量导入导出 |
|
配方数据 |
定义和维护配方变量 |
|
事件管理 |
定义事件管理 |
|
资料取样 |
定义资料取样 |
|
用户权限 |
设置用户组、用户权限 |
|
字体管理 |
维护APP字体 |
|
定时任务 |
添加、维护全局定时任务 |
|
多语言 |
添加、维护多语言标签 |
|
|
添加、删除用户画面 |
|
|
存放项目C++/C代码: “page”文件夹:存放的是各个“画面”对应的源代码文件。 HmiApp.cpp:APP入口代码。 HmiApp.h:APP头文件。 |
|
|
编译程序用到的头文件。 |
|
|
存放上位机模拟运行时产生的数据库文件和资料取样等用户生成文件。 |
|
|
本程序用到的所有图片资源文件,系统自动生成。 |
|
|
程序用到的所有字体文件。 |
|
|
编译生成的Win32下动态链接库。 |
|
|
编译生成的HMI下动态链接库。 |
6 GUI设计器
1) 标尺
如下图所示,编辑窗口可分成深灰色的可视区域以及浅灰色的非可视区域。如果用户将控件绘制到非可视区域,HMI会自动增大可视区域,此时页面比HMI的分辨率大,按住鼠标/触摸屏可以拖动画面。
可直接点击标尺增加对齐标线,对于编排画面与元件对齐有很大的帮助。在拖曳移动或缩放元件时,元件位置会自动吸附对齐标线。
2) 快速复制功能

3) 右键菜单

功能 |
描述 |
禁止拖拽 |
点击后左键拖拽将不能移动控件 |
多重复制 |
选择“多重复制”,可实现一次复制多个控件的功能。 |
对齐 |
选择控件对于页面的相对位置
|
层次 |
在设计阶段,设计画面重叠时,绘制的先后顺序决定了控件的层次,如果不是用户想要的结果,可通过此选项更改控件的层次 |
设为启动项 |
设置该页面为启动页面 |
查看源码 |
打开该画面的C++源代码 |
编译 |
编译输出当前项目 |
运行 |
在WIN上运行APP程序 |
调试 |
在WIN上调试运行程序 |
4) 设计器缩放

7 代码编辑器
1)代码编辑

2)智能代码提示
输入控件或变量后,输入.或->符号,编辑器自动弹出实例对象的成员变量或者属性方法等。如下图所示:

3)智能代码跳转


4) 代码助手

5) 语法勘误

6) 编译输出
7)查找


8)代码查错

9)字体大小调整

8 大纲视图
大纲视图是将用户绘制的控件以树形显示出来,在用户设计界面重叠时直接选择想要的控件可能很困难,此时可以使用大纲视图选择控件。
9 控件面板
目前IDE提供了四十多种各类控件供用户使用。大致分为窗体、常规控件、元件、数据/资料、设备共5类。
10 输出控制台

11 属性页

12 参考视频