Files
cnc_wams/web-rtcp-5axis-xyzbc-trt-sim-plan/working/08-xyzbc-trt-界面与图标分析.md
2026-07-02 08:01:34 -04:00

20 KiB
Raw Blame History

08-xyzbc-trt 界面与图标分析

目标

本文面向后续 Web 数控系统界面开发,集中整理 xyzbc-trt 相关的界面组成、交互入口和图标资产。分析依据来自:

  • LinuxCNC configs/sim/axis/vismach/5axis/table-rotary-tilting/xyzbc-trt.ini
  • LinuxCNC xyzbc-trt.xml PyVCP 面板与 switchkins_postgui.hal
  • LinuxCNC xyzbc-trt-gui.py Vismach 三维机床模型
  • Web 项目 app/src/ui/gmoccapy-shell.js
  • Web 项目 app/src/profiles/xyzbc-trt.js
  • Web 图标清单 app/src/ui-reference/gmoccapy-button-icons.json
  • Web 图标注册表 app/src/ui/gmoccapy-icon-registry.js

xyzbc-trt 机床界面基线

内容
机床配置 sim-xyzbc-trt-kins (switchkins)
坐标/轴 XYZBC5 轴/5 joints
主界面来源 LinuxCNC AXIS
右侧扩展面板 PyVCP SWITCHKINS
三维机床 Vismach xyzbc-trt-gui
默认程序 demos/xyzbc_switchkins.ngc
工具表 xyzbc-trt.tbl
参数文件 xyzbc.var
运动学 xyzbc-trt-kins sparm=identityfirst
切换模式 M429 identity、M428 XYZBC TCP、M430 USERK

必须覆盖的界面

1. 主工作台 Shell

Web 首屏应直接是可操作 CNC 仿真界面,不做营销页。当前 gmoccapy-shell 已拆出以下区域:

区域 Web region 必备内容 关键状态
标题/会话栏 titlebar 项目名、profile 选择、会话名、来源、当前行、运行状态 machineProfilesessionNamesourceModemachine.mode
五轴预览 preview 3D/Canvas 机床、刀路、TCP、刀轴、当前程序、工具摘要、RTCP 状态 previewtoolPreviewtoolAxisVectorrtcpState
DRO 坐标 dro X/Y/Z/A/B/C、G54/Abs、DTG、TCP、tool-axis、RTCP 状态 drotoolAxisVector
G-code/MDI gcode 程序行、当前行、高亮、执行状态、LinuxCNC source 选择、staging、MDI 输入、MDI 历史 programLinesactiveLinemachineFileStagingmdiHistory
右侧状态栏 status-sidebar 急停、上电、复位、AUTO、MANUAL、JOG、MDI、IDENTITY、TCP task gate、mode、estop、power、switchkins
信息/诊断页 info-tabs Tool info、G-code properties、gmoccapy diagnostics、LinuxCNC parity、Task/HAL、HAL pins runtime readiness、source map、HAL/model 状态
Override override Rapid override、Feed override、ignore limits、optional block、optional stop feedgmoccapyGui
主轴/冷却 spindle-coolant Flood、Mist、主轴 FWD/STOP/REV、RPM、spindle override coolantspindle
底部控制栏 bottom-controls Open、Reload、Run、Stop、Pause/Resume、Step、Home、Tool、Touch、MDI、Full、Save/Restore、Audit command gates、session、program run

2. AXIS 等效页面

LinuxCNC 原生 xyzbc-trt 使用 AXIS因此 Web 需要覆盖这些 AXIS 语义:

原生 AXIS 区域 Web 等效模块 开发要点
菜单/工具栏 底部控制栏 + 文件/编辑/工具页入口 文件打开、重载、运行、暂停、停止、单步、从行运行、编辑
程序文本区 G-code panel 当前行高亮、执行进度、状态、解释器/canonical 来源
预览区 Preview panel 机床模型、完整预览路径、已执行路径、视角/缩放/清除
坐标显示 DRO panel XYZBC、DTG、G54/Abs、TCP、tool-axis
MDI MDI panel 输入框、执行按钮、历史/快捷命令、M428/M429/M430
状态栏 Sidebar + titlebar ESTOP、POWER、MODE、RUN、PAUSE、HOMED、INTERP/TASK
Override Override panel Feed/Rapid/Spindle override、可选段跳过、可选停止

3. PyVCP SWITCHKINS 面板

原生 xyzbc-trt.xml 提供一个必须在 Web 中等效实现的 PyVCP 面板:

