Figma 同步

变量在两边都可以编辑——在 Figma 中,也可以在 variable Jar 中。一个 同步 按钮即可一次对齐两边的修改。

同步

在插件中按下 同步 按钮时:

  1. 当前的 Figma 变量会与母版进行比较。
  2. 仅在 Figma 中修改的 → 应用到母版。
  3. 仅在 variable Jar 中修改的(表格编辑、已批准的翻译等)→ 立即应用到 Figma。
  4. 两边都修改的(冲突) → 不会自动应用,留待你在网页应用中解决。

同步会连同值一起传递变量元数据——作用域和描述。在网页上创建的变量,在把它创建到 Figma 的那次同步之前,名称旁会显示橙色圆点(尚不在 Figma 中);那一次同步会同时清除圆点和 作用域 列中的 —。无需按两次同步。

同步完成后,Figma 底部的提示消息会汇总结果:

结果含义
没有修改两边已经完全一致
同步完成(附数量)这么多修改已在无冲突的情况下处理
发现冲突(附数量)这么多冲突正在网页应用中等待处理

插件顶部会显示已连接项目的名称和上次同步的时间。

已连接的插件面板 — 项目名称、上次同步时间和同步按钮
已连接的插件面板 — 项目名称、上次同步时间和同步按钮

解决冲突

当同一个变量在同步前于 Figma 和 variable Jar 中被改成了不同的内容时,就会产生冲突。同步会在该变量处停下而不做任何修改,因此在你做出选择之前,两边的值都不会丢失。你可以在 variable Jar 的母版表格中,按变量选择 Figma 的值或这一侧的值来解决。

母版表格上方会出现 冲突:N 横幅,表格随之只显示有冲突的行。按横幅中的 查看全部 可以看到其他行,按 仅看冲突 则再次缩小范围。

冲突单元格是一个两行按钮。上面一行是 VA(variable Jar 的值),下面一行是 Figma(Figma 的值),只有选中的那行会填充红色。点击另一行即可切换。初始选中的是 Figma 的值,并且可以按模式(列)分别选择。

冲突单元格 — 上面是 VA 行,下面是 Figma 行,只有选中的一行为红色
冲突单元格 — 上面是 VA 行,下面是 Figma 行,只有选中的一行为红色
表格上方的冲突横幅,以及用两行显示 VA 和 Figma 值的冲突单元格
表格上方的冲突横幅,以及用两行显示 VA 和 Figma 值的冲突单元格

除了值之外,还有五种冲突,都用同样的两行按钮逐行选择:

冲突在哪里选择初始选择
值模式列——按模式选择 VA / FigmaFigma
描述横幅显示 描述也有分歧 · N;在“描述”列中逐行选择Figma
作用域横幅显示 作用域也有分歧 · N;在“作用域”列中逐行选择Figma
名称两边改成了不同的名称——名称单元格在两行上显示两个名称(只显示不同的部分;悬停可看完整路径),选择要保留的一个Figma
在 Figma 中删除、在这边编辑名称单元格提供 在 VA 中保留 / 此处也删除在 VA 中保留
在这边删除、在 Figma 中编辑以灰色的幽灵行显示;名称单元格提供 保留 Figma / 在 Figma 中也删除保留 Figma
名称冲突、幽灵行和在 Figma 中删除的冲突同屏显示 — 只有选中的一行为红色
名称冲突、幽灵行和在 Figma 中删除的冲突同屏显示 — 只有选中的一行为红色

对于名称和删除冲突,悬停在名称单元格上会给出情况说明。例如名称冲突会显示 “两侧将此变量重命名为不同的名称。未做任何更改 — 请选择要保留的名称。“;幽灵行会显示 “已在 VA 中删除,但在 Figma 中被编辑。未做任何更改 — 请选择用 Figma 的值恢复,还是在 Figma 中也删除。” 删除冲突默认选择保留一侧,是因为如果默认删除,按一次 应用 就会抹掉那次编辑。

如果在解决之前任意一边再次编辑了仍处于冲突中的变量,冲突会继续保留。下一次同步不会覆盖另一边的编辑,单元格会显示两边的最新值。一旦两个值变得相同,冲突会自动消除。

