三大方法實現Flex全屏
在學習Flex的過程中,你可能會遇到Flex全屏方面的問題,這里和大家分享一下Flex全屏的方法,相信本文介紹一定會讓你有所收獲。
Flex全屏方法介紹
最近在做工作流的流程設計工具相關的內容,web應用使用了比較標準的分布方式,即上、左、右的布局方式,這樣做的結果就是設計工具的設計界面相對較小,當遇到比較復雜的流程時就感覺設計的流程比較緊湊,設計工具的易用性不夠好。為了解決這個問題,需要支持Flex全屏模式。
想了下,可以通過以下方式實現Flex全屏:
◆使用Flex的FullScreen模式,具體實現方式為:
1.修改html-template文件夾下的index.template.html文件,在AC_FL_RunContent中增加:"allowFullScreen","true";在embed中增加:allowFullScreen="true"。
2.通過設置stage.displayState的值為StageDisplayState.FULL_SCREEN來切換到全屏模式。
缺點:
使用這種方式雖然能夠將Flex切換到全屏模式,但是Flex中的InputText等控件是無法編輯的,而且在Flex的中央會出現"PressEscToExistFullScreen"。因而這種方式無法滿足設計需求。
當然,中央出現的字幕還是有辦法去掉的,雖然去掉之后并不能改變結果。去掉中央的"PressEscToExistFullScreen"字幕的方法請見:
http://stackoverflow.com/questions/1415436/flex-fullscreen-translate-edit-press-esc-to-exit-fullscreen-mode
該文章講解了去掉IE,Firefox中Flex全屏后字幕的方法。
◆通過showModalDialog來模擬Flex的全屏模式,showModalDialog中去掉工具欄、菜單欄、地址欄,同時將寬度和高度設置成屏幕的寬度和高度。但是這種方式實現起來比較復雜,因為涉及到數據同步的問題,同步的方式根據項目的復雜程度和需求要求不同而不同。比較簡單的方式是在關閉showModalDialog時將數據同步主頁面。因為這種方式實現復雜,容易出錯,所以沒有進行實現,有興趣的朋友可以自己試試。
◆模擬IE的F11的全屏模式。當用戶選擇全屏模式的時候,模擬IE的F11PressDown事件,隱藏掉IE的地址欄、菜單欄、工具欄等,同時將上部和左部的Frame隱藏掉,讓右邊的Frame全屏顯示,達到預期的效果。
IE的F11PressDown事件模擬方式實現如下:
- varshell=newActiveXObject('WScript.Shell')
- shell.SendKeys('{F11}');
Frame的隱藏方法當然有很多,就不詳細介紹了。
缺點:
這種方式需要用戶修改IE的安全選項,具體方法為:
- Tools>Internetoptions>Security>CustomLevel
- ActiveXcontrolsandplug-ins>InitializingandScriptActiveXcontrolsnotmarkedassafe
- >Enable
如果沒有將上面選項設置成Enable,那么會報:automationservercan'tcreateobject錯誤。
【編輯推薦】