JianStudio

博文

B&R VC4 (Visual Components 4) HMI 深度分析与 AI 自动生成可行性报告

工控笔记

基于 APJX_FKJ 项目源码逆向分析（发现 .page 文件为纯 XML，可直接 AI 生成） 分析日期：2025年

一、VC4 是什么？

VC4（Visual Components 4） 是 B&R（贝加莱）Automation Studio 内置的经典 HMI 可视化方案，运行在 Power Panel 系列一体机的实时操作系统上。

核心特征

特征说明
运行平台Power Panel 本地显示（非 Web）
开发工具Automation Studio → Visual Components 编辑器（拖拽式）
编程接口VisAPI（C 函数库，可从 ST 调用）
编译产物.ccf（二进制编译文件）+ .br（运行时模块）
页面源文件.page — 纯 XML，可读可写可生成 ⭐
资源文件.vcr / .png / .bminfo / .bmgrp / .txtgrp / .dso
多语言原生支持（XML 定义）
颜色系统256 色调色板（索引色）

二、VC4 项目文件体系（完整清单）

2.1 核心目录结构

Logical/
├── Visu/                          ← HMI 可视化模块
│   ├── Pages/                     ← ⭐ HMI 页面源文件（XML）
│   │   ├── P00.page               ← 首页（进入画面）
│   │   ├── P10.page               ← 主控页面（1350行）
│   │   ├── P20.page               ← 配方/参数（2172行）
│   │   ├── P21.page               ← （1185行）
│   │   ├── P22.page               ← （645行）
│   │   ├── P30.page               ← ★ 温控界面（5029行，最大）
│   │   ├── P31.page               ← 整定页面（3828行）
│   │   ├── P32.page               ← 电流监控（1326行）
│   │   ├── P40.page               ← （947行）
│   │   ├── P50.page               ← （1230行）
│   │   ├── P60.page               ← （742行）
│   │   ├── P61.page               ← （1307行）
│   │   └── P70.page               ← （305行）
│   ├── Palette.vcr                ← 256色调色板
│   ├── Bitmaps/                   ← 位图资源（PNG + XML 描述）
│   │   ├── BackgroundWSVGA.png    ← 背景图（1024×600）
│   │   ├── Img_Home.png / Img_Config.png / ...
│   │   ├── GreenLight.png
│   │   ├── Key_*.png              ← 虚拟键盘
│   │   ├── Alarm_*.png            ← 报警图标
│   │   └── ...（约 150+ 个 PNG）
│   └── BitmapGroups/              ← 位图分组索引
│       ├── GlobalArea.bmgrp
│       ├── Borders.bmgrp
│       ├── Pads.bmgrp
│       ├── Alarm*.bmgrp
│       └── msgBox.bmgrp
│
├── VCShared/                      ← VC4 共享资源
│   ├── Languages.vcr              ← XML: 语言定义（zh/en/de）
│   ├── Package.vcp                ← XML: 项目文件清单
│   ├── ControlVersion.cvinfo      ← XML: 所有控件版本清单
│   ├── DataSources/
│   │   ├── DataSource.dso         ← XML: PLC ↔ HMI 数据点映射（3525行）
│   │   └── Internal.dso           ← XML: 系统内部数据点
│   ├── TextGroups/                ← 多语言字符串
│   │   ├── AlarmState.txtgrp      ← XML
│   │   ├── MpRecipeUI*.txtgrp
│   │   ├── MpUserX*.txtgrp
│   │   └── TextGroup_1.txtgrp
│   ├── AlarmGroups/               ← 报警组定义
│   │   ├── AlarmSystem.alcfg      ← XML
│   │   ├── SystemAlarms.algrp
│   │   └── AlarmGroup_1.algrp
│   └── UnitGroups/                ← 工程单位
│       ├── Temperatures.vcug
│       ├── Pressure.vcug / Length.vcug / ...
│
├── Libraries/visapi/              ← VisAPI 运行时库（200+ API）
│
└── Pro_Alarm/Main.st              ← PLC 侧 VisAPI 调用

2.2 编译产物

