华为云首页用户手册

Astro轻应用 AstroZero-高级页面布局:绝对布局高级页面

Astro轻应用 AstroZero-高级页面布局:绝对布局高级页面

时间：2023-11-01 16:25:38

Astro轻应用 AstroZero

绝对布局高级页面

创建绝对布局类型的高级页面。
1. 参考如何登录经典应用设计器中操作，登录经典版应用设计器。
2. 在模块树中，将鼠标放在某个文件夹上，单击加号，选择“高级页面”。
3. 设置高级页面标签和名称，布局类型选择“绝对布局”，单击“添加”。
  图1 新建绝对布局类型高级页面
开发绝对布局类型的高级页面。

以开发如下所示高级页面为例，向您介绍绝对布局类型高级页面中组件的布局方法。
图2 绝对布局类型高级页面组件布局示例

如上图所示，示例页面中包含文本编辑、基本柱图和多区域折线图三个组件。
1. 在高级页面右上方，单击，设置背景图片。
  图3 设置页面背景色示例
2. 查找并拖入该页面中包含的组件，通过拖拽进行初步位置、大小调整。
  图4 拖拽所需的组件到画布中
3. 设置文本编辑组件内容为“绝对布局类型高级页面”，字号为“大号”。
  图5 设置文本编辑组件内容
4. 通过组件属性，精确设置组件大小。
  本例中，设置组件宽度为600px、高度为350px。
  
  图6 精确设置组件大小
5. 复制组件。
  将上图左侧组件逐个复制，并将其拖拽到右侧，通过对齐提示线将其与左侧组件对齐。
  
  图7 复制组件
6. 单击页面上方的，保存页面。
7. 单击，预览高级页面，查看当前页面在运行态的效果。
  图8 预览高级页面

上一篇：Astro轻应用 AstroZero-高级页面布局:流式布局高级页面

下一篇：Astro轻应用 AstroZero-高级页面布局:流式布局高级页面

Astro轻应用 AstroZero-高级页面布局:绝对布局高级页面

意见反馈

0/200

提交成功！非常感谢您的反馈，我们会继续努力做到更好反馈提交失败！请稍后重试！

推荐文章

解决方案
相关专题