使用空白仪表盘

空白仪表盘只提供画布，不会带入栖光的页面、控件、弹窗或素材。适合希望自行规划布局和风格的用户，建议按“页面 → 导航 → 控件 → 交互 → 验证”搭建。

1. 创建空白项目

1. 在左侧「仪表盘」区域点击「新建」。
2. 选择「空白仪表盘」。
3. 输入容易识别的仪表盘名称。
4. 按中控设备方向填写画布宽高；需要保持比例时锁定比例。
5. 点击「创建项目」。

空白项目默认画布为 2778 × 1940；宽度范围 320–7680，高度范围 240–4320。这是画布尺寸，不是浏览器窗口或 Home Assistant 分辨率。

2. 先建立页面结构

进入编辑器后先建立页面结构：

1. 在「页面」中新建「家庭总览」，再按需要创建房间或设备页面；
2. 在「侧边栏」添加页面导航、时间、天气和常用入口；
3. 逐个点击导航确认页面存在，再选中目标页面添加控件。

页面可随时重命名。侧边栏跨页面显示，主页面控件只属于当前页面。

3. 完成第一个房间

先完成一个房间，再复制扩展：

1. 添加背景图，或从素材与 3D 户型图导入户型图；
2. 添加一个标题按钮，写清当前房间名称；
3. 添加灯光、开关、传感器或空调控件；
4. 在右侧绑定实体，调整位置、尺寸、颜色、图标和文字；
5. 配置点按、双击、长按或打开弹窗；
6. 保存并在「仪表盘」模式验证。

如果使用 3D 户型图，可以按户型图自动导图生成图片和效果控件；也可以按导出后制作仪表盘手动叠加底图、户型图、灯光层和设备控件。两种方式都需要核对设备实体和动作，图片层本身只负责显示。

控件可从图层列表选择、排序或复制到其他页面。先完成一间房，再复制相似控件，返工更少。

4. 设计设备详情弹窗

1. 在「弹窗组合」中新建组合并添加所需模块；
2. 绑定实体，确认设备关联功能；
3. 设置 2、3 或 4 列布局，最多 3 行；
4. 回到页面，将设备按钮动作设为「打开弹窗」；
5. 在「仪表盘」模式打开验证。

把复杂控制放进弹窗，主页面保留常用操作。弹窗模块和页面控件分别保存。

5. 用素材和户型图完善视觉

完成基础控制后再处理视觉：

• 用户上传图片和 3D 导出文件在「我的图片」；
• 栖光内置图片在「栖光素材」；
• 多层户型图可将底图、户型图和灯组光效叠加为多个图片控件；
• 图层顺序决定遮挡关系；
• 图片无法删除时，先移除页面或户型图中的引用。

6. 适配分辨率并检查

换设备尺寸时，在仪表盘菜单进入「修改分辨率」。解锁比例只改变画布比例，内容不会自动拉伸。修改后检查：

• 背景是否铺满或变形；
• 控件是否越界、重叠或间距异常；
• 标题和状态文字是否换行；
• 弹窗是否仍在 3 行限制内；
• 横屏或竖屏设备的点击区域是否足够大。

7. 最终验证清单

完成前至少验证：

• 每个导航按钮都能到达正确页面；
• 常用灯光、开关、空调和窗帘能控制正确实体；
• 传感器、天气、折线图和摄像头显示真实状态；
• 点按、双击、长按和弹窗组合均按预期工作；
• 保存后刷新页面，内容仍然存在；
• 在实际 iPad、平板或触控屏打开中控页面后，文字、布局和操作仍可用。

编辑器的区域说明和快捷键见编辑器与基本操作，控件属性见认识控件及实体配置，复制和弹窗见弹窗组合、复制与批量操作。