SAP UI5 SimpleForm 控件实例的初始化调试

简介: SAP UI5 SimpleForm 控件实例的初始化调试

simpleForm 在 XML 视图里定义的 editable 属性:



image.png

会触发 SimpleForm.setEditable 方法调用:


image.png


image.png


同理,设置 layout 属性:


image.png

这个 layout 是一个单独的实例:

image.png


addAllToContent:把 SimpleForm 里所有的元素添加到控件里:


image.png

创建帮助文档里提到的 FormContainer:


image.png

然后创建 FormElement:


image.png


image.png

在 form 循环里添加 element:


image.png


image.png

一个 SimpleForm 有一个 form container:

image.png


一个 form container 有4个 form element:


image.png

一个 form element 有一对 label 和 field:



image.png

image.png

看样子是 Layout 实例控制这些数据:


image.png

创建 grid:


image.png


四种尺寸:


image.png

image.png


这里能看到硬编码的 12:


image.png


我代码里设置的 columns = 2:


image.png


所以 span 为 12 / 2 = 6


image.png


default span 的计算值:


image.png

默认值:


image.png

我们可以看出,一个简单的 SimpleForm,渲染之后,其实生成了总共五层结构:


image.png


ResponsiveGridLayout 控件使用响应式网格呈现表单。在内部,Grid 控件用于渲染。使用此布局,表单以响应式方式呈现。根据可用空间,FormContainer 呈现在一列或不同的列中,标签呈现在与字段相同的行或字段上方。此行为可能会受到此布局控件的属性的影响。


在 FormContainers、标签和内容字段上,可以使用 GridData 更改默认呈现。 FormElements 不支持 GridData。


注意:如果使用 GridData,这可能会导致比默认布局复杂得多的布局。这意味着在某些情况下,对其他内容的计算可能不会带来预期的结果。在这种情况下,应为所有内容控件使用 GridData 以禁用默认行为。


此控件不能单独使用,它只是呈现一个 Form,因此必须使用布局聚合将它分配给一个 Form。



相关文章
|
5月前
|
API
在阿里云RPA中,你可以使用"SetForegroundWindow"函数来将SAP控件置顶
【2月更文挑战第28天】 在阿里云RPA中,你可以使用"SetForegroundWindow"函数来将SAP控件置顶
82 1
|
5月前
|
前端开发 搜索推荐 开发者
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
SAP UI5 sap.m.Column 控件的 minScreenWidth 属性介绍
|
5月前
|
JavaScript 前端开发 开发者
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
SAP UI5 控件 sap.m.ListBase 的 inset 属性的作用介绍
|
5月前
|
Web App开发 数据采集 前端开发
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
|
5月前
|
XML 存储 数据格式
SAP UI5 控件 customData 属性的应用介绍
SAP UI5 控件 customData 属性的应用介绍
|
5月前
|
前端开发 JavaScript API
SAP UI5 sap.ui.require.toUrl 的作用介绍
SAP UI5 sap.ui.require.toUrl 的作用介绍
|
5月前
|
搜索推荐
如何让 SAP UI5 Smart Table 支持多项选择(Multiple-Selection)试读版
如何让 SAP UI5 Smart Table 支持多项选择(Multiple-Selection)试读版
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
使用 SAP UI5 Event Bus 机制,修复 SAP UI5 分页显示数据的一个 bug 试读版
|
5月前
|
存储 安全 测试技术
使用 Visual Studio Code 创建 SAP UI5 项目遇到 self-signed security certificate 相关问题
使用 Visual Studio Code 创建 SAP UI5 项目遇到 self-signed security certificate 相关问题
|
5月前
|
开发者 UED
SAP UI5 SmartFilterBar 中 ControlConfiguration Aggregation 的作用介绍
SAP UI5 SmartFilterBar 中 ControlConfiguration Aggregation 的作用介绍

热门文章

最新文章

下一篇
无影云桌面