FLEX的初始化顺序

 

FLEX组件在建立的时候都会经历四个事件：preinitialize , initialize , creationComplete 和 updateComplete（updateComplete事件在任何改动视觉的情况下都会发生，不是初始化时独有的）。

 

下面的例子检测在嵌套和平行的情况下，各个组件的事件抛出顺序。

 

view plain copy to clipboard print ?

1. <?xml version="1.0" encoding="utf-8"?>  
2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"  
3. preinitialize="showEvent(event)"  
4. initialize="showEvent(event)"  
5. creationComplete="showEvent(event)"  
6. updateComplete="showEvent(event)">  
7.    
8. <mx:script>  
9. 　　<!--[CDATA[  
10.   import flash.utils.getTimer;  
11.   private function showEvent(event:Event):void {  
12. 　　　　 　　trace(flash.utils.getTimer().toString()+" >> "+event.currentTarget.name+" "+event.type);  
13.   }  
14. 　]]-->  
15. </mx:script>  
16.    
17. <mx:Canvas id="canv1"  
18.   preinitialize="showEvent(event)"  
19.   initialize="showEvent(event)"  
20.   creationComplete="showEvent(event)"  
21.   updateComplete="showEvent(event)">  
22.    
23.   <mx:Button id="btn1"  
24.   preinitialize="showEvent(event)"  
25.   initialize="showEvent(event)"  
26.   creationComplete="showEvent(event)"  
27.   updateComplete="showEvent(event)"/>  
28. </mx:Canvas>  
29.    
30. <mx:Button id="btn2"  
31.   preinitialize="showEvent(event)"  
32.   initialize="showEvent(event)"  
33.   creationComplete="showEvent(event)"  
34.   updateComplete="showEvent(event)"/>  
35.    
36. </mx:Application>  

<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"preinitialize="showEvent(event)"initialize="showEvent(event)"creationComplete="showEvent(event)"updateComplete="showEvent(event)"> <mx:script>　　<!--[CDATA[ import flash.utils.getTimer; private function showEvent(event:Event):void {　　　　 　　trace(flash.utils.getTimer().toString()+" >> "+event.currentTarget.name+" "+event.type); }　]]--></mx:script> <mx:Canvas id="canv1" preinitialize="showEvent(event)" initialize="showEvent(event)" creationComplete="showEvent(event)" updateComplete="showEvent(event)"> <mx:Button id="btn1" preinitialize="showEvent(event)" initialize="showEvent(event)" creationComplete="showEvent(event)" updateComplete="showEvent(event)"/></mx:Canvas> <mx:Button id="btn2" preinitialize="showEvent(event)" initialize="showEvent(event)" creationComplete="showEvent(event)" updateComplete="showEvent(event)"/> </mx:Application>

 

 

---

 

上面的例子输出顺序是：

1299 >> eventTest0 preinitialize

1307 >> canv1 preinitialize

1310 >> btn1 preinitialize

1318 >> btn1 initialize

1319 >> canv1 initialize

1320 >> btn2 preinitialize

1321 >> btn2 initialize

1321 >> eventTest0 initialize

[SWF] G:/projects/eventTest/bin-debug/eventTest.swf - 588,818 bytes after decompression

1387 >> btn1 creationComplete

1387 >> btn1 updateComplete

1387 >> canv1 creationComplete

1387 >> canv1 updateComplete

1388 >> btn2 creationComplete

1388 >> btn2 updateComplete

1388 >> eventTest0 creationComplete

1390 >> eventTest0 updateComplete

 

看着有点混乱，不过仔细看看，可以把过程分成两个部分。

很明显，所有的creationComplete和updateComplete发生在第二次update的时候，之前flex组件只是做一些设置和计算的工作，并没有在画布上画任何东西。除此之外，还有这么一些规律：

• 就单个组件而言，事件的抛出顺序是preinitialize，initialize，creationComplete
• 嵌套关系的两个组件（比如Canvas和button1），preinitialize先外后内，initialize和creationComplete先内后外。只是creationComplete要在下一次update才会发生。
• 平行关系的两个组件（比如Canvas和button2），按mxml内的顺序，只有前面组件initialize结束后，后面的组件才会抛出preinitialize。