通过 FileUploader 的初始化,了解 SAP UI5 应用的 StaticArea 初始化逻辑
作者:互联网
SAP UI5 FileUploader 实现的依赖:
sap.ui.define([
'sap/ui/core/Control',
'./library',
'sap/ui/core/LabelEnablement',
'sap/ui/core/InvisibleText',
'sap/ui/core/library',
'sap/ui/Device',
'./FileUploaderRenderer',
'sap/ui/dom/containsOrEquals',
'sap/ui/events/KeyCodes',
'sap/base/Log',
'sap/base/security/encodeXML',
"sap/ui/thirdparty/jquery",
// jQuery Plugin "addAriaDescribedBy"
'sap/ui/dom/jquery/Aria'
], function(
Control,
library,
LabelEnablement,
InvisibleText,
coreLibrary,
Device,
FileUploaderRenderer,
containsOrEquals,
KeyCodes,
Log,
encodeXML,
jQuery
) {
可以看到还使用了 jQuery。
SAP UI5 框架自动生成一个 input 元素和一个包含了 browse... 的按钮。
并且实现了下列两个接口:
- sap.ui.core.IFormContent
- sap.ui.unified.IProcessableBlobs
sendXHR 的默认值为 false, 此时使用 form submit 提交上传数据。如果是 true,使用 XHR 请求提交。Form Submit 提交的数据,经 Jerry 测试,无法在 Chrome 开发者工具 network 里观察到上传的文件内容。
XMLTemplateProcessor.js 检测到 XML 视图里定义了 FileUploader 控件之后,对其进行实例化,并且调用 init 方法:
创建一个 TextField:
用于选择本地文件:
this.oFilePath = library.FileUploaderHelper.createTextField(this.getId() + "-fu_input").addEventDelegate({
onAfterRendering: function () {
if (that.getWidth()) {
that._resizeDomElements();
}
}
});
这个 TextField 的类型是 sap.m.Text
:
然后再创建 upload button:
this.oBrowse = library.FileUploaderHelper.createButton(this.getId() + "-fu_button");
接着把当前待创建的 FileUploader 实例,即 this 指向的控件实例,设置成 TextField 和 Button 实例的 parent:
this.oFilePath.setParent(this);
this.oBrowse.setParent(this);
这里演示了如何用代码检测 sap.m
库是否被使用,只需要检查 button 控件的元数据,即 getMetadata 方法返回的结果是不是 sap.m.Button
即可。
// check if sap.m library is used
this.bMobileLib = this.oBrowse.getMetadata().getName() == "sap.m.Button";
SAP UI5 的 applySettings 方法,会依次将 XML 视图里对控件指定的设置,一个一个进行设置:
上图这些属性,就是我在 XML 视图里定义的属性,如下图所示:
我们在 SAP UI5 源代码里经常能观察到这个方法调用:sap.ui.getCore().getStaticAreaRef()
:
这是 SAP UI5 应用最后渲染出来的 HTML 原生代码里的一个元素,id 为:sap-ui-static
通过常量 STATIC_UIAREA_ID 表示。这个 static area 用于隐藏形如 Popups, Shadow, Blocklayer 等元素。
这个 static area 的初始化采取 Lazy loading 的惰性加载方式:只有真正需要时才会执行初始化操作。
var oStaticArea = document.getElementById(STATIC_UIAREA_ID),
oConfig, oFirstFocusElement;
if (!oStaticArea) {
oStaticArea = document.createElement("div");
oFirstFocusElement = document.createElement("span");
oConfig = this.getConfiguration();
if (!this.bDomReady) {
throw new Error("DOM is not ready yet. Static UIArea cannot be created.");
}
标签:初始化,sap,FileUploader,core,StaticArea,library,ui,UI5,SAP 来源: https://www.cnblogs.com/sap-jerry/p/16535067.html