Temp/Objects/.../Visu/
├── Visu01.ccf / Visu02.ccf / Visu03.ccf   ← 编译后的页面
├── Visu.prj                                ← 二进制项目描述
└── Visu.mak                                ← makefile

Binaries/.../
├── Visu.br / Visu01.br / Visu02.br / Visu03.br   ← 运行时模块

三、page 文件格式完全解析 ⭐（核心发现）

.page 文件就是纯 XML，可用记事本/任何文本编辑器打开、编辑、生成。以下是从本项目提取的完整格式规范。

3.1 页面基本结构

<?xml version="1.0" encoding="UTF-8"?>
<?AutomationStudio Version="4.12.6.106"?>
<Page xmlns="http://br-automation.co.at/AS/VC/Project" Name="P30">
  <Property Name="Description" Value="温控界面"/>
  <Property Name="Height" Value="600"/>        <!-- 页面高度 -->
  <Property Name="Index" Value="30"/>           <!-- 页面索引 -->
  <Property Name="Width" Value="1024"/>         <!-- 页面宽度 1024×600 WSVGA -->

  <Layers>
    <LayerRef Source="Source[local].Layer[Public]">  <!-- 引用公共层（导航栏） -->
      ...
    </LayerRef>
    <Layer Name="Default">                           <!-- 主图层 -->
      <Property Name="BackColor" Value="9"/>         <!-- 背景色（调色板索引） -->
      <Property Name="Z-Order" Value="1"/>

      <TextGroup>                                    <!-- 本层多语言文本字典 -->
        <TextLayer LanguageId="en">...</TextLayer>
        <TextLayer LanguageId="de">...</TextLayer>
        <TextLayer LanguageId="zh">                  <!-- 中文文本 -->
          <Text ID="98009" Value="温控界面"/>
          <Text ID="98011" Value="封1-1"/>
          <Text ID="98017" Value="PV"/>
          <Text ID="98018" Value="SV"/>
          ...（每个文本有唯一 ID）
        </TextLayer>
        <IndexMap>
          <Index ID="98009" Value="0"/>              <!-- ID → 索引映射 -->
          <Index ID="98011" Value="2"/>
        </IndexMap>
      </TextGroup>

      <Controls>
        <!-- ⭐ 控件定义在这里 -->
      </Controls>

      <KeyMapping>
        <!-- ⭐ 交互动作定义在这里 -->
      </KeyMapping>
    </Layer>
  </Layers>

  <MovementOrder>                          <!-- 方向键导航 -->
    <MovementEntry Control="...">
      <Property Name="Up" Value="..."/>
      <Property Name="Down" Value="..."/>
      <Property Name="Left" Value="..."/>
      <Property Name="Right" Value="..."/>
    </MovementEntry>
  </MovementOrder>

  <TabSequence>                            <!-- Tab 键顺序 -->
    <TabSeqItem Index="0" Value="..."/>
  </TabSequence>
</Page>

3.2 控件类型详解（从本项目中提取）

✅ Button（按钮）— ClassId=0x00001002

<Control ClassId="0x00001002" Name="Button_1">
  <Property Name="BackColor" Value="204"/>
  <Property Name="ForeColor" Value="239"/>
  <Property Name="Border" Value="Source[local].Border[Raised]"/>
  <Property Name="Font" Value="Source[local].Font[ChangePage]"/>
  <Property Name="Height" Value="50"/>
  <Property Name="Left" Value="855"/>
  <Property Name="Top" Value="535"/>
  <Property Name="Width" Value="150"/>
  <Property Name="TextGroup" Value="Source[embedded].TextGroup"/>
  <Property Name="TextIndex" Value="0"/>        <!-- 指向 TextGroup 中索引 0 的文字 -->
  <Property Name="TextSource" Value="SingleText"/>
  <Property Name="EmbVirtualKey" Value="Source[local].VirtualKey[%embVirtualKey_30]"/>
  <Property Name="StyleClass" Value="Source[relative:StyleGroup].StyleClass[CheckBox]"/>
  ...
</Control>

特殊按钮风格 StyleClass[CheckBox]：带按压状态保持，用于手动控制。

