我们可以将开发好的标准页面导出为一个Widget,供高级页面使用。
场景描述
将一个关联“Account”对象的表单标准页面导出为一个Widget,供高级页面使用。
前提条件
已创建好关联“Account”对象的表单标准页面“AccountForm”。
图 1 “AccountForm”标准页面
操作步骤
在APP开发界面左侧页面列表中,单击该标准页面后的“...”按钮,选择“发布(Beta)”。
系统提示“发布成功”。在APP开发界面左侧列表单击,选择“高级页面 > 组件”,可在“租户”页签下看到该Widget,命名为“ui_标准页面名称”。
图 2 该Widget
加载需要依赖的库文件。
- 在APP开发界面左侧列表单击,选择“高级页面 > 库”。
- 单击“提交新库”。
输入新库基本信息,单击“上传”选择zip包RuntimeFramework.zip,单击“提交”。上传完成后,在租户库下可以看到该组件。
说明:
“全局”中为系统预置库,不可编辑和删除系统预置库。
在App视图左侧菜单栏下方选择“页面设置“。
选择“资源”页签,单击“新建资源”。
图 3 上传该Widget至本站点
在“新建资源”页面选择“资源库”,选择“RuntimeFramework”单击“新增”。
作用域表示如下。
- 全局:表示该Library可应用于该站点所有高级页面。
- View Level:该Library仅应用于web或者mobile视图中。
- Page Level:可应用于具体哪些高级页面。
在高级页面中使用该Widget。
- 进入APP开发目录,单击Page后面的“+”,选择“高级页面”。
输入基本信息,单击“添加”。其中“页面标题”支持国际化配置。
图 4 高级页面基本信息
表 1 新建Page页面参数说明
参数
|
说明
|
页面标题
|
页面的标题。
|
页面路径
|
此页面在站点中的URL,此处填写的URL将与站点的URL拼装成一个页面的完整URL。例如此处填写“Test”,待此页面开发完成发布后,此页面的完整URL是“https://onenet.besclouds.com/skavastream/studio/reader/dev/PageDev/Test”。
|
描述
|
关于此页面的描述信息。
|
关键字
|
页面关键字,用于在站点中查询页面时使用。
|
页面模板
|
可选择页面模板进行页面开发。
|
页面布局
|
页面Widget的布局类型。
页面绝对布局,系统预置一种三行三列的布局样式,其中行间距可以调整,列间距不可调整。选择绝对布局后,可将Widget拖入固定的某个位置。
响应式布局,响应式布局下的Widget位置会随着Widget本身大小和页面大小自动调整布局。
|
单击“自定义组件”图标,拖动Widget“ui_AccountForm”到页面配置区域。
图 5 选择Widget
拖动后,在高级页面编辑区域可看到该Widget。