八荒启自主研发产品

玄武屏使用手册

融万物于一屏 · 以交互动画为魂,重塑演示的边界

89 章 · 持续更新

89
章节
4
版本
v1.0
产品最新版
界面基础

6. 画布与多尺寸适配

更新于 2026-10-28

画布(Canvas)是玄武屏内容的载体。本节讲尺寸、坐标系、缩放、对齐这些底层规则。

尺寸预设

场景 尺寸 用途
16:9 标准 1280×720 默认横屏演示
16:9 高清 1920×1080 4K 投影 / 大屏
4:3 兼容 960×720 老投影仪 / PPT 兼容
9:16 竖屏 720×1280 短视频 / 手机演示
A4 讲义 794×1123 文档型导出
21:9 超宽 1920×823 影院屏 / 高端会议室
32:9 巨屏 1920×540 展厅 / 控制中心
自定义 任意 异形屏 / 特殊场景

切换尺寸:「视图 → 画布尺寸」。

坐标系:相对比例

玄武屏元素的位置 / 尺寸用 0–1 的相对值 存储:

{
  "x": 0.10,    // 距左边界 10% 画布宽
  "y": 0.20,    // 距上边界 20% 画布高
  "width": 0.30,
  "height": 0.15
}

好处:

  • 切换画布尺寸时元素自动按比例缩放,不需要手动重排
  • 跨设备播放时(PC / 手机 / 大屏)布局一致
  • 元素的"对齐"是数学上严格的(不会因为浮点误差错位)

视图缩放(不影响内容)

操作 功能
⌘ + 滚轮 缩放画布视图(25%–400%)
⌘ + 0 适应窗口(自动算最佳缩放)
⌘ + 1 100% 实际像素
Space + 拖动 平移画布

视图缩放只改变你看到的大小,不改变元素本身的位置数据。

标尺、网格、参考线

  • 标尺:「视图 → 标尺」打开,画布边缘显示像素刻度
  • 网格:「视图 → 网格」开启,按 8px / 16px / 32px 自定义
  • 智能参考线:拖动元素时自动出现红色对齐线(与其它元素的边 / 中心对齐)
  • 手动参考线:从标尺拖出,画布上固定参考线

元素对齐工具

选中 ≥ 2 个元素时,顶部工具条显示对齐按钮:

按钮 功能
左对齐 / 中对齐 / 右对齐 水平方向
顶对齐 / 中对齐 / 底对齐 垂直方向
水平等距分布 横向均分间距
垂直等距分布 纵向均分间距

也支持快捷键:选中后 ⌘ + Shift + L/C/R 等。

多尺寸适配工作流

如果你的演示要在多种尺寸下播放(比如同一份课件 PC + iPad + 大屏):

  1. 用相对坐标保证基础布局一致
  2. 在「视图 → 画布尺寸」预览不同尺寸
  3. 重要元素用"锁定纵横比"防止被拉变形
  4. 极端尺寸(32:9)建议另存为单独版本

自定义画布

如果预设都不合适:

视图 → 画布尺寸 → 自定义
  宽:[1440] px
  高:[ 900] px
  方向:横屏 / 竖屏

下一节讲面板系统。