Skip to content

编辑器概览

大屏编辑器是核心工作区,采用 左栏 · 中画布 · 右栏 三栏布局。从 我的大屏编辑 进入(新标签页)。

编辑器全貌
工具栏、左栏 Tab、画布、右侧属性面板

界面分区

┌─────────────────────────────────────────────────────────────┐
│ 工具栏:页面 | 缩放 | 撤销重做 | 保存 | 配色 | 预览 | 发布 | 更多 │
├──────────┬──────────────────────────────┬───────────────────┤
│ 左栏 Tab │         画布 + 对齐栏          │  右栏 Tab         │
│ 组件/预设 │                              │  属性/大屏/数据源  │
│ 素材/图层 │                              │                   │
└──────────┴──────────────────────────────┴───────────────────┘
区域作用
工具栏页面、缩放、保存、配色、预览、发布、在线头像、主题
左栏组件、预设、公共素材、图层(Tab 切换,见下节)
画布放置、选中、拖拽、缩放组件
对齐栏多选时出现,8 种对齐与分布
右栏组件属性、大屏设置、数据源管理

左右侧栏边缘可 折叠,宽度会记住(localStorage)。


左栏四个 Tab

Tab说明
组件分类组件库;顶部 收藏最近使用 快捷区
预设你保存的组件预设,拖拽到画布复用
素材公共图片素材(需浏览素材库权限)
图层组件树、层级、锁定,与画布选中同步

无素材权限时 素材 Tab 不显示;无编辑权限时 预设 Tab 不显示。


多页面

一个大屏可含多个页面(类似多页幻灯):

  • 工具栏 页面下拉 切换当前页
  • 新增 / 重命名 / 删除 页面,设 首页
  • 每页可有独立画布宽高与背景;也可继承大屏默认设置

预览与发布时按 首页 或交互配置切换页面。


基本操作

选中与移动

  • 单击 选中;框选Ctrl + 点击 多选
  • 拖拽移动;拖拽控点改大小
  • 方向键 微移 1px,Shift + 方向键 移动 10px

复制与删除

  • Ctrl + C / Ctrl + V 复制组件(焦点在输入框内时为文本复制)
  • Delete 删除选中(有确认框)
  • 右键菜单:复制、锁定、层级、复制样式 / 粘贴样式、删除等

画布辅助

  • 网格 Ctrl + G:显示/隐藏网格
  • 吸附:开启后组件靠近时自动对齐(10px)
  • 锁定 Ctrl + L:锁定/解锁选中组件

缩放

  • 工具栏 − / + 或点击百分比输入数值(约 15%~500%
  • 适应画布Ctrl + Shift + F:整页纳入视口

保存

  • Ctrl + S 或工具栏 保存
  • 保存成功会更新 封面缩略图(列表卡片展示)
  • 预览 前会自动尝试保存(Ctrl + P

保存冲突

多人编辑同一大屏时,若他人已先保存,你可能看到 保存冲突 弹窗:

选项说明
加载最新版本放弃当前未保存修改,拉取服务器最新内容
将本地另存为副本复制为新大屏并在新标签打开,保留你的修改
取消关闭弹窗,继续本地编辑(再次保存仍可能冲突)

建议协作时分工到不同页面或组件,并频繁保存。


在线协作者

工具栏右侧显示 在线成员头像(多人同时打开编辑器时):

  • 基于心跳感知,非实时同屏改字
  • 他人选中的组件,你的属性区可能出现 占用提示

单个大屏同时在线编辑人数有上限(约 10 人),超出可能提示「在线人数已满」。


工具栏常用功能

功能位置说明
保存工具栏持久化到服务器
配色工具栏28 套预设换肤,见 配色与示例数据
预览工具栏登录态预览,Ctrl + P
发布工具栏公开链接,见 预览与发布
更多下拉导入/导出、版本历史、导出图片、数据源、全屏

更多 菜单中各项受权限控制,无权限则不显示。


右栏:大屏设置

未选中组件时,或切换到 大屏设置 Tab:

配置项说明
标题大屏名称展示
画布尺寸预设分辨率或自定义宽高
背景背景色、背景图
页面切换none / fade / slide 等
图表加载动画全局图表入场动画
预览弹窗事件触发的弹窗样式

右栏:属性面板(选中组件时)

  • 顶部 搜索:按名称定位属性项
  • 常用 钉选条:把常改项钉在顶部
  • 分段:内容 / 样式 / 数据 / 行为 / 高级(因组件类型而异)
  • 底部:锁定 / 复制 / 删除

详见 组件与画布


下一步

巧曦大屏搭建平台 · 联系我们