【转】Flex Application 初始化顺序
轉自:http://www.jexchen.com
大家都知道,我們在編寫Flex應用程序時,通常是以<mx:Application>標簽作為開頭,實際上,Flex應用程序在啟動運行的時候并不是直接從Application開始運行,在這之前還有一部分悄悄的先運行了,正如大家所看到的,當我們運行編寫好的Flex應用程序時,盡管我們沒有編寫任何與啟動進度載入條相關的代碼,但無一例外的,應用程序均會為我們自動加上這一部分。因此才有我們看到的如下圖所示的標準的Flex loading載入條。
通常我們所說的Flex應用程序,本質上來說是基于Flex框架、采用ActionScript 3.0編寫的Flash應用程序,從這一點來說,它和普通的Flash應用程序沒有任何差別。相對來說,傳統(tǒng)的使用Flash IDE(如Flash CS3)創(chuàng)建Flash程序時更多的基于“時間線”(Timeline)及“幀”(Frame)的概念,更易于設計師理解;而基于Flex框架來創(chuàng)建的 Flash應用程序更多是強調程序性,很少提及“時間線”與“幀”的概念,更易于程序員理解。其實Flex應用程序一樣也有時間線,只是這部分由Flex 框架隱藏起來了,通常不為大家所熟悉,在默認創(chuàng)建Flex程序時,這一切Flex已幫我們完成了,但了解這部分內容更有助于大家對Flex應用程序的啟動有更深刻的認識,以便能對程序更靈活的控制與發(fā)揮~~
我們來看看上面這幅示意圖,Flex應用程序共由兩幀組成,第1幀為preloader部分,第2幀為主應用程序部分,此兩部分由Flex應用程序的根SystemManager統(tǒng)管,SystemManager是flash.display.MovieClip的子類,影片剪輯(movie clip)支持幀。由于swf屬于一種漸進式(progressive)下載的格式,正是由于swf格式這個特性,Flash Player并不需要等待整個程序下載完成便可直接訪問已載入幀的內容,因此第一幀通常用來作為應用程序載入時的loading畫面顯示,一般來說,第一幀包含的內容應該盡可能的少(在第一幀中盡量不要含有Flex框架的組件),以便能很快的下載并立即顯示;第二幀才是主應用程序真正的內容,一旦 SystemManager實例進入到第二幀后,即開始內部主應用程序運行的生命周期(life cycle),也就是進入我們最為熟悉的<mx:Application>運行的部分(SystemManger實例有一 application的屬性,在第1幀時,此屬性為null,當進入到第2幀時,該屬性才指向真正的主程序application實例)記住我們開始所說的,Flex應用程序總的來說是以事件驅動的程序。
在程序進入第2幀,主程序application開始運行后,便會相應的觸發(fā)相應的一系列事件,按事件發(fā)生的先后順序依次來介紹:
preinitialize
應用程序application已實例化,但此時還未創(chuàng)建任何相關的孩子組件(child component)
initialize
此時,創(chuàng)建了相應的孩子組件,但還未對這些子組件進行布局
creationComplete
應用程序application完成全部實例化,并完成所有子組件的布局
apllicationComplete
上面三處事件的完成,表明application內部啟動的整個進程完成,接下來便會通知SystemManager派發(fā)applicationComplete事件。此時,啟動程序啟動完成并準備運行。
Flash包含的是一個時間線上的多個幀, 而Flex的SWF只包含2個幀. SystemManager, Preloader, DownloadProgressBar和少量工具類都在第一幀, 剩下的包括應用代碼/ 內嵌資源全都在第二幀中. 當Flash Player下載下載SWF時, 只要接收到第一幀內足夠的數(shù)據(jù), 就會實例化SystemManager, 由它來創(chuàng)建Preloader, 然后創(chuàng)建DownloadProgressBar, 這兩個對象會察看剩余字節(jié)的傳輸過程. 當?shù)谝粠乃凶止?jié)傳輸完畢后, SystemManager發(fā)送enterFrame到第二幀, 然后是其他事件. 最后Application對象派發(fā)applicationComplete事件.
SystemManager是Flex應用的主控者, 它控制著應用窗口, Application實例, 彈出窗口, cursors, 并管理著ApplicationDomain中的類. SystemManager是FlashPlayer實例化的第一個類, 它存儲了主應用窗口的大小和位置信息, 保存其子組件比如:浮動彈出窗口和模態(tài)窗口的痕跡. 通過SystemManager可以獲得內嵌字體,樣式和document對象.
自定義的可視化組件(UIComponent的子類)只有在調用過addChild()后, 才會有一個SystemManager賦給他們, 之前是Null. 所以在自定義可視化組件的構造函數(shù)中不要使用SystemManager.
通常, Application對象創(chuàng)建時, 發(fā)生如下事件:
1. 實例化Application對象
2. 初始化Application.systemManager
3. Application在初始化過程之前, 派發(fā)預初始化事件.
4. 調用createChild(). 此時, 所有應用組件被創(chuàng)建, 所有組件的createChild()被調用.
5. Application派發(fā)初始化事件, 表明所有的組件初始化完畢.
6. 派發(fā)creationComplete事件
7. Application對象添加到顯示列表中
8. 派發(fā)applicationComplete事件
大多數(shù)情況下, 我們使用<mx:Application>來創(chuàng)建application對象, 但如果使用ActionScript來創(chuàng)建的話, 那么建議不要在application的構造函數(shù)中創(chuàng)建組件, 推薦在crateChildren函數(shù)中, 主要是從性能方面考慮.
Flex 是一個事件驅動的編程模型, 任何事情的發(fā)生, 其背后必然存在一個事件. 而開發(fā)者第一次看到MXML時, 很難體會到一個Xml標記的應用的事件流和實例化的生命周期. 這個對于HTML和Flash的開發(fā)者尤其會感到困惑, 因為其熟悉的方式與Flex的一點也不相似. HTML的實例化是從上到下的, Flash的執(zhí)行是從Frame0開始一幀幀運行的. 而Flex則又有不同.
我們來看一個簡單的MXML的應用.
1. <?xml version="1.0" encoding="utf-8"?>?
2. <mx:Application?
3.? xmlns:mx="http://www.adobe.com/2006/mxml"?
4.? layout="absolute"?
5.? backgroundGradientColors="[#67cbff, #fcffff]"?
6.? color="#000000"?
7.? fontSize="12"?
8.? preinitialize="report( event , 'preinitialize' )"?
9.? initialize="report( event , 'initialize' )"?
10.? creationComplete="report( event , 'creationComplete' )"?
11.? applicationComplete="report( event , 'applicationComplete' )"?
12.? >?
13.?
14.? <mx:Script>?
15.? <![CDATA[?
16.?
17.? [Bindable]?
18.?
19.? public var outTextData:String="";?
20.?
21.? public function report( event:Event , value:String ):void?
22.? {?
23.? outTextData += String( flash.utils.getTimer() ) + 'ms >> '?
24.? + event.currentTarget + '.' + value + '\n';?
25.? }?
26.?
27.? ]]>?
28.? </mx:Script>?
29.?
30.? <mx:TextArea?
31.? id="outTextArea"?
32.? text="{ outTextData }"?
33.? right="10" left="10" top="50" bottom="10" alpha="0.5"?
34.? wordWrap="false"?
35.? initialize="report( event , 'initialize' )"?
36.? creationComplete="report( event , 'creationComplete' )"?
37.? />?
38.?
39.? <mx:Button?
40.? y="10" height="30" left="168" width="150"?
41.? id="HelloButton"?
42.? label="Say Hello"?
43.? initialize="report( event , 'initialize' )"?
44.? creationComplete="report( event , 'creationComplete' )"?
45.? rollOver="report( event , 'rollOver' )"?
46.? rollOut="report( event , 'rollOut' )"?
47.? click="report( event , 'click > Hello!' )"?
48.? />?
49.?
50.? <mx:Button?
51.? id="GoodByeButton"?
52.? label="Say Goodbye"?
53.? y="10" left="10" height="30" width="150" color="#000000"?
54.? initialize="report( event , 'initialize' )"?
55.? creationComplete="report( event , 'creationComplete' )"?
56.? click="report( event , 'click > Goodbye!' )"?
57.? />?
58.?
59.? <mx:Button?
60.? id="ClearButton"?
61.? label="Clear"?
62.? y="10" left="326" height="30" color="#000000" right="10"?
63.? initialize="report( event , 'initialize' )"?
64.? creationComplete="report( event , 'creationComplete' )"?
65.? click="outTextData='';report( event , 'click' )"?
66.? />?
67.?
68. </mx:Application>?
這個應用運行時, 輸出了實例流程和事件流. 這校我們就能夠看到所有事件的觸發(fā)順序. 可以發(fā)現(xiàn)應用啟動后, 事件的順序是一定的. 下面是輸出的內容:
1. 167ms >> EventFlow0.preinitialize?
2. 183ms >> EventFlow0.outTextArea.initialize?
3. 187ms >> EventFlow0.HelloButton.initialize?
4. 188ms >> EventFlow0.GoodByeButton.initialize?
5. 189ms >> EventFlow0.ClearButton.initialize?
6. 189ms >> EventFlow0.initialize?
7. 243ms >> EventFlow0.outTextArea.creationComplete?
8. 243ms >> EventFlow0.HelloButton.creationComplete?
9. 243ms >> EventFlow0.GoodByeButton.creationComplete?
10. 244ms >> EventFlow0.ClearButton.creationComplete?
11. 244ms >> EventFlow0.creationComplete?
12. 246ms >> EventFlow0.applicationComplete?
13. 一旦applicationComplete事件觸發(fā)后, 組件就會在鼠標事件派發(fā)后觸發(fā)自己的事件.?
14. 1807ms >> EventFlow0.HelloButton.rollOver?
15. 2596ms >> EventFlow0.HelloButton.rollOut?
16. 2954ms >> EventFlow0.HelloButton.rollOver?
17. 3170ms >> EventFlow0.HelloButton.rollOut?
18. 3543ms >> EventFlow0.HelloButton.rollOver?
19. 4052ms >> EventFlow0.HelloButton.click > Hello!?
20. 4267ms >> EventFlow0.HelloButton.click > Hello!?
21. 4474ms >> EventFlow0.HelloButton.click > Hello!?
22. 4569ms >> EventFlow0.HelloButton.rollOut?
23. 4907ms >> EventFlow0.GoodByeButton.click > Goodbye!?
24. 5130ms >> EventFlow0.GoodByeButton.click > Goodbye!
轉載于:https://www.cnblogs.com/AndySong/archive/2009/05/17/1458576.html
總結
以上是生活随笔為你收集整理的【转】Flex Application 初始化顺序的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 原创个性签名发布中心
- 下一篇: 【转载】C语言变量详解