> ## Documentation Index > Fetch the complete documentation index at: https://docs.xpertai.cn/llms.txt > Use this file to discover all available pages before exploring further. # 📐 页面布局 在故事仪表板工作空间中，当您创建了一个空的故事仪表板时，您有两种选择来开始设计您的仪表板布局： 1. 添加不同布局类型的画布页面： 在故事仪表板工作空间中，在向导中点击“新画布页面”或者在工具栏中点击“首选项” -> “新页面” -> “不同类型的页面”，您可以添加多个画布页面，并选择不同的布局类型来满足您的需求。布局类型定义了画布上组件的排列方式和大小。您可以根据您的数据和可视化需求选择合适的布局类型。以下是一些常见的布局类型： * 适应屏幕布局：画布上的组件会自动调整大小，以适应不同屏幕的大小和分辨率。 * 固定大小布局：画布上的组件会保持固定的大小，不会随着屏幕的大小和分辨率而改变。 * 固定高度布局：画布上的组件会保持固定的高度，但是宽度会随着屏幕的大小和分辨率而改变。 2. 添加故事模板快速创建仪表板： 故事仪表板工作空间还提供了预先设计好的故事模板，可以帮助您快速创建仪表板并开始工作。这些模板包含了常用的仪表板布局和示例图表，可以直接应用于您的空白故事仪表板，以快速生成初始结构。您可以根据模板中的示例进行修改和自定义，以适应您的数据和分析目标。使用故事模板可以节省您设计仪表板的时间，同时还提供了一些布局和可视化的灵感和指导。 详情参考 [故事模版](../template/) 故事仪表板新建画布页面 除了使用预定义的画布类型用户还可以自定义画布设置. 打开故事属性编辑界面, 并点击页面空白处唤出网格布局属性设置界面. 网格布局有以下属性: * 布局类型: * **Fixed**: 固定像素布局, 网格大小由**固定列宽**和**固定行高**决定 * **固定大小** 未设置: 网格初始列数由屏幕宽度计算出, 初始行数由**最小行数**决定; * **固定大小** 设置后: 网格初始个数由**最小列数**和**最小行数**决定, 可以通过拖动微件超出现有区域对网格进行扩展, 网格会居中显示; * **Fit to Screen**: 适配屏幕大小布局, 网格个数由**最小列数**和**最小行数**决定, 网格大小不固定(固定列宽和固定行高不起作用)而填充整个屏幕大小; * **Scroll Vertical**: 纵向滚动布局, 网格初始个数由**最小列数**和**最小行数**决定, 并通过改变网格小大适应填充屏幕宽度, 网格高度与宽度一致, 网格布局将在纵向上滚动. * **Scroll Horizontal**: 横向滚动布局, 与纵向滚动布局同理; * **Vertical Fixed**: 纵向固定小大布局, 纵向网格高度由**固定行高**决定, 并在**最小行数**决定的初始个数基础上超出屏幕高度时进行滚动. 横向则在**最小列数**决定的初始个数基础上改变网格宽度以填充屏幕宽度; * **Horizontal Fixed**: 横向固定大小布局, 与纵向固定小大布局同理; * 显示网格: 何时显示网格, 不显示, 总时显示, 拖动时显示; * 紧凑类型: 向哪个方向执行自动紧凑处理; * 边缘空白: 网格边缘空白大小, 包括网格之间间距; * 外边距: 是否保留网格最外层的外边距空白; * 多层: 允许微件之间位置重叠 ## 与设备结合使用 设备模拟器负责模拟整个故事所在设备的大小。根据不同设备大小结合不同的布局类型, 可以更好的适配不同设备的显示效果。 * **适应屏幕布局**: 结合固定大小的桌面设备屏幕，可以实现整体内容适应设备宽度或高度的效果。 * **固定大小布局**: 结合不使用模拟设备时，实现内容大小固定的场景。 * **固定高度布局**: 结合纵向移动端设备模拟器，实现宽度填充，高度滚动的效果。 * **固定宽度布局**: 结合横向移动端设备模拟器，实现高度填充，宽度滚动的效果。 详情参考 [设备](../devices/)