在侧边面板(详细信息)中打开有冲突的行时,会以 Figma 预览 / VA 预览 标记预览在表格中选择的一侧(不同维度选择了不同的一侧时显示 冲突预览),并且在冲突解决之前无法在面板中编辑该变量——“点击“应用”后此值才会生效。”

按下 应用:

  • 保留 Figma 值的变量 → 母版采用 Figma 的值。
  • 保留 VA 值的变量 → 下一次同步会把该值应用到 Figma。
  • 此处也删除 → 该变量也会从母版中删除。保留 Figma → 以 Figma 的值恢复。在 Figma 中也删除 → 下一次同步会在 Figma 中删除它。

冲突未解决时,无法为该集合创建翻译表或发送修改。会出现 N 个未解决的 Figma 冲突 提示和 在母版中解决 按钮——在 提交更改 界面上显示为 “请先解决冲突,以免未确认的值被发送到翻译表。“(请参阅翻译工作流)。有未解决冲突的变量也无法移到其他集合。

重命名和移动会被保留

  • 重命名 — 在网页上重命名变量或分组路径并同步后,Figma 中的同一个变量只会被重命名。它不会被删除后重建,因此图层绑定保持不变。如果两边改成了不同的名称,会作为上面的名称冲突停下。如果新名称已被 Figma 中的另一个变量占用,重命名会暂停,名称单元格会显示 ! 标记(Figma 中已有其他变量使用此名称)——“重命名已暂停:VA 的新名称已被 Figma 中的另一个变量使用。若要保留 VA 名称,请先在 Figma 中重命名该变量并再次同步,或选择 Figma 一侧(旧名称)。”
  • 移至其他集合 — 通过右键 → 移至其他集合 移动的变量,名称旁会出现橙色圆点(等待在 Figma 中移动 — 下次同步时将在 Figma 中创建)。下一次同步时,插件会在新集合中重新创建它们,并重新连接使用它们的图层(插件会显示 正在重新连接图层… N/N)。圆点会在同一次同步中清除,无法重新连接的会在该行标出。如果 Figma 中的目标集合已有同名变量,该行会改为显示 Figma 待移动 标记,移动保持暂停(“Figma 中已存在同名变量,移动已暂停 — 请先在 Figma 中重命名该变量,然后再次同步”)。在 Figma 中重命名那个变量并再次同步即可继续。
  • 顺序 — 变量和分组的顺序从 Figma 读取,并在每次同步时刷新。在网页上插入的行,也会在下一次同步时移到从 Figma 读取的位置。集合按创建顺序排列,侧边栏 集合 标题上的 集合排序 菜单可以按项目选择 创建顺序 / 名称 (A→Z)。在 Figma 面板中重新排列的集合顺序无法被插件读取,因此不会导入。网页上没有拖动排序。

文件连接

要同步,首先需要把 Figma 文件连接到项目。

连接此文件界面 — 新建项目或连接到现有项目
连接此文件界面 — 新建项目或连接到现有项目
  • 创建连接 — 在未连接的文件中打开插件,会出现 连接此文件 界面。选择 新建项目(文件中的所有变量会自动上传)或 连接到现有项目。
  • 别人的文件 — 如果文件已连接到别人的项目,请从 申请以译者身份加入(免费)/ 申请以团队成员身份受邀 / 从我自己的项目开始 中选择。所有者和团队成员会在成员页面批准申请(请参阅团队与角色)。
已连接界面 — 申请以译者身份加入 / 申请以团队成员身份受邀 / 从我自己的项目开始
已连接界面 — 申请以译者身份加入 / 申请以团队成员身份受邀 / 从我自己的项目开始
  • 没有解除连接 — 插件没有断开连接的功能;只有当项目被永久删除时(从回收站中删除,或移入回收站 30 天后自动删除),连接才会移除。卸载并重新安装插件不会影响连接。
  • 回收站中的项目 — 如果已连接的项目被移入回收站,插件会显示回收站提示,而不是进行同步。工作区所有者可以在网页应用中恢复它;其他曾有访问权限的人会被提示联系所有者。连接会被保留,因此恢复后文件会像以前一样重新连接。项目在回收站期间,同一工作区的人无法把该文件连接到其他项目。
  • 复制文件 — 连接以 Figma 文件为单位,因此复制出的文件会作为一个新的、未连接的文件开始。请在那里重新从 连接此文件 开始。