Fiori中的忙碌对话框有两种表现形式,一种是下图中的花形,由5个不断旋转的花瓣组成。另一种是下图中3/4环连续旋转的效果。对于前者的效果,大家可以看看我制作的这个视频。这个视频是将下图setTimeout的300毫秒延时手动改成30秒的效果,也就是说30秒后花瓣效果会消失。1、根据调试器中调用栈的观察,每当url发生变化时,都会触发sap.ui.controller.doHashChange,这个方法会调用openLoadingScreen。在此方法中,将创建BusyDialog的实例并调用open方法。BusyDialog的实现位置:/sap/bc/ui5_ui5/ui2/ushell/resources/sap/m/BusyDialog.js2。动画效果的渲染实现位置:/sap/bc/ui5_ui5/ui2/ushell/resources/sap/ui/core/Popup.js。第52行的renderFioriFlower方法:从第97行的循环可以看出,在循环体中创建了5个div元素,在UIFiori动画效果中其实就是5个花瓣。3、Fiori动画效果显示后,什么时候消失?使用setTimeout将LoadingDialog的关闭动作添加到执行队列中。如果300毫秒后执行队列中没有其他未决事件(第188行的参数),则关闭对话框。
