基本操作
创建项目
在项目引导页，可选择以下任意一种方式可以创建一个新项目：
- 创建一个空项目：
- 点击 项目 > 新建
- 选择 LVGL 版本，支持 V9.1 和 V8.3
- 在 模块 中选择 Empty UI
- 设置项目名称
- 设置项目路径
- 设置颜色深度
- 设置分辨率
- 点击 保存 按钮， 创建一个新项目
图 2. 新创建的空项目 - 在创建新项目过程中，可以在 模块 中选择已有的项目模板，通过模板来创建一个新项目。
图 3. 新创建的空项目
打开本地项目
- 点击 项目 > 打开
- 进入需要打开的项目目录，点击后缀为 aicpro 的工程文件
字体导入
- 点击 资源>字体
- 点击 添加 按钮，添加新的矢量字体
字体裁剪
字体裁剪工具是一个独立的矢量字体裁剪工具
- 点击标题栏中的 工具 > 字体裁剪
- 选择字体路径
- 设置输出字体名称
- 设置输出字体路径
- 准备好字符集 txt 文件，并导入字符集
- 导入的字符集会在右侧的 文字 框中显示
- 如果需要，可以进一步对 文字 框中的字符集进行修改
- 点击 转换 按钮，会在输出目录下生成需要的裁剪后的字体文件
图片转换
图片转换工具是一个独立的图片格式转换工具，可在导入图片前对图片进行格式转换。该工具提供了丰富的图像压缩参数选项，支持输出 png、jpg 和 aicp 三种格式。 其中，aicp 格式是 ArtInChip 自定义的图像格式。在 D12x/D13x/D21x 平台上，支持从 jpg 格式转换为 aicp 格式（不含透明度）；而在 D125/D126 平台上，同时支持从 jpg 和 png 格式转换为 aicp 格式，转换后的 aicp 格式中可包含透明度通道。
- 点击 资源>图片转换
- 点击 输出格式 下拉菜单，选择所需的输出格式
- 设置 压缩质量 在内的各项压缩参数
- 点击 尺寸 后的选择框，可调整转换后图像的尺寸
- 点击 添加 按钮，可添加单张图片或整个目录下的图片
- 点击 转换 按钮，系统将在输出目录下生成转换后的图片文件
输出格式参数设置
- JPG 格式参数设置
- 输入格式: 支持 png/jpg/bmp 三种格式
- 质量设置: 数值范围为 1（最高质量）~ 31（最低质量），数值越小质量越高，默认值为 2
- 像素格式: 可选 yuvj444p、yuvj422p、yuvj420p，默认设置为 yuvj444p
- PNG 格式参数设置
- 输入格式: 支持 png/jpg/bmp 三种格式
- 像素格式: 可选 rgb32/rgb24（rgb32 为 32 位 RGB+Alpha 通道，rgb24 为 24 位 RGB），默认不设置此参数
- 压缩等级: 可选范围 [0, 9]，0 为无压缩最快，9 为最大压缩（最慢，文件最小），默认设置为 9
- AICP 格式参数设置
- 输入格式: 支持 jpg/png 格式，若数据源包含 alpha 通道，则 aicp 也会保留 alpha 分量
- 质量参数: 可设置范围为 60（最低质量）~ 100（最高质量），数值越大质量越高
图片导入
- 点击 资源>图片
- 点击 添加 按钮，添加新的图片
- 点击 添加文件 按钮是添加单张图片
- 点击 添加目录 按钮是添加整个目录中的图片
视频导入
- 点击 资源>视频
- 点击 添加 按钮，添加新的视频
- 视频文件封装格式支持 mp4/avi
- 音频要求为 mp3/aac 编码
- D21 平台视频支持 H264/MJPEG 压缩， D12x/D13x 平台视频只支持 MJPEG 压缩
- 支持 APNG 动图
- 对以上格式的支持，建议采用 ArtInChip 的格式转换工具进行转换
添加控件
- 新建或者打开项目后，设计区域在工具的中心部分
- 可以通过拖动或点击控件到设计区域，来添加新控件
- 可以对控件进行属性和样式的设置
- 可以对控件添加事件处理
自动对齐
移动控件会显示当前控件和相邻控件对齐的参考线，并自动对齐，也可以用 → ← ↑ ↓ 4 个快捷键对位置进行微调：
预设样式
可以使用本来自带的预设样式也可以自定义预设样式
代码生成
- 点击 代码生成图标，在项目目录下会自动生成 UI 的代码
- 点击文件夹图标，进入项目目录，可以看到生成的代码目录 ui_builder
查看代码
- 点击 查看代码 图标，会弹出 代码查看器 窗口
- 生成的 UI 代码的入口函数为 ui_init()
项目导出
- 点击 项目导出 图标
- 选择导出目录后，会得到一个体积小很多的 项目压缩包
- 与原项目文件夹相比，去除了 simulator 文件夹，因为该文件夹体积较大且会在工程运行后自动生成
复制 UI 代码到 SDK 路径
- 点击 设置 图标，可通过 项目设置 页面或 工具设置 页面配置 SDK 路径
- 点击 代码复制 图标，选择覆盖旧代码
- ui_builder 文件夹将被直接复制到指定路径
- 工具设置 中的 SDK 路径会作用于所有项目，但 项目设置 也设置了 SDK 路径， 则 项目设置 中的 SDK 路径优先级高
模拟仿真
- 点击 运行 图标，或者按快捷键 F5，会进行编译，模拟运行
- 如果还没有生成代码，会先生成代码，然后再编译运行
组件功能
容器及其子控件可以保存为可复用的组件
- 组件可以像标准控件一样使用，简化实现过程
- 开发一次功能，可以多次部署使用
- 组件创建
使用示例:
- 鼠标右键点击 container_1
- 在弹出的菜单中点击 保存为组件， 会自动生成一个组件，并在组件列表中可以看到新保存的组件
图 27. 创建组件 - 组件使用
- 在组件列表中找到新创建的组件
- 拖动组件到设计区，来使用此组件
图 28. 使用组件
全局复制粘贴
UIBuilder 支持同时打开多个项目，使用全局复制粘贴，可以实现不同项目之前的复制和粘贴
- 鼠标右键点击要复制的页面或者控件
- 在弹出的菜单中点击 全局复制
- 在新项目的设计区域点击 全局粘贴，
常用快捷键
| 功能 | 快捷键 |
|---|---|
| 剪切 | Ctrl + X |
| 复制 | Ctrl + C |
| 粘贴 | Ctrl + V |
| 全局复制 | Ctrl + Shift + C |
| 全局粘贴 | Ctrl + Shift + V |
| 删除 | Del |
| 撤销 | Ctrl + Z |
| 重做 | Ctrl + Y |
| 重做 | Ctrl + Y |
| 控件 x 坐标+1 | → |
| 控件 x 坐标-1 | ← |
| 控件 y 坐标-1 | ↑ |
| 控件 y 坐标+1 | ↓ |
| 层叠关系上移 1 | Alt + ↑ |
| 层叠关系下移 1 | Alt + ↓ |
| 移到层叠关系顶部 | Ctrl + ↑ |
| 移到层叠关系底部 | Ctrl + ↓ |
层次关系调整快捷键使用示例
下面演示通过键盘的 Alt + ↑ 和 Alt + ↓ 调整控件的层次关系
- 首先在页面中添加了三个控件，其中 button_1 在最顶层，选中 button_1
图 30. 选中按键控件 - 在键盘上按下 Alt + ↓， button_1 会移到 container_8 控件下面，部分重叠区域会被
container_8 覆盖
图 31. 第一次按下向下键 - 再次在键盘上按下 Alt + ↓， button_1 会移到 barcode_1 控件下面，部分重叠区域会被
container_8 和 barcode_1 覆盖
图 32. 第二次按下向下键 - 也可以再次按下 Alt + ↑， 调整 button_1 到顶层
多语言功能
- 新建项目，在新建项目页面打开 多语言 开关以开启多语言功能
图 33. 打开多语言功能开关 - 打开项目后依次点击 资源 、 多语言 打开多语言设置
图 34. 打开多语言设置页面 
图 35. 多语言设置界面 - 增加变量
点击 新增变量 输入变量名保存即可通过双击单元格的方式修改不同语言下的变量
图 36. 多语言变量设置 - 如果打开 变量值同步 开关，该变量的各个语言的变量值将会相同，后续可在 修改 页面关闭或打开该选项
图 37. 变量值同步开关 - 增加语言
点击多语言设置中的语言设置窗口，点击右下角的新增语言选项，设置名称、字体存储方式等；黄色的语言是默认语言，默认语言指的是初始化的语言，可以通过 默认 选项进行默认语言的切换
图 38. 增加语言设置选项 - 在该窗口下设置的字体是指多语言功能设置为该种语言时，控件中的所有文本将以 该页面设置的字体显示
图 39. 选择字体 - 如果在控件中设置了字体，当 控件中设置的字体 与在 默认语言的字体
不同 时，文本将 以控件设置的字体显示
图 40. 控件字体设置 - 字体动态加载 默认选中，字体在用到的时候才会初始化；如果取消勾选，所有用到的字体会在一开始初始化
图 41. 字体动态加载 - 增加完成后切换回变量设置页面，可以看到新增语言变量值
图 42. 新增的语言变量值