控件 文本 HAL pin/net LinuxCNC 动作 Web 动作
kinstype-legends 0:IDENTITY / 1: XYZBC / 2: USERK kinstype.is-0/1/2 -> pyvcp.multilabel.0.legend* 显示当前 kinematics 类型 高亮当前 switchkins 类型
type0-button IDENTITY pyvcp.type0-button -> halui.mdi-command-00 M429 SET_KINS_TYPE identity
type1-button TCP:XYZBC pyvcp.type1-button -> halui.mdi-command-01 M428 SET_KINS_TYPE tcp-xyzbc
type2-button userk pyvcp.type2-button -> halui.mdi-command-02 M430 USERK 占位/受 gate 控制
vismach-clear vismach-clear pyvcp.vismach-clear -> vismach.plotclear 清除 Vismach 轨迹 CLEAR_PREVIEW

4. Vismach 等效三维机床界面

Web 五轴场景必须按 xyzbc-trt-gui.py 的 HAL 语义驱动,不应只画静态模型。

Vismach/HAL 信号 来源 目标 Web 展示
table-x joint.0.pos-fb xyzbc-trt-gui.table-x 工作台 X 平移
saddle-y joint.1.pos-fb xyzbc-trt-gui.saddle-y 鞍座 Y 平移
spindle-z joint.2.pos-fb xyzbc-trt-gui.spindle-z 主轴 Z 平移
tilt-b joint.3.pos-fb xyzbc-trt-gui.tilt-b B 倾斜轴
rotate-c joint.4.pos-fb xyzbc-trt-gui.rotate-c C 回转轴
tool-offset motion.tooloffset.z / xyzbc-trt-kins.tool-offset GUI + kins 刀长/刀具 TCP 偏置
x-offset xyzbc-trt-kins.x-offset GUI TRT 几何 X 偏置,默认 -20
z-offset xyzbc-trt-kins.z-offset GUI TRT 几何 Z 偏置,默认 -15

5. 文件/程序页面

页面/状态 必备能力 关联图标
程序加载 打开本地 .ngc/.nc/.tap/.gcode/.txt,选择 LinuxCNC staged source open_fileselect_file
文件浏览 上级目录、Home、Jump to、刷新、上一项/下一项、选择、返回 chevron_uphome_folderuser_defined_folderrefreshchevron_left/rightback_to_app
程序运行 Run、Stop、Pause、Step、Run from line、Reload、Optional block playstoppausepause_activesteprun_from_linerefreshskip_optional_*
编辑 编辑、保存、另存、新建、撤销、重做、注释、搜索、分屏预览 edit_codesavesave_asnew_documentedit_undoedit_redocommentsplit_view

6. 手动/JOG/回零/对刀页面

页面 必备控件 xyzbc-trt 注意点
回零 Ref all、Unref all、X/Y/Z/B/C 单轴回零、返回、分页 XYZBC 应使用 X/Y/Z/B/CA 图标是资产存在但本机型不应作为主轴显示
Touch off X/Y/Z/B/C touch off、返回、分页、可选 block height 同上,优先按当前 profile 轴生成
Jog 连续/增量、慢速/快速、Ignore limits、轴 jog、关节 jog 非平凡 kinematics 下 joint jog 需要单独 gate
MDI MDI 输入、历史命令、M428/M429/M430 快捷 M428/M429/M430 是 switchkins 核心入口

7. 刀具/偏置/设置/诊断页面

页面 必备能力 说明
Tool page 选择刀具、换刀、M61 Q 设置当前刀、X/Z tool touch off、ToolEdit 添加/删除/保存/刷新/计算器 xyzbc-trt.tbl 是数据源
Offset page 坐标偏置计算器、编辑 offsets、set selected、zero G92 文字按钮为主,少量计算器图标
Settings page 声音、字体、DRO/DTG/offset 显示、键盘行为、窗口模式、run from line、unlock、tool measurement 很多控件无图标,按表单控件实现
Diagnostics LinuxCNC parity、Task/HAL、INI、source map、HAL pins、gmoccapy comms、native/Web 对比 以只读诊断表格为主

Web 已注册核心图标

app/src/ui/gmoccapy-icon-registry.js 当前直接注册的核心按钮如下,开发首屏应优先使用这些 id

