Fiori應用全屏功能的實現

# Sent: Friday, June 12, 2015 2:57 PM

Subject: Full Screen Button on Chart Container

Chart上的全屏功能不是UI5提供的,那其實只是一個圖片,點擊之後都是自定義的代碼實現的:

Fiori應用全屏功能的實現 - fullscreen

ChartContainer.js初始化的時候,添加Full Screen Button,綁定自己press事件方法toggleFullScreen:

Fiori應用全屏功能的實現 - fullscreen

toggleFullScreen()方法裡面調用openFullScreen()和closeFullScreen()的操作:

Fiori應用全屏功能的實現 - fullscreen

openFullScreen():

Fiori應用全屏功能的實現 - fullscreen

closeFullScreen():

Fiori應用全屏功能的實現 - fullscreen

關於MasterDetail和FullScreen的切換,UI5的文檔把這種模式叫做Multi-Flow,但是我好像還沒找到UI5對這種情況的直接支持:

https://openui5.hana.ondemand.com/#docs/guide/f377376842914da7a6716192ecffc9d0.html

Fiori應用全屏功能的實現 - fullscreen

StackOverflow上也有人問UI5裡面的Multi Flow,上面有個例子也是自己寫代碼實現的:

http://stackoverflow.com/questions/26342435/how-to-implement-the-multi-flow-pattern

http://jsbin.com/fikocuxiloha/3/edit?html,output


分享到:


相關文章: