sap.m.BusyDialog 用于批示零碎正忙。当显示 Busy 对话框时,整个应用程序被会阻止,无奈进行任何新的操作。
Busy Dialog 蕴含下列几个组成部分,其中大部分是可选的。
- title - 对话框的题目。 默认状况下,没有题目。
- text - 显示在Busy Dialog 上方的文本。
- showCancelButton - 一个可选的勾销按钮,用于进行执行。
- customIcon - 用作繁忙动画的可选代替图标。
Busy Dialog 的应用场合
- 操作继续超过一秒。
- 心愿在页面到页面导航(轻量级版本)中批示页面的加载过程。
- 如果遇见到后盾过程的运行可能会超过 10 秒,请提供勾销按钮。
- 如果不显示题目或文本,请应用不可见文本控件(Invisible Control)为用户提供提醒,让用户晓得以后是由后盾过程在执行。
不应该应用 Busy Dialog 的场合
- 屏幕不应该被阻塞。 这种状况下,对特定的应用程序局部,应该应用 sap.m.BusyIndicator。
- 不要应用 Busy Dialog 的题目属性。 以文本模式提供形容操作的准确文本。
看个具体的例子:
弹出 Busy Dialog 的按钮:
<mvc:View controllerName="sap.m.sample.BusyDialog.C" xmlns="sap.m" xmlns:l="sap.ui.layout" xmlns:mvc="sap.ui.core.mvc"> <l:VerticalLayout class="sapUiContentPadding" width="100%"> <Button text="Show Busy Dialog" press="onOpenDialog" class="sapUiSmallMarginBottom" ariaHasPopup="Dialog" /> </l:VerticalLayout></mvc:View>
Busy Dialog 的 fragment:
<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core"> <BusyDialog title="Loading Data" text="... now loading the data from a far away server" showCancelButton="true" close="onDialogClosed" /></core:FragmentDefinition>
控制器代码:
sap.ui.define([ "sap/ui/core/mvc/Controller", "sap/ui/core/Fragment", "sap/ui/core/syncStyleClass", "sap/m/MessageToast"], function (Controller, Fragment, syncStyleClass, MessageToast) { "use strict"; var iTimeoutId; return Controller.extend("sap.m.sample.BusyDialog.C", { onOpenDialog: function () { // load BusyDialog fragment asynchronously if (!this._pBusyDialog) { this._pBusyDialog = Fragment.load({ name: "sap.m.sample.BusyDialog.BusyDialog", controller: this }).then(function (oBusyDialog) { this.getView().addDependent(oBusyDialog); syncStyleClass("sapUiSizeCompact", this.getView(), oBusyDialog); return oBusyDialog; }.bind(this)); } this._pBusyDialog.then(function(oBusyDialog) { oBusyDialog.open(); this.simulateServerRequest(); }.bind(this)); }, simulateServerRequest: function () { // simulate a longer running operation iTimeoutId = setTimeout(function() { this._pBusyDialog.then(function(oBusyDialog) { oBusyDialog.close(); }); }.bind(this), 3000); }, onDialogClosed: function (oEvent) { clearTimeout(iTimeoutId); if (oEvent.getParameter("cancelPressed")) { MessageToast.show("The operation has been cancelled"); } else { MessageToast.show("The operation has been completed"); } } });});