创建AstroZero高级页面

创建高级页面

1. 参考登录AstroZero新版应用设计器中操作，登录应用设计器。
2. 在左侧导航栏中，选择“界面”。
3. （可选）单击高级页面后的，为高级页面添加目录。

   高级页面默认存放在根目录下，在创建高级页面前，您可以先创建高级页面存放的目录，也可以在高级页面创建后将其拖拽到指定目录。

4. 将鼠标放在已创建的高级页面目录上，单击，进入添加高级页面。

   如果未创建高级页面目录，请直接单击高级页面后的，进入添加高级页面。

5. 设置高级页面的基本信息，单击“添加”。
   图1 新建高级页面
   

   表1 高级页面参数说明

   参数	说明
   标签	输入高级页面的标签名，用于在页面显示，创建后可修改。 取值范围：1~100个字符。
   名称	输入高级页面的名称，名称是高级页面在系统中的唯一标识，创建后不可修改。命名要求如下： 长度范围为1~100个字符。 必须以英文字母开头，只能由英文字母、数字或单下划线组成，且不能以下划线结尾。
   视图	为了让同一页面能够更好的呈现于电脑端和移动端，低代码平台提供了高级页面的电脑端和移动端两种终端视图，用户可分别对高级页面的电脑端和移动端进行定制开发。开发完成后发布生成的高级页面为同一URL，当电脑端或移动端加载这一URL时，平台会自动检测用户所用的设备类型并加载相应视图页面。 默认为电脑端和手机端全部选中。 说明： 在应用中，首次创建高级页面时，才会显示“视图”参数。如果应用中已存在高级页面，则不会显示该参数。
   描述	根据实际需求，在输入框中输入高级页面的描述信息。 取值范围：1~255个字符。
   关键字	为了便于搜索高级页面，可以在此处自定义一些关键字。
   布局类型	在AstroZero中创建高级页面时，提供了两种布局模式的页面布局供您选择，请按需进行选择。 绝对布局：在绝对布局中，每个组件可在页面中任意位置进行拖拽放置，组件的宽高可自定义设置。绝对布局常用于大屏页面的开发。 流式布局：在流式布局中，拖拽到页面中的组件，将根据从上到下、从左到右的顺序依次排列，组件的高度将根据组件内容大小进行自适应，宽度可按百分比进行配置。流式布局常用于常规Web应用开发，例如电商网站、管理网站等。

6. 开发高级页面。

   下面以开发一个绝对布局的高级页面为例，向您如何使用AstroZero快速开发一个高级页面。

   图2 绝对布局类型高级页面组件布局示例
   

   如上图所示，示例页面中包含文本编辑、基本柱图和多区域折线图三个组件。

   1. 在高级页面右上方，单击，设置背景图片。
      图3 设置页面背景色示例
      
   2. 查找并拖入该页面中包含的组件，通过拖拽进行位置、大小调整。
      图4 拖拽所需的组件到画布中
      
   3. 设置文本编辑组件内容为“绝对布局类型高级页面”，字号为“大号”。
      图5 设置文本编辑组件内容
      
   4. 通过组件属性，精确设置组件大小。

      本例中，设置组件宽度为600px、高度为350px。

      图6 精确设置组件大小
      
   5. 复制组件。

      将上图左侧组件逐个复制，并将其拖拽到右侧，通过对齐提示线将其与左侧组件对齐。

      图7 复制组件
      
   6. 单击页面上方的，保存页面。
   7. 单击，预览高级页面，查看当前页面在运行态的效果。
      图8 预览高级页面