如何使用图层、组合和对齐

在翻页宝编辑器左侧「图层」面板可查看、重排、显隐、锁定当前页所有元素;右键菜单或右栏「组合」区域可将多个元素合并成组;右栏「排列与对齐」区域支持 6 种对齐和 2 种间距分布,单选时以页面为基准对齐,多选时以选区为基准对齐。

在翻页宝编辑器中,图层面板、组合和对齐是三个相互配合的排版工具:图层面板管理元素的上下叠放关系与可见性,组合让多个元素作为一个整体移动和操作,对齐与分布帮助精准排列位置。

前置条件

  • 已打开一个作品进入编辑器(路径:/editor-v2/:id)。
  • 编辑器为 V2(当前默认版本)。

图层面板

打开图层面板

  1. 在编辑器左侧工具栏点击「图层」图标(层叠矩形图标)。
  2. 图层面板打开后,显示当前页面所有元素的列表,顶部的元素在列表最上方,底层元素在最下方。

图层列表会实时反映当前页的选中状态:已选中元素的行高亮显示。单击某行即可在画布上选中对应元素;按住 ShiftCtrl/Cmd 单击可多选。

翻页宝编辑器左侧图层面板,显示多个图层行及悬停时出现的显示/隐藏眼睛图标和锁定图标

调整图层顺序(拖拽)

  1. 将鼠标悬停在图层行上,左侧出现拖拽手柄(竖线网格图标)。
  2. 按住拖拽手柄,上下拖动到目标位置后松开。
  3. 元素的叠放顺序随即调整,画布同步刷新。

拖拽操作支持撤销(Ctrl/Cmd+Z)。

调整图层顺序(右键菜单)

在画布上右键单击某个元素,可在上下文菜单中选择:

菜单项 含义
上移一层 把当前元素在图层顺序中向上移动一步
下移一层 把当前元素在图层顺序中向下移动一步
置顶 直接移到所有元素的最上层
置底 直接移到所有元素的最底层

以上操作均支持撤销。

切换元素的显示和隐藏

  1. 在图层面板悬停到对应行,行右侧出现眼睛图标
  2. 点击眼睛图标切换「显示/隐藏」状态。
  3. 隐藏的元素在图层行中呈半透明,画布不可见,但隐藏不等于删除,作品发布后隐藏元素对读者不可见。

锁定和解锁元素

  1. 在图层面板悬停到对应行,行右侧出现锁图标
  2. 点击锁图标切换「锁定/解锁」状态。
  3. 已锁定的元素:
    • 在画布上无法被选中、移动或修改。
    • 在图层面板中仍可点击眼睛图标更改显示状态。
    • 锁定元素不参与对齐和分布操作
  4. 再次点击锁图标即可解锁。

给图层重命名

  1. 在图层面板上,双击目标行的名称区域。
  2. 名称进入编辑模式,输入新名称(最多 60 个字符)。
  3. Enter 确认,或按 Esc 取消。
  4. 自定义名称优先显示;未命名时系统自动显示元素类型和摘要(如「图片」「文本…」)。

锁定元素无法触发重命名。


组合

创建组合

选中 2 个或更多元素后,可通过以下任一方式创建组合:

  • 右键菜单 → 「创建组合
  • 快捷键 Ctrl+G(Windows)/ Cmd+G(macOS)
  • 多选状态下,右栏顶部点击「创建组合」按钮

创建后,多个元素合并为一个组合元素,可以一起移动、缩放和旋转。组合在图层面板中显示为单行,右栏「组合」区域显示包含的子元素数量。

取消组合

选中一个组合元素后,可通过以下任一方式取消:

  • 右键菜单 → 「取消组合
  • 快捷键 Ctrl+Shift+G(Windows)/ Cmd+Shift+G(macOS)
  • 右栏「组合」区域点击「取消组合」按钮

取消后,子元素恢复为独立元素,并全部保持选中状态。创建和取消组合均支持撤销。


对齐与分布

入口位置

  • 多选(2 个及以上元素):右栏自动切换为「排列与对齐」区域,显示完整的对齐、分布和「创建组合」按钮。
  • 单选(1 个元素):右栏「位置与尺寸」区域底部有紧凑的 8 个对齐图标按钮(6 个对齐 + 2 个分布)。

翻页宝编辑器右侧面板多选状态:显示「已选择 N 个元素」、创建组合按钮、6 种对齐按钮和 2 种分布按钮

对齐规则

选中数量 对齐基准
1 个元素 页面边框为基准
2 个及以上元素 所有选中元素的包围盒为基准

支持的 6 种对齐:

按钮 名称 效果
左对齐 所有元素左边缘对齐到选区/页面最左边
水平居中 所有元素水平方向居中到选区/页面中心
右对齐 所有元素右边缘对齐到选区/页面最右边
顶对齐 所有元素顶边对齐到选区/页面最上边
垂直居中 所有元素垂直方向居中到选区/页面中心
底对齐 所有元素底边对齐到选区/页面最下边

已锁定的元素会自动排除在对齐计算之外,不会被移动,也不影响选区边界计算。

间距分布

支持 2 种分布方式,至少需要 3 个可移动元素才能使用:

按钮 名称 效果
水平分布 最左和最右元素位置固定,中间元素水平间距等分
垂直分布 最上和最下元素位置固定,中间元素垂直间距等分

若可移动元素不足 3 个,分布按钮将显示禁用状态,悬停提示「至少需要 3 个可移动元素才能分布」。

操作步骤(对齐示例)

  1. 在画布上框选或按住 Shift 点击选中多个元素。
  2. 右栏自动显示「已选择 N 个元素」面板。
  3. 在「对齐」区域点击对应对齐按钮(如「水平居中」)。
  4. 所有可移动元素立即按选区中线对齐,操作可撤销。

常见问题

为什么对齐按钮点击没有效果? 检查是否所有选中元素都处于锁定状态。锁定元素不参与对齐,当所有选中元素均已锁定时,对齐不会有任何变化。

分布按钮为灰色不可点击? 分布需要 3 个及以上的可移动(未锁定)元素,当前可移动元素数量不足时按钮禁用。

取消组合后元素位置跑偏了? 取消组合时,子元素会按照它们在组合内的相对位置还原到页面坐标系,位置应与组合前一致。若发现偏移,可按 Ctrl/Cmd+Z 撤销,然后重新确认再操作。

图层面板的顺序与显示顺序是否一致? 图层面板中靠上的元素显示在画布的最顶层,靠下的显示在最底层,顺序与视觉上下遮挡关系完全对应。