buttonId 语义 active 图标 inactive/default 图标
tbtn_estop 急停/急停复位 main_switch_on main_switch_off
tbtn_on 机器上电 power_on power_off
rbt_manual 手动模式 mode_manual_active mode_manual_inactive
rbt_mdi MDI 模式 mode_mdi_active mode_mdi_inactive
rbt_auto Auto 模式 mode_auto_active mode_auto_inactive
tbtn_setup 设置页 mode_settings_active mode_settings_inactive
tbtn_user_tabs 用户/Jog 页 mode_user_tabs_active mode_user_tabs_inactive
btn_load 打开程序 - open_file
btn_reload 重载 - refresh
btn_run 运行 - play
btn_stop 停止 - stop
tbtn_pause 暂停 pause_active pause
btn_step 单步 - step
btn_homing 回零菜单 - ref_all
btn_tool 刀具页 - hsk_mill_tool
btn_touch 对刀/坐标设定 - touch_off
ref_all 全部回零 - ref_all
btn_fullscreen 全屏预览 fullscreen_close fullscreen_open
rbt_forward 主轴正转 spindle_right_on spindle_right
rbt_reverse 主轴反转 spindle_left_on spindle_left
rbt_stop 主轴停止 spindle_stop_on spindle_stop
tbtn_flood Flood 冷却 coolant_flood_active coolant_flood_inactive
tbtn_mist Mist 冷却 coolant_mist_active coolant_mist_inactive
btn_zoom_in 放大 - zoom_in
btn_zoom_out 缩小 - zoom_out
rbt_view_x X 视角 - tool_axis_x
rbt_view_y Y 视角 - tool_axis_y
rbt_view_z Z 视角 - tool_axis_z
rbt_view_p 透视/Fit - tool_axis_p
tbtn_view_tool_path 刀路显示/清除 - toolpath
tbtn_view_dimension 尺寸显示 - dimensions
btn_exit 退出 - logout
btn_save_session 保存会话 - save

图标分类总览

原始 gmoccapy 图标清单包含 211 行记录,当前复制到项目资产中的图标文件为 112 个。按界面类别统计如下:

类别 行数 按钮数 主要按钮
右侧主状态栏 14 7 rbt_autorbt_manualrbt_mditbtn_estoptbtn_ontbtn_setuptbtn_user_tabs
底部主按钮栏 7 6 btn_exitbtn_homingbtn_toolbtn_touchtbtn_fullsize_preview0tbtn_switch_mode
Auto 程序运行栏 13 10 btn_editbtn_from_linebtn_loadbtn_reloadbtn_runbtn_stepbtn_stoptbtn_pause
MDI/宏按钮栏 11 9 calculatorkeyboardmacro_0..4next_buttonprevious_button
回零按钮栏 10 10 home_axis_x/y/z/a/bref_allunref_all、分页、返回
对刀/坐标设定按钮栏 9 9 touch_x/y/z/a/b、分页、返回、block_height
手动/Jog 面板 4 2 chk_ignore_limitstbtn_turtle_jog
Jog 增量选择栏 6 6 rbt_0..5
Jog 轴按钮 10 10 x+/x-y+/y-z+/z-a+/a-b+/b-
Jog 关节按钮 10 10 0+/0-4+/4-
冷却/主轴控制 11 5 rbt_forwardrbt_reverserbt_stoptbtn_floodtbtn_mist
预览/视图 10 10 缩放、视角、尺寸、刀路、清除
编辑器搜索/编辑 8 8 注释、撤销、重做、搜索、替换
编辑页底部栏 9 8 返回、计算器、键盘、新建、重载、保存、另存、分屏
刀具页底部栏 6 6 返回、换刀、设置当前刀、按编号选择、X/Z tool touch off
文件选择栏 9 9 返回、上级、home、jump、刷新、上一项、下一项、选择、排序
内嵌 ToolEdit 控件 5 5 添加、保存、计算器、删除、刷新
内嵌 OffsetPage 控件 4 4 计算器、编辑、设置选中、Zero G92
设置页控件 42 42 声音、字体、DRO、DTG、offset、键盘、窗口、unlock、tool measurement
Glade 静态按钮 13 13 HAL meter/scope/show、status、calibration、classicladder 等

已复制图标文件清单

图标根目录:

web-rtcp-5axis-xyzbc-trt-sim-plan/app/src/assets/gmoccapy-icons

