anyuianyui
anyui-LIVE
anyui
反馈问题
  • English
  • 中文
anyui-LIVE
anyui
反馈问题
  • English
  • 中文
  • 介绍

    • 介绍
  • 快速开始

    • 快速开始
  • 工作区

    • 工作区
  • 编辑器

    • 概览
    • 工具栏
    • 导航器
    • 检查器
    • 状态栏
    • 设置
    • 画布
    • 预览
    • 资源管理
    • 代码查看器
    • 历史
  • 智能体
  • 桌面版
  • 主题

    • 图片
    • 字体库
    • 布局
    • 符号
    • 全局样式
    • 动态 LVGL 版本
    • 动态显示尺寸变更
    • 重置屏幕尺寸
    • 代码生成
    • 移植
    • 模拟器
    • 国际化
  • 常见问题

符号是可复用的组件:在符号库中设计一次,即可在界面上放置多份关联副本。修改符号会同步更新所有副本,同时每个副本仍可保留少量自己的差异。

概述

术语说明
符号保存在符号库中的组件定义,在独立的画布上编辑。
实例放置在界面上的符号副本,会跟随符号定义的改动。

符号适合页眉、卡片、工具栏、按钮等在多个界面重复出现的元素:只需维护一份设计,生成的代码中也只有一个函数,各处外观保持一致。

创建符号

  1. 打开导航器中的符号选项卡(与层级选项卡相邻)。
  2. 点击符号库标题栏的新建按钮。编辑器会新建一个空符号,在画布上打开它,并切换到符号编辑模式。
  3. 像在界面上一样,向符号中添加组件。
  4. 点击符号工具栏中的确认按钮保存定义。

符号库中的操作会立即生效:

  • 重命名 - 点击行上的铅笔图标。
  • 排序 - 拖动行上移或下移。该顺序同时决定符号在组件面板中的排列顺序。
  • 删除 - 见删除符号。

只有符号内部的设计需要保存;重命名、排序和删除在操作时即生效。

编辑符号

在符号库中选中一个符号后,画布会显示它的定义,画布上方的工具栏显示编辑符号及符号名称。名称旁出现橙色小圆点时,表示存在未保存的更改。

按钮行为
撤销 / 重做在本次编辑会话中逐步回退或重做更改。
放弃(✕)放弃未保存的更改并退出编辑,会有确认提示。
保存(✓)保存定义,并更新所有实例。

只有存在未保存的更改时,放弃和保存按钮才可用。

注

符号编辑不会自动保存。当前定义存在未保存的更改时,切换到其他符号或返回层级选项卡会弹出放弃未保存的更改确认框,确认后恢复到最后保存的版本。符号库操作(重命名、排序、删除)会立即保存到项目中;放弃只影响当前符号的未保存编辑,不会撤销这些操作。

存在未保存的符号草稿时也无法导出:请先保存或点击**✕**放弃,再构建或导出项目。

创建实例

展开组件栏,组件栏中的符号分组列出了所有可放置的符号:

  • 点击图标,会向当前界面或其中的容器添加一个实例。
  • 将图标拖到画布上,可以自行决定落点。

放置的每一份副本都与符号保持关联。需要放置多份时,重复上述任一操作即可。

注

预览模式下组件栏不可操作;编辑某个符号时,会导致循环引用的符号不会出现在栏中。

使用实例

在画布上,实例作为一个整体处理:内部组件处于锁定状态,点击任意部分都会选中该实例;层级树中只显示该实例本身,不展开内部组件。若要修改其内容,请编辑符号本身。

每个实例可以单独设置的属性:

设置行为
位置由实例自身决定,不从符号定义继承。
显示名称只属于该实例,可自由编辑。
标识符只属于该实例,会用作生成的 C 变量名。
其他分组在检查器的编辑实例中显示,见下文。

选中实例时,检查器默认折叠这些分组,只显示确定属于该实例的项。检查器上方有两个操作:

  • 编辑符号 - 打开该符号定义的编辑器。
  • 更多操作(…) - 其中的编辑实例会展开其余组件属性。

将某一项改为不同的值后,该值就只属于此实例。这类本地值会一直保留,之后保存符号时也不会被覆盖。

实例存在本地值后,菜单中会出现重置:将符号定义重新应用到该实例,覆盖实例上的本地修改;位置、名称、标识符、子组件与关联关系保持不变。

保存已有实例的符号

保存定义会更新所有实例:

  • 实例上未改动过的值跟随新设计。
  • 实例上改动过的值保留你的取值。
  • 在实例上删除的属性会保持删除状态,之后修改符号也不会把它恢复。

希望某个实例重新跟随符号时,对该实例使用重置。

删除符号

删除符号只会移除符号库中的条目。只要还有实例在使用该符号,编辑器就会拒绝删除,并提示该符号仍在使用和涉及的组件数量。请先删除这些实例,再删除该符号。

生成的代码

每个符号都会在生成结果中成为一个可复用函数,实例直接复用该函数,而不重复设计内容:

  • 每个定义在 generated/symbols.c 和 generated/symbols.h 中生成 create_symbol_<标识符>(lv_obj_t * parent) 函数。
  • 未做任何改动的实例只生成一次调用及其位置。
  • 存在本地值的实例会生成调用、位置,以及它自己声明的差异。
  • 实例内部的子组件不会单独生成。

每个实例对应的函数都以 create_symbol_ 开头,便于查找;生成文件的组织方式见代码生成。

相关指南

  • 布局 - 在符号内部排列组件。
  • 图片 - 为符号内部组件指定图片资源。
  • 字体库 - 符号内容的排版。
  • 代码生成 - 符号如何变成生成函数。
  • 编辑器概览 - 在画布上设计界面。
  • 导航器 - 界面、层级与符号选项卡。
  • 预览 - 验证符号的外观与行为。
Prev
布局
Next
全局样式