✅ Text（文本标签）— ClassId=0x00001004

<Control ClassId="0x00001004" Name="Text_1">
  <Property Name="AlignmentVertical" Value="Center"/>
  <Property Name="Font" Value="Source[local].Font[Word]"/>
  <Property Name="Height" Value="40"/>
  <Property Name="Left" Value="40"/>
  <Property Name="Top" Value="410"/>
  <Property Name="Width" Value="130"/>
  <Property Name="TextGroup" Value="Source[embedded].TextGroup"/>
  <Property Name="TextIndexOffset" Value="22"/>    <!-- 文本索引偏移量 -->
  <Property Name="TextSource" Value="SingleText"/>
</Control>

✅ Numeric（数值显示/编辑）— ClassId=0x00001007 ⭐ 核心

<Control ClassId="0x00001007" Name="Numeric_4">
  <Property Name="AddFractionDigits" Value="1"/>         <!-- 小数位 1 位 -->
  <Property Name="AlignmentHorizontal" Value="Center"/>
  <Property Name="BackColor" Value="254"/>
  <Property Name="Border" Value="None"/>
  <Property Name="Font" Value="Source[local].Font[Display]"/>
  <Property Name="ForeColor" Value="253"/>
  <Property Name="Height" Value="40"/>
  <Property Name="Input" Value="True"/>                   <!-- 允许输入 -->
  <Property Name="InputTouchpad" Value="Source[local].TouchPad[NumPad]"/>
  <Property Name="Left" Value="50"/>
  <Property Name="MinValue" Value="0"/>
  <Property Name="Top" Value="100"/>
  <Property Name="ValueDatapoint"                        <!-- ⭐ 数据绑定 -->
       Value="Source[global].Variable[DataSource.gHmi.rActPv[0]]"/>
  <Property Name="ValueMode" Value="Standard"/>
  <Property Name="Width" Value="105"/>
</Control>

Numeric 控件绑定了 gHmi.rActPv[0]（通道0的实际温度 PV），并可编辑。

✅ Line（线条分隔）— ClassId=0x0000100D

<Control ClassId="0x0000100D" Name="Line_1">
  <Property Name="EndX" Value="1014"/>
  <Property Name="EndY" Value="300"/>
  <Property Name="LineWidth" Value="2"/>
  <Property Name="StartX" Value="5"/>
  <Property Name="StartY" Value="300"/>
</Control>

3.3 交互动作解析（KeyMapping）

每个按钮绑定一个 VirtualKey，VirtualKey 包含 KeyActions：

<VirtualKey Name="%embVirtualKey_42">
  <KeyActions>
    <!-- ⭐ 切换到另一页 -->
    <KeyAction ClassId="0x00000160">        <!-- ChangePage -->
      <Property Name="Page" Value="Source[local].Page[P31]"/>
      <Property Name="Target" Value="Page"/>
    </KeyAction>
  </KeyActions>
</VirtualKey>

动作类型对照（从 ControlVersion.cvinfo 提取）：

ClassId动作描述示例
0x00000160ChangePage页面切换→ Page[P31]
0x0000016AToggleDatapoint翻转 BOOL→ bAutoSealing1 取反
0x0000016BMomentaryDatapoint瞬时 ON/OFF按下=1，释放=0
0x00000161SetDatapoint设值设置固定值
0x00000162UpDownDatapoint增减数值微调

ToggleDatapoint 示例（自动模式按钮）：

<KeyAction ClassId="0x0000016A">
  <Property Name="SetValue" Value="1"/>
  <Property Name="ResetValue" Value="0"/>
  <Property Name="ValueDatapoint"
       Value="Source[global].Variable[DataSource.gHmi.Cmd.bAutoSealing1]"/>
</KeyAction>

3.4 Public 公共层（导航栏）

所有页面通过 LayerRef 引用同一公共层。公共层内容在页面内联定义：

<LayerRef Source="Source[local].Layer[Public]">
  <!-- 包含导航按钮（主页/配置/诊断/趋势）、报警列表 -->
</LayerRef>

