成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

Fiori里花瓣的動(dòng)畫效果實(shí)現(xiàn)原理

zzir / 3067人閱讀

摘要：另一種是下圖的個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。的實(shí)現(xiàn)位置動(dòng)畫效果的渲染實(shí)現(xiàn)位置第行的方法從行的循環(huán)能看出在循環(huán)體內(nèi)創(chuàng)建了個(gè)實(shí)際上就是動(dòng)畫效果里的個(gè)花瓣。動(dòng)畫效果顯示之后，什么時(shí)候消失使用將的關(guān)閉動(dòng)作加入到執(zhí)行隊(duì)列里。

Fiori里的busy dialog有兩種表現(xiàn)形式，一種是下圖里的花朵形狀，由5個(gè)不斷旋轉(zhuǎn)的花瓣組成。另一種是下圖的3/4個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。

關(guān)于前者的效果，可以看我制作的這個(gè)視頻。這個(gè)視頻是手動(dòng)將下圖setTimeout的300毫秒延時(shí)改成30秒之后的效果，意思是30秒之后這個(gè)花瓣效果才消失。

1. 根據(jù)調(diào)試器里調(diào)用棧的觀察，每當(dāng)url發(fā)生變化時(shí),會(huì)觸發(fā)sap.ui.controller.doHashChange,該方法則會(huì)調(diào)用openLoadingScreen.這個(gè)方法里會(huì)創(chuàng)建BusyDialog的實(shí)例并調(diào)用open方法。Busy Dialog的實(shí)現(xiàn)位置: /sap/bc/ui5_ui5/ui2/ushell/resources/sap/m/BusyDialog.js

2. 動(dòng)畫效果的渲染實(shí)現(xiàn)位置: /sap/bc/ui5_ui5/ui2/ushell/resources/sap/ui/core/Popup.js.

第52行的renderFioriFlower方法:

從97行的循環(huán)能看出在循環(huán)體內(nèi)創(chuàng)建了5個(gè)div element,實(shí)際上就是UI Fiori動(dòng)畫效果里的5個(gè)花瓣。

3.Fiori動(dòng)畫效果顯示之后，什么時(shí)候消失？

使用setTimeout將LoadingDialog的關(guān)閉動(dòng)作加入到執(zhí)行隊(duì)列里。如果300毫秒之后(第188行的參數(shù))執(zhí)行隊(duì)列里沒有其他待執(zhí)行的事件，則關(guān)閉該Dialog。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/68568.html

相關(guān)文章

  • Fiori里花瓣的動(dòng)畫效果實(shí)現(xiàn)原理

    摘要：另一種是下圖的個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。的實(shí)現(xiàn)位置動(dòng)畫效果的渲染實(shí)現(xiàn)位置第行的方法從行的循環(huán)能看出在循環(huán)體內(nèi)創(chuàng)建了個(gè)實(shí)際上就是動(dòng)畫效果里的個(gè)花瓣。動(dòng)畫效果顯示之后，什么時(shí)候消失使用將的關(guān)閉動(dòng)作加入到執(zhí)行隊(duì)列里。 Fiori里的busy dialog有兩種表現(xiàn)形式，一種是下圖里的花朵形狀，由5個(gè)不斷旋轉(zhuǎn)的花瓣組成。另一種是下圖的3/4個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。 showImg(https://s...

    Steven 評(píng)論0 收藏0

  • Fiori里花瓣的動(dòng)畫效果實(shí)現(xiàn)原理

    摘要：另一種是下圖的個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。的實(shí)現(xiàn)位置動(dòng)畫效果的渲染實(shí)現(xiàn)位置第行的方法從行的循環(huán)能看出在循環(huán)體內(nèi)創(chuàng)建了個(gè)實(shí)際上就是動(dòng)畫效果里的個(gè)花瓣。動(dòng)畫效果顯示之后，什么時(shí)候消失使用將的關(guān)閉動(dòng)作加入到執(zhí)行隊(duì)列里。 Fiori里的busy dialog有兩種表現(xiàn)形式，一種是下圖里的花朵形狀，由5個(gè)不斷旋轉(zhuǎn)的花瓣組成。另一種是下圖的3/4個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。 showImg(https://s...

    Drinkey 評(píng)論0 收藏0

  • Fiori里花瓣的動(dòng)畫效果實(shí)現(xiàn)原理

    摘要：另一種是下圖的個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。的實(shí)現(xiàn)位置動(dòng)畫效果的渲染實(shí)現(xiàn)位置第行的方法從行的循環(huán)能看出在循環(huán)體內(nèi)創(chuàng)建了個(gè)實(shí)際上就是動(dòng)畫效果里的個(gè)花瓣。動(dòng)畫效果顯示之后，什么時(shí)候消失使用將的關(guān)閉動(dòng)作加入到執(zhí)行隊(duì)列里。 Fiori里的busy dialog有兩種表現(xiàn)形式，一種是下圖里的花朵形狀，由5個(gè)不斷旋轉(zhuǎn)的花瓣組成。另一種是下圖的3/4個(gè)圓環(huán)不斷旋轉(zhuǎn)的效果。 showImg(https://s...

    CoorChice 評(píng)論0 收藏0

  • H5實(shí)例教學(xué)--ThreeJs 實(shí)現(xiàn)粒子動(dòng)畫飄花效果

    摘要：我們還需要在粒子超出效果展示區(qū)域時(shí)，把粒子重新賦予一個(gè)初始位置這樣，飄花瓣的效果，就完成了代碼下載鏈接密碼 showImg(https://segmentfault.com/img/bVKwfR?w=329&h=565); 粒子動(dòng)畫在ThreeJs可以用幾種方式實(shí)現(xiàn)本次樣例使用Sprite類來構(gòu)建粒子 官方對(duì)Sprite類的解釋 Sprite A sprite is a plane t...

    Andrman 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<