🛠️ 工具栏¶
工具栏位于工作台顶部,提供项目管理和常用功能的快速访问。
5.1 项目信息区¶
项目名称显示 - 显示当前打开的项目名称
返回首页 - 点击 "返回" 按钮或项目名称左侧的箭头 - 返回到项目管理首页 - 会提示保存未保存的更改
保存状态指示 - 绿色勾号:所有更改已保存 - 黄色圆点:有未保存的更改 - 保存中:正在保存,显示加载动画
5.2 编辑操作¶
撤销/重做
- 撤销:Ctrl + Z 或点击撤销按钮
- 撤销上一步操作
- 可以连续撤销多步
- 重做:Ctrl + Shift + Z 或 Ctrl + Y 或点击重做按钮
- 重做上一步撤销的操作
- 可以连续重做多步
支持的可撤销操作: - 添加/删除组件 - 修改属性 - 移动组件 - 调整大小 - 样式修改
5.3 视图控制¶
面板展开/收起 - 组件面板:点击切换组件库和组件树的显示 - 属性面板:点击切换属性面板的显示 - 收起面板可以获得更大的画布空间
视图选项 - 显示网格:切换画布网格显示 - 显示参考线:切换参考线显示 - 显示组件边界:在画布中显示所有组件的边界框
5.4 资源管理器¶
资源管理器用于管理项目中使用的所有资源文件。
图片资源¶
添加图片 1. 点击工具栏 "资源" 按钮 2. 切换到 "图片" 选项卡 3. 点击 "添加图片" 按钮 4. 选择图片文件(目前只支持 PNG)导入
删除图片 1. 在资源列表中选择图片 2. 点击 "删除" 按钮
字体资源¶
添加字体 1. 点击工具栏 "资源" 按钮 2. 切换到 "字体" 选项卡 3. 点击 "添加字体" 按钮 4. 选择字体文件(目前只支持 TTF)导入
字体管理 1. 在资源列表中选择字体 2. 点击 "删除" 按钮
5.5 预览及代码生成¶
代码预览¶
查看生成的代码:
1. 点击工具栏 「C语言」 或 「MicroPython」 按钮进行预览
2. 使用 代码编辑器 查看 beken_generated 目录下的生成文件
- 生成文件(如 page_*_init.c)为只读
- 仅 custom/ 目录与 custom_func.c/h 可在设计器内编辑
自定义代码的两种写法及重新生成保留规则,请参阅 自定义代码。

5.6 存档与历史入口¶
工具栏提供 "存档" 和 "历史(数量)" 两个按钮。
- 存档:点击后直接保存一个历史版本。
- 历史(数量):打开历史弹窗,查看、预览、恢复或删除历史版本。

详细说明请参阅 存档与历史 文档。
5.7 AI 设计¶
工具栏提供 「AI设计」 入口,可启动 Cursor 或 TRAE,通过自然语言辅助完成界面设计。
- 需先在电脑上安装 Cursor 或 TRAE
- 首次使用会自动安装 MCP 与 Skill 环境
- AI 修改画布后,可在画布底部 保存 或 撤销
详细说明请参阅 AI设计 文档。
工作台文档:← 返回工作台 | 画布 | 组件库 | 组件树 | 属性面板 | 事件系统 | 存档与历史 | AI设计 | 工具栏 | 快捷键