公共层包含：

  • Alarm_1 — 报警组件（报警列表/指示器）— 所有页面共享
  • 导航按钮 — 快速跳转到各页面

四、页面导航结构（本项目的完整还原）

从 DataSource.dso（3525行变量映射）+ 13个 .page 文件，完整还原 HMI 结构：

P00  ── 首页（进入画面）
 │      1个按钮 "进入" → P10
 │
P10  ── 主控页面（生产运行）
 │      手动控制区：落杯/剪切/修正/冷却/打码/充填1/充填2/封口1/封口2/封口1加热/封口2加热
 │      自动控制区：清洗/搅拌电机/进料/充氮/收膜/封口1手动
 │      状态显示：当前产量、模数、模/分
 │      系统控制：启动/停止/暂停/复位/清零
 │      导航按钮：主页 → P00
 │
 ├── P20 ── 配方/参数设置
 │   ├── P21
 │   └── P22
 │
 ├── P30 ── ★ 温控界面（12通道 PID 控制）
 │   │      封口1区 1-6 通道：PV（实际温度）/ SV（设定温度）/ ▲加 / ▼减
 │   │      封口2区 7-12 通道：PV / SV / ▲加 / ▼减
 │   │      批量操作：统加+ / 统减-
 │   │      状态控制：封口1开启/关闭、封口2开启/关闭
 │   │      导航：整定页面 → P31
 │   │
 │   ├── P31 ── 整定页面（PID 自整定）
 │   │   └── P32 ── 电流监控
 │   │
 │   ├── P40 ── （备用/扩展）
 │   │
 │   ├── P50 ── （备用/扩展）
 │   │
 │   ├── P60 ── （备用/扩展）
 │   │   └── P61
 │   │
 │   └── P70 ── （备用/扩展）
 │
 └──（公共层导航栏：主页 / 配置 / 诊断 / 趋势 / 报警）

页面规模统计

页面行数控件数（估计）说明
P00871首页，仅一个”进入”按钮
P101,350~50主控页面
P202,172~80参数配制
P211,185~45子页面
P22645~25子页面
P305,029~200★ 温控核心（最大）
P313,828~150整定页面
P321,326~50电流监控
P40947~35备用
P501,230~45备用
P60742~25备用
P611,307~50备用
P70305~10备用
合计≈ 20,000+~700+13 个页面

五、控件与 PLC 变量的数据绑定

5.1 绑定方式

VC4 控件的核心机制是通过 ValueDatapoint 属性绑定到 PLC 变量：

ValueDatapoint="Source[global].Variable[DataSource.变量路径]"

例如：

  • DataSource.gHmi.rActPv[0] — 通道0实际温度
  • DataSource.gPara.rSV[0] — 通道0设定温度
  • DataSource.gHmi.Cmd.bAutoSealing1 — 封口1自动使能
  • DataSource.gHmi.Cmd.bTemp[0] — 通道0加热使能

5.2 数据点映射文件

DataSource.dso（3525行）定义了所有可用的数据点。AI 生成时需要同步更新此文件。

<DataSource Name="DataSource">
  <DataPoints>
    <Folder Name="gHmi">
      <Folder Name="Cmd">
        <DataPoint Name="bSealing1Temp">    <!-- 封口1加热使能 -->
          <Property Name="PLCType" Value="BOOL"/>
          <Property Name="VCType" Value="BOOL"/>
          <Property Name="ConnectingVisus" Value="Visu"/>
        </DataPoint>
        ...
      </Folder>
      <DataPoint Name="rActPv">            <!-- 实际温度数组 -->
        <Property Name="PLCType" Value="REAL[0..11]"/>
      </DataPoint>
    </Folder>
    <Folder Name="gPara">...</Folder>
    <Folder Name="gAlarm">...</Folder>
    <Folder Name="gMessage">...</Folder>
    <Folder Name="gIO">...</Folder>
  </DataPoints>
</DataSource>

六、AI 自动生成 HMI 的可行性分析（更新版）

⭐ 关键发现

