文章，http://www.onflex.org/ted/2007/02/flex-instantiation-life-cycle-and-event.php
，說，Flex一切都是事件，flex是事件驅動的。（Flex is an event driven programming model, everything (and I mean everything) happens due to an event.
）。
這個問題的起源是我寫了一個讀取VBox高度的代碼：
<?xml version="1.0" encoding="utf-8"?><br /><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" backgroundColor="#99ccff" initialize="init()"><br /><mx:Style><br /></mx:Style><br /><mx:Script><br /><!--[CDATA[<br />import mx.collections.XMLListCollection;<br />import mx.controls.List;<br /> import mx.collections.ArrayCollection;<br /> [Bindable]<br /> public var left:XML=<br /><list><br /> <info label="モーニング娘。"><br /> </info><br /> </list>;<br />[Bindable]<br />private var leftList:XMLListCollection= new XMLListCollection(left.info);</p><p>// init the whole app.<br /> private function init():void<br /> {<br /> leftTree.dataProvider=leftList;<br /> leftTree.selectedIndex=0;</p><p> //srightVBox.backgroundImage="http://www.lovezaoan.cn/attachment/200905/24/25_1243179290Yp2p.jpg"; </p><p> test.text = leftCanvas.width+ " "+hdBox.height;<br /> }</p><p> // init the right when 1st level nodes are selected in the left<br /> private function initRight():void{</p><p> }<br />]]--><br /></mx:Script><br /><mx:HDividedBox width="100%" height="100%" id="hdBox"><br /><mx:Canvas height="100%" width="200" id="leftCanvas"></p><p><mx:Tree width="100%" height="100%" backgroundColor="#ff6ac8" id="leftTree" labelField="@label" fontSize="14" top="0" left="0" ></p><p></mx:Tree><br /><mx:Panel height="60" headerHeight="10" bottom="0" width="100%" left="0"><br /><mx:HBox></p><p><mx:Image source="../resource/logo.gif"><br /></mx:Image><br /><mx:Label text="愛早安出品" fontSize="20" fontWeight="bold"></p><p></mx:Label><br /></mx:HBox><br /></mx:Panel><br /></mx:Canvas><br /><mx:VBox id="rightVBox" height="100%" backgroundImage="@Embed(source='../resource/mm.jpg')" backgroundSize="100%"><br /><mx:Text id="test"></p><p></mx:Text><br /></mx:VBox><br /></mx:HDividedBox><br /></mx:Application><br />
// init the whole app.
private function init():void
{
leftTree.dataProvider=leftList;
leftTree.selectedIndex=0;
//srightVBox.backgroundImage="http://www.lovezaoan.cn/attachment/200905/24/25_1243179290Yp2p.jpg";
test.text = leftCanvas.width+ " "+hdBox.height;
}
上面的粗體是讀leftCavas和hdBox的大小，但是得到的是0.
根據上面的文章，得到的0的原因是沒有理解flex中的組件載入順序。根據上面文章提供的例子。
http://www.onflex.org/flexapps/applications/EventFlow/srcview/index.html
<?xml version="1.0" encoding="utf-8"?><br /><mx:Application<br /> xmlns:mx="http://www.adobe.com/2006/mxml"<br /> layout="absolute"<br /> backgroundGradientColors="[#67cbff, #fcffff]"<br /> color="#000000"<br /> fontSize="12"<br /> preinitialize="report( event , 'preinitialize' )"<br /> initialize="report( event , 'initialize' )"<br /> creationComplete="report( event , 'creationComplete' )"<br /> applicationComplete="report( event , 'applicationComplete' )"<br /> ></p><p> <mx:Script><br /> <!--[CDATA[ </p><p> [Bindable]</p><p> public var outTextData:String="";</p><p> public function report( event:Event , value:String ):void<br /> {<br /> outTextData += String( flash.utils.getTimer() ) + 'ms >> '<br /> + event.currentTarget + '.' + value + '/n';<br /> }</p><p> ]]--><br /> </mx:Script></p><p> <mx:TextArea<br /> id="outTextArea"<br /> text="{ outTextData }"<br /> right="10" left="10" top="50" bottom="10" alpha="0.5"<br /> wordWrap="false"<br /> initialize="report( event , 'initialize' )"<br /> creationComplete="report( event , 'creationComplete' )"<br /> /></p><p> <mx:Button<br /> y="10" height="30" left="168" width="150"<br /> id="HelloButton"<br /> label="Say Hello"<br /> initialize="report( event , 'initialize' )"<br /> creationComplete="report( event , 'creationComplete' )"<br /> rollOver="report( event , 'rollOver' )"<br /> rollOut="report( event , 'rollOut' )"<br /> click="report( event , 'click > Hello!' )"<br /> /></p><p> <mx:Button<br /> id="GoodByeButton"<br /> label="Say Goodbye"<br /> y="10" left="10" height="30" width="150" color="#000000"<br /> initialize="report( event , 'initialize' )"<br /> creationComplete="report( event , 'creationComplete' )"<br /> click="report( event , 'click > Goodbye!' )"<br /> /></p><p> <mx:Button<br /> id="ClearButton"<br /> label="Clear"<br /> y="10" left="326" height="30" color="#000000" right="10"<br /> initialize="report( event , 'initialize' )"<br /> creationComplete="report( event , 'creationComplete' )"<br /> click="outTextData='';report( event , 'click' )"<br /> /></p><p></mx:Application>
結果：
http://www.onflex.org/flexapps/applications/EventFlow/
167ms >> EventFlow0.preinitialize
183ms >> EventFlow0.outTextArea.initialize
187ms >> EventFlow0.HelloButton.initialize
188ms >> EventFlow0.GoodByeButton.initialize
189ms >> EventFlow0.ClearButton.initialize
189ms >> EventFlow0.initialize
243ms >> EventFlow0.outTextArea.creationComplete
243ms >> EventFlow0.HelloButton.creationComplete
243ms >> EventFlow0.GoodByeButton.creationComplete
244ms >> EventFlow0.ClearButton.creationComplete
244ms >> EventFlow0.creationComplete
246ms >> EventFlow0.applicationComplete
從這個結果看出，組件的初始化過程是：
applicaiton先preinitialize，然後是各個組件依次initialize，然後是application的initialize，然後是各個組件依次creationComplete，然後是application的creationComplete，最後是applicatonComplete。
所以，我最初的代碼裡面把application的initialize理解成了html中body的onload了，所以在這個時候做一些對其他組件的初始化操作，包括擷取leftCanvas和hdBox的大小的時候就不對了。以leftCanvas為例，這個時候它沒有初始化完畢，所以其大小為0是正常的。
所以，代碼要修改為：
creationComplete="init()"
即，不用applicaiton的initialize事件，而是creationComplete事件，因為這個時候，application下的組件都已經建立完畢了。這個時候它們有height和width的值了。
關於flex的事件還可以參考：http://livedocs.adobe.com/flex/2/docs/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00000492.html
剛看到：
About startup order(http://livedocs.adobe.com/flex/3/html/help.html?content=layoutperformance_03.html),有意義，改天研究。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