状态/模式/电源

  • img_emergency__main_switch_on__48.png
  • img_emergency_off__main_switch_off__48.png
  • img_machine_on__power_on__48.png
  • img_machine_off__power_off__48.png
  • img_auto_on__mode_auto_active__48.png
  • img_auto__mode_auto_inactive__48.png
  • img_manual_on__mode_manual_active__48.png
  • img_manual__mode_manual_inactive__48.png
  • img_mdi_on__mode_mdi_active__48.png
  • img_mdi__mode_mdi_inactive__48.png
  • img_settings_on__mode_settings_active__48.png
  • img_settings__mode_settings_inactive__48.png
  • img_user_tabs_on__mode_user_tabs_active__48.png
  • img_user_tabs__mode_user_tabs_inactive__48.png

程序运行/编辑/文件

  • img_open__open_file__32.svg
  • img_reload1__refresh__32.png
  • img_run__play__32.png
  • img_stop__stop__32.png
  • img_pause__pause__32.png
  • img_pause_active__pause_active__32.png
  • img_step__step__32.png
  • img_run_from__run_from_line__48.png
  • img_skip_optional_active__skip_optional_active__32.png
  • img_skip_optional_inactive__skip_optional_inactive__32.png
  • img_editor__edit_code__32.png
  • img_edit-undo__edit_undo__32.png
  • img_edit-redo__edit_redo__32.png
  • img_edit_comment__comment__32.png
  • img_edit_menu_new__new_document__32.svg
  • img_edit_menu_reload__refresh__32.png
  • img_edit_menu_save__save__32.png
  • img_edit_menu_save_as__save_as__32.png
  • img_edit_menu_close__back_to_app__48.svg
  • img_edit_menu_calculator__calculator_open__32.png
  • img_edit_menu_keyboard__keyboard__32.png
  • img_edit_menu_keyboard_hide__keyboard_hide__32.png
  • img_split_view__split_view__32.png

预览/视角/刀路

  • img_zoom_in__zoom_in__24.png
  • img_zoom_out__zoom_out__24.png
  • img_view_x__tool_axis_x__24.png
  • img_view_y__tool_axis_y__24.png
  • img_view_y2__tool_axis_y_inv__24.png
  • img_view_z__tool_axis_z__24.png
  • img_view_p__tool_axis_p__24.png
  • img_tool_path__toolpath__24.png
  • img_dimensions__dimensions__24.png
  • img_tool_clear__clear__24.png
  • img_fullsize_preview0_open__fullscreen_open__48.png
  • img_fullsize_preview0_close__fullscreen_close__48.png
  • img_fullsize_preview1_open__fullscreen_open__48.png
  • img_fullsize_preview1_close__fullscreen_close__48.png

主轴/冷却

  • img_spindle_forward__spindle_right__48.png
  • img_spindle_forward_on__spindle_right_on__48.png
  • img_spindle_reverse__spindle_left__48.png
  • img_spindle_reverse_on__spindle_left_on__48.png
  • img_spindle_stop__spindle_stop__48.png
  • img_spindle_stop_on__spindle_stop_on__48.png
  • img_coolant_on__coolant_flood_active__48.png
  • img_coolant_off__coolant_flood_inactive__48.png
  • img_mist_on__coolant_mist_active__48.png
  • img_mist_off__coolant_mist_inactive__48.png

回零/对刀/Jog

  • img_ref_all__ref_all__48.png
  • img_ref_menu__ref_all__48.png
  • img_unref_all__unref_all__48.png
  • img_ref_x__ref_x__48.png
  • img_ref_y__ref_y__48.png
  • img_ref_z__ref_z__48.png
  • img_ref_a__ref_a__48.png
  • img_ref_b__ref_b__48.png
  • img_ref_menu_close__back_to_app__48.svg
  • img_ref_paginate_next__chevron_right__32.svg
  • img_ref_paginate_prev__chevron_left__32.svg
  • img_touch_off__touch_off__48.png
  • img_touch_x__touch_x__48.png
  • img_touch_y__touch_y__48.png
  • img_touch_z__touch_z__48.png
  • img_touch_a__touch_a__48.png
  • img_touch_b__touch_b__48.png
  • img_touch_menu_close__back_to_app__48.svg
  • img_touch_paginate_next__chevron_right__32.svg
  • img_touch_paginate_prev__chevron_left__32.svg
  • img_continuous__jog_continuous__24.png
  • img_turtle_jog__jog_speed_slow__32.png
  • img_rabbit_jog__jog_speed_fast__32.png

