GUI 手册 · Chapter 17
View Module
View Module 是用于可视化构建设备运行画面（HMI）的 GUI 设计器。在画面中央的 XMachineEditorControl 画布上拖放按钮、指示灯、文本等 UI 控件，组成操作员实际查看和操作的运行画面。
一个 View 模块由一对文件构成：保存画面布局的设计（.xmd）与处理该画面所发生事件的脚本（.xms）。设计在本设计器中处理，事件函数在同一模块的 Functions 节点中处理。
主要区域
画面以放置控件的单一画布为中心构成。配合主窗口工具栏切换编辑状态并整理布局。
| 区域 | 说明 |
|---|---|
| 设计画布 | XMachineEditorControl。放置、移动、调整控件大小的工作区。 |
| Lock Design 切换 | 主窗口工具栏上的切换按钮，在编辑模式与锁定模式间切换。锁定时控件被固定，不会被误操作移动。 |
| 对齐按钮 | 主窗口工具栏的对齐功能，对所选控件进行左、右、上、下对齐并统一间距。 |
可放置控件的完整列表及各控件的属性见 UI Controls。
数据绑定
每个控件通过数据绑定与 Run Module 的变量相连。例如，将指示灯控件绑定到 bool 变量，则变量值为真时指示灯点亮；将数值显示控件绑定到坐标变量，则当前位置实时显示在画面上。
如此将画面与运行时变量绑定后，脚本只需更新变量，画面便随之更新。Run Module 的变量声明及绑定示例请一并参考相应章节。
事件连接
像按钮这样需要操作的控件，将事件连接到函数。对于按钮，需先在 Property Editor 中将 Action 属性设置为 RunEvent。Action 的默认值为 None，仅当为 RunEvent 时，点击才会执行 OnClickEvent 中指定的函数。然后在 XMachineEvent 项的 OnClickEvent 属性中指定要执行的函数名。在 Action 为 RunEvent 的状态下双击按钮，若函数不存在则自动创建并打开其编辑选项卡以编写动作。创建的函数会作为节点添加到同一 View 模块的 Functions 之下。分步示例在第一个项目中介绍。
使用流程
- 在主窗口工具栏关闭 Lock Design，进入编辑模式。
- 在画布上放置所需控件，调整位置与大小。
- 选中多个控件，用对齐按钮排齐。
- 为各控件的数据绑定指定 Run Module 变量。
- 需要事件的按钮，先将
Action设为RunEvent，再在OnClickEvent中连接函数并编写动作。 - 编辑完成后，重新开启 Lock Design 固定布局。