SAP UI5 里的 Busy Indicator 控件使用概述

Jerry Wang

发布于 2022-09-12 15:12:59

4040

发布于 2022-09-12 15:12:59

文章被收录于专栏：Jerry的SAP技术分享Jerry的SAP技术分享

这个 SAP UI5 控件的命名控件：sap.m.BusyIndicator

Busy Indicator 表示正在进行某些操作并且用户必须等待。它不会阻塞当前的 UI 屏幕，因此可以并行触发其他操作。

这个控件提示用户，当前应用的后台正在执行某种操作。

开发人员可以设置图标的大小、文本，还可以定义一个自定义图标来代替使用。

Busy Indicator 的使用场景：

用户需要能够取消操作。
只有部分应用程序或特定控件受到影响。

Busy Indicator 不太适应的场合：

某种操作不到一秒钟即可完成，此时不需要使用 Busy Indicator
需要阻止屏幕并阻止用户启动另一个活动。在这种情况下，请使用 Busy Dialog.
请勿更改鼠标光标的外形来提示用户当前正在执行某种操作，这不符合 SAP Fiori 使用规范
不要一次显示多个 Busy Dialog

看一个例子：

实现源代码：

<mvc:View
	xmlns:l="sap.ui.layout"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns="sap.m">
	<l:VerticalLayout class="sapUiContentPadding" width="100%">
		<BusyIndicator text="... something is happening" class="sapUiTinyMarginBottom" />
		<HBox justifyContent="Start" alignItems="Center">
			<BusyIndicator size="3em" />
		</HBox>
		<BusyIndicator size="1.6rem" class="sapUiMediumMarginBegin" />
	</l:VerticalLayout>
</mvc:View>

manifest.json 文件的内容：

{
	"sap.app": {
		"id": "sap.m.sample.BusyIndicator",
		"applicationVersion": {
			"version": "1.0.0"
		}
	},
	"sap.ui5": {
		"rootView": {
			"viewName": "sap.m.sample.BusyIndicator.V",
			"type": "XML",
			"async": true
		},
		"dependencies": {
			"libs": {
				"sap.ui.core": {},
				"sap.m": {},
				"sap.ui.layout": {}
			}
		},
		"config": {
			"sample": {
				"stretch": true,
				"files": [
					"V.view.xml",
					"manifest.json"
				]
			}
		}
	}
}

值得一提的构造函数参数

customIconDensityAware：如果设置为 false，src 图像将直接加载，而不尝试为高密度设备获取密度完美图像。默认情况下，此设置为 true，但随后会向服务器发送一个或多个请求，以尝试获取指定图像的密度完美版本。如果带宽是应用程序的关键，则将此值设置为 false.
customIconRotationSpeed: 定义给定图像的旋转速度。如果使用 .gif，则必须将速度设置为 0。单位为 ms。注意：当大于或等于 0 时，值被认为是有效的。如果提供了无效值，则速度默认为 0。

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

原始发表：2022-08-29，如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法