由于 .page 文件是 纯 XML，意味着 AI 完全可以：

  1. ✅ 直接生成完整的 .page 页面文件
  2. ✅ 直接生成 DataSource.dso 数据映射
  3. ✅ 直接生成 TextGroups 多语言字符串
  4. ✅ 直接生成 Bitmaps/*.bminfo
  5. ✅ 直接生成 BitmapGroups/*.bmgrp
  6. ✅ 直接生成 AlarmGroups/*.algrp

6.1 可行性矩阵

方案可行性自动化度说明
AI 直接生成 .page XML✅ 完全可行90%最新发现！页面源文件是 XML，可直接生成
AI 生成 DataSource.dso✅ 完全可行95%XML 格式，可从 PLC 变量定义自动生成
AI 生成 TextGroups✅ 完全可行95%XML 格式，多语言字符串
AI 生成位图索引✅ 可行80%bminfo/bmgrp 是 XML
AI 生成 PNG 图片✅ 可行（DALL·E/MJ）70%需生成工业风格位图
AI 生成后 AS 编译为 CCF✅ 标准流程—生成 .page → AS 打开 → 编译 → 部署

6.2 推荐方案：AI 端到端生成 VC4 工程 ⭐

Step 1: 输入
  └── 工艺描述 + PLC 变量定义（Global.var / Types.typ）
       + 参考图片（可选）
       + 颜色风格偏好

Step 2: AI 生成
  ├── 页面文件（Pages/*.page）— ★ 核心
  │   ├── 页面结构（标题、尺寸 1024×600）
  │   ├── TextGroup（中文标签 + 英/德文预留）
  │   ├── Controls（按布局排列）
  │   │   ├── Numeric ← 温度显示（绑定 PLC 变量）
  │   │   ├── Button  ← 控制按钮（绑定 ToggleDatapoint）
  │   │   ├── Text    ← 静态标签
  │   │   ├── Bitmap  ← 状态指示灯
  │   │   └── BarGraph ← 进度条
  │   └── KeyMapping（交互逻辑）
  │       ├── ChangePage → 页面导航
  │       ├── ToggleDatapoint → 开关控制
  │       └── MomentaryDatapoint → 瞬时动作
  │
  ├── DataSource.dso（PLC 变量映射）
  ├── TextGroups/*.txtgrp（多语言字符串）
  ├── BitmapGroups/*.bmgrp（位图索引）
  ├── Bitmaps/*.bminfo（位图描述）
  ├── Palette.vcr（调色板，可选）
  └── Languages.vcr（语言配置）

Step 3: 验证
  └── Automation Studio 打开 → 编译 → 确认无误

Step 4: 部署
  └── 下载到 Power Panel → 运行

6.3 实现架构

┌──────────────────────────────────────────────────────────────┐
│  AI VC4 Generator                                             │
├──────────────────────────────────────────────────────────────┤
│                                                               │
│  Input Processor:                                             │
│    "需要12通道温度控制，分两组封口区，每个通道显示PV/SV..."      │
│    → PLCLib: 从 Global.var 解析变量列表                        │
│    → LayoutLib: 根据控件数量自动计算布局坐标                    │
│    → TextLib: 生成中/英/德多语言文本                           │
│                                                               │
│  Generator Modules:                                           │
│    ├─ PageGenerator                                           │
│    │   ├─ 根据页面模板 + 控件列表 → .page XML                  │
│    │   ├─ 自动分配 Text ID（唯一数值ID）                       │
│    │   ├─ 自动分配 Control Name                               │
│    │   ├─ 自动计算 Left/Top（网格布局算法）                    │
│    │   └─ 自动生成 MovementOrder + TabSequence                 │
│    │                                                          │
│    ├─ DataSourceGenerator                                     │
│    │   └─ 从 PLC 变量 + 控件绑定需求 → .dso XML               │
│    │                                                          │
│    ├─ TextGroupGenerator                                      │
│    │   └─ 从 PageGenerator 收集的 TextID → .txtgrp XML        │
│    │                                                          │
│    └─ PackageGenerator                                        │
│        └─ 生成 .vcp 项目清单 + Makefile                       │
│                                                               │
│  Output:                                                      │
│    Logical/Visu/Pages/*.page                                  │
│    Logical/VCShared/DataSources/DataSource.dso                │
│    Logical/VCShared/TextGroups/*.txtgrp                       │
│    ...                                                        │
│    → 复制到 Automation Studio 项目 → 编译 → 部署              │
└──────────────────────────────────────────────────────────────┘

6.4 布局算法建议

由于 VC4 使用绝对坐标定位（无响应式），AI 生成时需要自动计算控件位置：

页面尺寸：1024 × 600 像素（WSVGA）

常用网格：
  - 温度通道卡片：每个 120×80，水平排列 6 个，分两行
  - 控制按钮：150×50，根据功能分组排列
  - 状态显示：200×40，左对齐
  - 数值输入：105×40，带标签

间距规范（来自本项目中现有代码）：
  - 水平间距：~30px（SpacingHorizontal）
  - 行高：~50-60px（按钮）
  - 区域分隔：Line 组件 + 2px 线宽
  - 顶部导航栏：60px 高度
  - 底部报警栏：40px 高度
  - 可用区域：1024×500（除去导航和报警）

6.5 需要处理的 ID 管理

VC4 使用整数 ID 来关联文本、位图、控件：

ID 类型范围（本项目）说明
Text ID95670 ~ 112403全局唯一文本标识符
Text Index0 ~ 268页内索引（每个 IndexMap 定义）
Bitmap Index0 ~ 255调色板索引
Control NameButton_1 ~ Button_N页面内唯一名称
ControlID0本项目中全部为 0（未使用）

AI 生成时需要维护一个全局 ID 计数器，确保 Text ID 不冲突。

七、从本项目学习到的 VC4 设计模式

7.1 页面布局模式

温控页面（P30）布局 = 2×6 网格：

┌────────────────────────────────────────────────────────────┐
│  温控界面（标题栏）                                          │
├──────┬──────┬──────┬──────┬──────┬──────┬──────┬────────┤
│ 封1-1│ 封1-2│ 封1-3│ 封1-4│ 封1-5│ 封1-6│      │        │
│ PV   │ PV   │ PV   │ PV   │ PV   │ PV   │封口1  │ 整定   │
│ SV   │ SV   │ SV   │ SV   │ SV   │ SV   │开启/  │ 页面   │
│ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │关闭   │        │
├──────┼──────┼──────┼──────┼──────┼──────┤       │        │
│ 封2-1│ 封2-2│ 封2-3│ 封2-4│ 封2-5│ 封2-6│封口2  │ 电流   │
│ PV   │ PV   │ PV   │ PV   │ PV   │ PV   │开启/  │ 监控   │
│ SV   │ SV   │ SV   │ SV   │ SV   │ SV   │关闭   │        │
│ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │ ▲ ▼  │统加+  │        │
│      │      │      │      │      │      │统减-  │        │
├──────┴──────┴──────┴──────┴──────┴──────┴──────┴────────┤
│  报警栏（Alarm_1 组件）                                   │
└────────────────────────────────────────────────────────────┘

7.2 颜色规范

颜色索引色值用途
9#6E6EC5页面背景（深蓝灰）
204—标题栏按钮背景
239—按钮文字颜色（浅色）
240—按钮按压文字
248—手动控制按钮背景
250#D9D9D9页面背景（浅灰，某些页面）
253—数值文字颜色
254—数值输入框背景

7.3 字体规范

字体名称用途
ChangePage导航按钮文字
AutoButton控制按钮文字
Word静态标签文字
Display数值显示
TempFont温度区域标签

八、结论与最终建议

重大发现

.page 文件是纯 XML！AI 可以直接生成完整的 VC4 HMI 工程页面！

这意味着 VC4 HMI 开发可以做到 AI 全自动生成，无需任何逆向工程。

推荐实施路线

Phase 1（✅ 已完成 — 实际样机验证通过）
  ├── 让 AI 生成一个完整的 .page 文件（12通道温度监控页 P80）
  ├── 注册到 Package.vcp
  ├── 导入 Automation Studio → 编译 → 部署 → 样机验证
  └── ✅ 结论：AI 生成的 .page 文件在实机上可正常运行

Phase 2（1-2周）— 模板化生成
  ├── 开发 VC4 Generator 脚本
  ├── 输入：PLC 变量 JSON + 页面描述
  ├── 输出：完整的 Pages/*.page + DataSource.dso + TextGroups
  └── 覆盖常用控件（Numeric/Button/Text/BarGraph/Toggle）

Phase 3（2-4周）— 生产化
  ├── 支持所有控件类型
  ├── 自动布局算法
  ├── 位图生成（PNG）
  └── 完整项目一键生成

最终效果：
  "AI，生成一个12通道温控HMI，带PID整定和电流监控页面"
  → AI 输出完整的 VC4 工程文件
  → 导入 AS → 编译 → 部署运行

本项目可以直接作为模板库

APJX_FKJ 项目的 13 个 .page 文件和配套资源配置，本身就是最好的 VC4 模板和参考实现：

用途参考文件
页面 XML 格式任意 .page 文件
温度通道布局P30.page（2×6 网格）
按钮交互绑定P10.page（ToggleDatapoint 动作）
页面导航P00.page（ChangePage 动作）
数据点映射DataSource.dso（3525行完整映射）
多语言字符串Languages.vcr + TextGroup_1.txtgrp

九、附录：P80 实际验证案例

9.1 验证概要

在 AI 生成 VC4 HMI 的可行性分析完成后，我们在实际样机上完成了端到端验证：

项目内容
目标验证 AI 生成 .page 文件在实机上可正常运行
测试页面P80 — 12通道温度总览监控页
样机硬件B&R 4PPC70_101G_20B（Power Panel）
验证方式生成 .page → 注册到 Package.vcp → AS编译 → 下载 → 导航到 P80
验证结果✅ 页面正常显示，PV/SV 数据实时更新，数值可输入编辑

9.2 生成的文件

文件说明
Logical/Visu/Pages/P80.page894行 XML，12通道 PV/SV 显示 + 系统状态 + 返回按钮
Logical/Visu/Package.vcp添加了 <Source File="Pages\P80.page"/> 注册

9.3 使用的关键配置

从项目中提取的、确保页面工作的关键引用链：

┌─ Package.vcp ──────────────────────────────────────────────┐
│  DefaultLanguage = zh                                       │
│  DefaultPage = P00                                          │
│  PageChangeDatapoint = DataSource.gHmi.iChangePage          │
│  SourceFiles 包含 Pages\P80.page                            │
└─────────────────────────────────────────────────────────────┘
       │
       ▼
┌─ P80.page ─────────────────────────────────────────────────┐
│  Page Index = 80                                            │
│  复用字体: TempFont / Display / ChangePage (引用本工程已有)  │
│  复用文本: P30 的温度通道名称（TextIndex引用，不重复创建）    │
│  新建文本: 标题 "温度总览 (AI生成测试)"（ID=200000起）        │
│  数据绑定: Source[global].Variable[DataSource.gXXX.YYY]     │
│  导航动作: KeyAction → ChangePage → Target = P00            │
│  布局: 6列×2行, 标定区域 Left=15/170/325/480/635/790        │
└─────────────────────────────────────────────────────────────┘

9.4 验证过程记录的易错点

  1. 页面必须注册到 Package.vcp — 仅放在 Pages 目录不够，需在 <SourceFiles> 中添加引用
  2. Text 文本 ID 必须全局唯一 — 新页面使用 200000+ 避免与已有 ID 冲突
  3. 控件必须绑定时引用的数据点需在 DataSource.dso 中已定义 — 不可以引用不存在的变量
  4. MovementOrder / TabSequence 必须完整 — 否则焦点导航可能异常
  5. 上下分组的 Y 坐标需留出足够间距 — 防止触摸操作误触相邻区域

9.5 验证结论

AI 生成的 VC4 HMI 页面，不经手动修改，直接通过 Automation Studio 编译部署后，可在贝加莱 Power Panel 实机上正常运行。

这标志着 AI 生成贝加莱 HMI 的技术可行性已经从”理论分析”进入”实际验证通过”阶段。

← 返回博文列表