通过 FileUploader 的初始化，了解 SAP UI5 应用的 StaticArea 初始化逻辑

2022-07-30 15:36:42 阅读：165 来源： 互联网

标签：初始化 sap FileUploader core StaticArea library ui UI5 SAP

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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

通过 FileUploader 的初始化，了解 SAP UI5 应用的 StaticArea 初始化逻辑