文件浏览/导航

  • img_back_file_load__back_to_app__48.svg
  • img_back_tool__back_to_app__48.svg
  • img_close__logout__48.png
  • img_dir_up__chevron_up__32.svg
  • img_home__home_folder__32.svg
  • img_jump_to__user_defined_folder__32.svg
  • img_refresh_dir__refresh__32.png
  • img_sel_next__chevron_right__32.svg
  • img_sel_prev__chevron_left__32.svg
  • img_select__select_file__32.png
  • img_up__chevron_up__24.svg
  • img_down__chevron_down__24.svg

刀具/ToolEdit/Offset

  • img_tools__hsk_mill_tool__48.png
  • img_toolchange__mill_tool_change__48.png
  • img_index_tool__mill_tool_set_num__48.svg
  • img_tool_by_no__mill_tool_change_num__48.svg
  • img_tool_add__add__32.png
  • img_tool_save__save__32.png
  • img_tool_calculator__calculator_open__32.png
  • img_tool_delete__delete__32.png
  • img_tool_reload__refresh__32.png
  • img_offset_calculator__calculator_open__32.png

MDI/宏/键盘

  • img_macro_menu_calculator__calculator_open__32.png
  • img_macro_menu_keyboard__keyboard__32.png
  • img_macro_menu_keyboard_hide__keyboard_hide__32.png
  • img_macro_menu_stop__stop__32.png
  • macro_0__macro_image.png
  • macro_4__macro_image.png

xyzbc-trt 专用界面规则

  1. 轴显示以 XYZBC 为准。A 轴相关图标可保留为通用资产,但 xyzbc-trt 主界面、回零、Touch Off、DRO、Jog 应显示 X/Y/Z/B/C。
  2. TCP:XYZBC 是核心按钮,不应写成 TCP:XYZAC。对应 MDI 命令为 M428
  3. IDENTITY 对应 M429,在 identityfirst 配置中 switchkins type 0 是 identity。
  4. USERK 对应 M430,若 Web runtime 暂未实现完整 USERK应保留按钮但通过 gate/提示标明状态。
  5. vismach-clear 必须清除 Web 机床/刀路预览,不应只清除文本状态。
  6. B/C 角轴限制、joint 限制和 TCP/toolAxis 计算必须来自 profile/INI/kinematics runtime不应从 UI 字符串推断。
  7. 诊断页面要明确区分“图标/界面参考已具备”和“WASM artifact/runtime 已具备”,避免把 UI 对标误判为运动语义完成。

开发组件拆分建议

组件 输入状态 输出动作
MachineTitlebar profile、session、source、mode、activeLine select-profile
FiveAxisPreview path samples、joint pose、tcp、toolAxis、toolPreview、selectedView view/zoom/fit/clear/fullscreen
DroPanel XYZBC DRO、DTG、TCP、toolAxis、offset mode 切换 DRO 显示模式
ProgramPanel program lines、activeLine、execution feedback、source list open/reload/stage/select source/run MDI
StatusSidebar task policy、estop、power、mode、switchkins estop/power/reset/mode/kintype
PyvcpSwitchkinsPanel kinstype active、panel schema M429/M428/M430/clear
OverridePanel feed/rapid/spindle override、optional block/stop override step/reset/toggle
SpindleCoolantPanel spindle、coolant、gates FWD/STOP/REV/flood/mist
HomingPanel axes、homed state home axis/ref all/unref all
TouchOffPanel axes、offset context touch axis/block height
JogPanel jog axis/joint mode、increment、limits jog press/release、increment、ignore limits
ToolPage tool table、selected tool、tool offsets select/change/index/save/edit
FilePage OPFS/project files、current dir、selected file navigate/select/open
SettingsPage gmoccapy settings form updates
DiagnosticsPage INI、HAL、Task/HAL、WASM、parity、evidence audit/refresh

最小首屏 icon 集合

如果先实现可运行首屏,必须先接入这些图标:

  • 急停/上电:tbtn_estoptbtn_on
  • 模式:rbt_manualrbt_mdirbt_auto
  • 程序:btn_loadbtn_reloadbtn_runbtn_stoptbtn_pausebtn_step
  • SwitchkinsIDENTITYTCP:XYZBCUSERK 可先用文字按钮,但状态要接 HAL/MDI 语义
  • 预览:rbt_view_xrbt_view_yrbt_view_zrbt_view_pbtn_zoom_inbtn_zoom_outtbtn_view_tool_path
  • 主轴/冷却:rbt_forwardrbt_stoprbt_reversetbtn_floodtbtn_mist
  • 回零/刀具/对刀:btn_homingbtn_toolbtn_touch
  • 会话/退出:btn_save_sessionbtn_exit