配置画布、图层和面板


在画布配置中,你可以在画布中添加图层和组件,并配置每个组件中的数据。有关画布、图层和组件的关系,参见单页应用关键概念

single-page

步骤 1:添加画布


一个页面中可以添加多个画布。根据默认添加的图层数量,画布分为以下类型:

  • 单图层画布:创建该画布后,画布中默认包含 1 个图层。你仍然可以在画布中添加另一个图层。

  • 多图层画布:创建该画布后,默认添加 2 个图层。

single-page

步骤 2:配置画布


选择 画布配置,在右侧 画布配置 抽屉中,你可以配置画布的名称、背景色、填充方式等。

single-page

步骤 3:(可选)添加图层


创建画布时,已默认创建 1 个或 2 个图层。如有需要,可以为画布添加其它图层。一个画布中最多可添加 2 个图层。

single-page

步骤 4:配置图层和面板


选择 图层配置,在右侧弹窗中配置图层的布局和图层上的面板。

single-page


参考以下说明配置图层和面板的细节。


图层名称

设置该图层的自定义名称。


图层布局

在单图层画布中,仅有 1 个图层,默认采用铺满全屏布局。在多图层画布中,你可以定义每个图层的布局。点击 切换 可更换当前图层的布局,切换后,原有布局的内容不再保留。

single-app

面板比例

你可以通过设置高度和外边距调整面板比例。

备注

调整面板比例 下方的设置都仅针对单个面板进行。如需将某些设置应用到多个面板中,需要切换面板后在对应设置项进行调整。


隐藏该面板

选中某块面板(如顶部面板),勾选隐藏该面板,可将该面板从图层上移除。


面板嵌入内容

面板是图层中放置内容的一块完整区域,可以是铺满全屏的一整块面板,也可以是偏居一小块屏幕的左侧/右侧面板。你需要定义图层中每块面板的嵌入内容,当用户查看画布时,图层的每块面板可分别展示不同内容。

你可以选择以下 2 种内容:

  • 编辑器:面板默认为 DTV 编辑器,你可以在面板中添加组件,构建可视化页面。

  • 插入外部链接:在面板中插入其它 DTV 页面链接,将面板当作一块展示其它页面的弹窗。面板将展示嵌入的页面内容,在当前页面中无法编辑。

    single-page


启用圆角面板

可以根据设计需要,启用圆角面板。


面板背景色

可以自定义面板的背景色,使用主题颜色或其他任意颜色。


内边距

内边距是面板内部内容和边框的距离。

single-page


网格高度和网格数量

DTV采用网格系统,将面板分成大小相同的网格,以网格为最小单位计量面板的高度、宽度和位置。你可以自定义网格高度,也可以选择自适应,即由系统根据面板的宽度以及网格数量,自动计算网格高度。更多信息,参见 管理仪表盘页面

single-app


组件间隔

你可以设置组件间隔,从而调整相邻组件之间的距离。

single-page


刷新频率

可以在下拉列表中选择面板内数据的自动刷新频率,也可以选择不刷新。


请求合并

当面板内多个组件使用同一数据源,且组件内的数据一同更新时,开启 请求合并 将合并进行一次数据请求,提高数据请求的效率。默认开启。


加载优先级

点击设置面板内组件的加载顺序。当数据量太大或网络不佳时,组件将按照定义的优先级从高到低进行加载,优化页面响应效率。优先级相同的组件将同时加载。若不配置,所有组件将一同加载。


完成上述配置后,你可以开始添加并 配置组件