Flex 页面 初始化顺序

Flex RemoteObject 远程调用对像默认是异步执行的,就像AJAX那样,,,,这样子有时候对于等待业务层反回值是很不方便,,所以在Flex RemoteObject 对像中也有设置为同步执行的方法:

两种解决办法: 1,相关处理代码放在result返回那个方法里面. 2,concurrency 设置为single或last. (<mx:RemoteObject concurrency="single"/> concurrency的属性就是同步和异步的 默认的是multiple)

<wbr><a target="_blank" id="cb_post_title_url" class="postTitle2" href="http://www.cnblogs.com/ddw1997/archive/2012/10/11/2719746.html">Flex中实现Application未初始化前加载配置内容</a></wbr>

http://www.cnblogs.com/ddw1997/archive/2012/10/11/2719746.html

flex组件在建立的时候都会经历四个事件：preinitialize,initialize,creationComplete和updateComplete（updateComplete事件在任何改动视觉的情况下都会发生，不是初始化时独有的）。我这里有个例子来检测在嵌套和平行的情况下，测试各个组件的事件抛出顺序。

<?xmlversion="1.0"encoding="utf-8"?>
<mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute"
preinitialize="showEvent(event)"
initialize="showEvent(event)"
creationComplete="showEvent(event)"
updateComplete="showEvent(event)">

<mx:Script>
<!--[CDATA[
importflash.utils.getTimer;
privatefunctionshowEvent(event:Event):void
{
trace(flash.utils.getTimer().toString()+">>"
+event.currentTarget.name+""+event.type);
}
]]-->
</mx:Script>

<mx:Canvasid="canv1"
preinitialize="showEvent(event)"
initialize="showEvent(event)"
creationComplete="showEvent(event)"
updateComplete="showEvent(event)">

<mx:Buttonid="btn1"
preinitialize="showEvent(event)"
initialize="showEvent(event)"
creationComplete="showEvent(event)"
updateComplete="showEvent(event)"/>
</mx:Canvas>

<mx:Buttonid="btn2"
preinitialize="showEvent(event)"
initialize="showEvent(event)"
creationComplete="showEvent(event)"
updateComplete="showEvent(event)"/>

</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>

输出：

349>>InitExample0preinitialize
356>>canv1preinitialize
359>>btn1preinitialize
369>>btn1initialize
370>>canv1initialize
371>>btn2preinitialize
372>>btn2initialize
372>>InitExample0initialize
476>>btn1creationComplete
477>>btn1updateComplete
477>>canv1creationComplete
477>>canv1updateComplete
477>>btn2creationComplete
477>>btn2updateComplete
478>>InitExample0creationComplete
481>>InitExample0updateComplete

349 >> InitExample0 preinitialize
356 >> canv1 preinitialize
359 >> btn1 preinitialize
369 >> btn1 initialize
370 >> canv1 initialize
371 >> btn2 preinitialize
372 >> btn2 initialize
372 >> InitExample0 initialize
476 >> btn1 creationComplete
477 >> btn1 updateComplete
477 >> canv1 creationComplete
477 >> canv1 updateComplete
477 >> btn2 creationComplete
477 >> btn2 updateComplete
478 >> InitExample0 creationComplete
481 >> InitExample0 updateComplete

结论：

就单个组件而言，事件的抛出顺序是preinitialize，initialize，creationComplete

嵌套关系的两个组件（比如Canvas和button1），preinitialize先外后内，initialize和creationComplete先内后外。只是creationComplete要在下一次update才会发生。

平行关系的两个组件（比如Canvas和button2），按mxml内的顺序，只有前面组件initialize结束后，后面的组件才会抛出preinitialize。

如果不了解Flex发布的swf结构和初始化流程，会在工作中遇到困难，Flex发布的swf结构和Flex对显示层级的划分是Flex架构中的一部分。

Flex发布的swf结构

Flex生成的swf是个2帧的MovieClip，文档类继承SystemManager，主时间轴上没有任何内容，帧上也没有代码，2帧结构是为创建加载应用程序的默认加载器，这种早期就开始使用的加载方式在如今仍然具有优势，默认的加载器如图：

加载器的外观是通过代码绘制的，SystemManager使用工厂模式来创建应用程序，这使得第一帧涉及的Flex底层较少，加载器在渐进式下载过程中会很快的显示在舞台上，当Flex工程和需要的共享库下载完毕后，SystemManager跳到第二帧，从应用程序域中找出Application的定义创建实例。下图为swf初始化的顺序：

SystemManager

SystemManager是Flex发布swf的文档类，是应用程序的入口，SystemManager继承MovieClip，不仅控制swf的加载和启动，还划分Flex工程显示层级，保存嵌入字体和样式，监视swf画布大小等顶级功能，某些功能被映射到Application或全局管理器中，你可以选择访问的方式。

Flex显示层级划分

SystemManager对Flex应用程序的显示层级划分如下：

SystemManager是顶级显示层的管理器，凡是父级为SystemManager的显示层都是顶级显示层，应用程序、弹出窗口、工具提示、鼠标光标都是父级为SystemManager的顶级层，popUpChildren:IChildList,toolTipChildren:IChildList,cursorChildren:IChildList并不是具体的显示层，而是记录顶级层的集合，SystemManager自动维护这些集合，使得弹出窗口总是位于应用程序之上，工具提示总是位于弹出窗口之上，鼠标光标总是位于工具提示之上。弹出窗口、工具提示、鼠标光标集合由Flex框架在运行中添加和删除内容，不要通手动修改这些集合以干扰框架运行，但内可以添加应用程序层对你的项目进行划分。

SystemManager重写了DisplayObjectContainer的接口，它与Container一样忽略辅助性的元素，通过SystemManager获取的子级实际上不包含浮动窗口、工具提示和光标这样的辅助层，也不包括内部的鼠标捕捉层，只包含默认的应用程序层和使用addChild()等方法添加进来的应用层，这也是SystemManager提供cursorChildren等这样的集合访问而不是通过getChildAt()访问顶级显示层的原因。通过cursorChildren这样的集合也并不能完全暴露SystemManager的所有子级，要访问原始子级，可以使用rawChildren:IChildList属性进行遍历，但不要通过此手段破坏SystemManager的结构。

载入Flex项目

SystemManager实现IFlexModuleFactory接口，但并不表示它可以作为一个Module载入，扩展IFlexModuleFactory是为了利用工厂模式分离preloader和Application的关联。整个Flex项目确实可以载入到其它项目中的，但不是以Module方式载入而是通过普通方法加载，例如使用SWFLoader或Loader加载，SystemManager作为顶级容器加入到项目的显示列表。

SystemManager的application:IUIComponent属性引用载入Flex项目的application实例，getDefinitionByName(name:String):Object方法获取载入swf中的定义，例如Object(SystemManager(mySwfLoader.content).application.testButton获取载入项目中的testButton按钮实例，SystemManager(mySwfLoader.content).getDefinitionByName("TestButton")获取载入项目中的TestButtond定义。

将Flex项目载入到另一个Flex项目中后，会使用新项目的SystemManager管理顶级层，因为全局管理器只能有一个，例如载入项目中有弹出窗口，这个弹出窗口的父级为新项目的SystemManager，原项目的SystemManager仅作为一个父级存在，它的功能只限定于引用，原项目中可以使用topLevelSystemManager:ISystemManager属性引用新项目的SystemManager。让一个Flex项目载入另外一个Flex项目没有什么优势，不能很好的体现项目和模块的关系，代码组织不明确且无法避免重定义，我们应该使用Module来分割应用程序。一个例外是你可以让Flash项目载入Flex工程构建UI来代替Flash的v3组件框架，但你需要斟酌加载swf给Flash项目带来的等待时间，Flex项目通常体积比较大。

Application

Application是应用层的顶级容器，Application的某些属性关系到Flex如何编译项目或生成的网页，这些属性不能用as设置，只能通过mxml标签设置，如下：

属性	说明
frameRate:Number	项目帧数，默认为24帧
pageTitle:String	浏览器标题栏中显示的文本
usePreLoader:Boolean	是否显示预加载器PreLoader
preloader:Object	预加载器类路径
scriptRecursionLimit:int	最大堆栈
scriptTimeLimit:Number	最大失去响应时间

获取swf地址和flashVars

Application的url:String可以获取swf地址，但这个属性依然不能获取网页传递的值对，因为Application是通过发布swf的loaderInfo获取地址，parameters:Object属性映射了loadInfo的flashVars，访问flashVars参数比较方便。

初始化流程

Application和UIComponent的初始化过程涉及到很多方面，若揉杂在一起便会对维护和修改造成混乱的局面，于是Flex将初始化过程进行阶段划分并制定执行顺序，每个阶段完成都会触发一个事件，这些事件不仅能够反映初始化过程，还为我们提供了对初始化进行增补的手段。

UIComponent初始化流程

Flex组件和Flex容器都继承UIComponent，它们的初始化流程都被定义在UIComponent中，这表示Flex组件和Flex容器的初始化流程是相同的，Flex组件虽然不能象容器那样添加子级，但不代表它们没有子级，如Button内部包含的UITextField，某些Flex组件和Flex容器一样包括其它Flex组件，如Combox的子级包括List组件，这样的组件称为复合组件。Flex组件和Flex容器均采取递归的方式初始化，即先完成子级初始化，然后完成父级初始化，在初始化过程中伴随者事件，如图：

在UIComponent的构造函数中不会创建组件的子级，构造函数中只对组件的默认属性、样式进行设置，并且为组件添加侦听器，子级是在initilize()方法中创建的，initilize()方法是UIcomponent初始化核心，它不由构造函数调用的，而是调用addChild()和addChildAt()方法时执行，好处是节省内存占用，初始化后的组件必然要占据大量的内存，动态添加的子级在加入容器之前保持其最小体积，直到加入容器时才具有正常的内存占用。在createChildren()方法中创建组件的子级，如果子级也是UIComponent，则会产生递归，preInitilize事件提供创建子级之前的准备工作，childrenCreated()和initilizationComplete()方法提供子级创建完毕之后的改造工作，区别是它们之间相隔一个initializeAccessibility()方法，initializeAccessibility()用于初始化辅助功能，当所有子级以及递归完成后，发送initilize事件，如果UIComponent是容器，则接着对组件进行布局，布局完成后发送creationComplete事件。了解initilize()方法工作原理对开发自定义组件非常重要，选择继承UIComponent时，应该把创建子级的代码放入createchildren()方法中；选择继承内置组件时，可以在childrenCreated()或initilizationComplete()方法中对组件进行改造；如果只需要对组件的属性或者样式进行设置，可以选择preInitilize、initilize、事件在不同阶段进行设置，要修改布局，可在creationComplete事件后进行。

Application初始化流程

Application的初始化过程不但包括内部子级的初始化，还通知SystemManager将其加入舞台的显示列表，Application是Flex容器，它的初始化规则遵守普通组件的规则，这里以事件为主线阐明Application在初始化过程中经历的阶段：

Application拥有普通容器没有的ApplicationComplete事件，Application被SystemManager添加到显示列表后触发，完成度比createComplete更高，在这个事件中可以访问舞台。

初始化事件

初始化事件都是FlexEvent事件，对应类型如下表：

事件名称	事件类型
preinitilize	FlexEvent.PREINITIALIZE
initilize	FlexEvent.INITIALIZE
creationComplete	FlexEvent.CREATION_COMPLETE
applicationComplete	FlexEvent.APPLICATION_COMPLETE

如果不了解Flex发布的swf结构和初始化流程，会在工作中遇到困难，Flex发布的swf结构和Flex对显示层级的划分是Flex架构中的一部分。

Flex发布的swf结构

Flex生成的swf是个2帧的MovieClip，文档类继承SystemManager，主时间轴上没有任何内容，帧上也没有代码，2帧结构是为创建加载应用程序的默认加载器，这种早期就开始使用的加载方式在如今仍然具有优势，默认的加载器如图：

加载器的外观是通过代码绘制的，SystemManager使用工厂模式来创建应用程序，这使得第一帧涉及的Flex底层较少，加载器在渐进式下载过程中会很快的显示在舞台上，当Flex工程和需要的共享库下载完毕后，SystemManager跳到第二帧，从应用程序域中找出Application的定义创建实例。下图为swf初始化的顺序：

SystemManager

SystemManager是Flex发布swf的文档类，是应用程序的入口，SystemManager继承MovieClip，不仅控制swf的加载和启动，还划分Flex工程显示层级，保存嵌入字体和样式，监视swf画布大小等顶级功能，某些功能被映射到Application或全局管理器中，你可以选择访问的方式。

Flex显示层级划分

SystemManager对Flex应用程序的显示层级划分如下：

SystemManager是顶级显示层的管理器，凡是父级为SystemManager的显示层都是顶级显示层，应用程序、弹出窗口、工具提示、鼠标光标都是父级为SystemManager的顶级层，popUpChildren:IChildList,toolTipChildren:IChildList,cursorChildren:IChildList并不是具体的显示层，而是记录顶级层的集合，SystemManager自动维护这些集合，使得弹出窗口总是位于应用程序之上，工具提示总是位于弹出窗口之上，鼠标光标总是位于工具提示之上。弹出窗口、工具提示、鼠标光标集合由Flex框架在运行中添加和删除内容，不要通手动修改这些集合以干扰框架运行，但内可以添加应用程序层对你的项目进行划分。

SystemManager重写了DisplayObjectContainer的接口，它与Container一样忽略辅助性的元素，通过SystemManager获取的子级实际上不包含浮动窗口、工具提示和光标这样的辅助层，也不包括内部的鼠标捕捉层，只包含默认的应用程序层和使用addChild()等方法添加进来的应用层，这也是SystemManager提供cursorChildren等这样的集合访问而不是通过getChildAt()访问顶级显示层的原因。通过cursorChildren这样的集合也并不能完全暴露SystemManager的所有子级，要访问原始子级，可以使用rawChildren:IChildList属性进行遍历，但不要通过此手段破坏SystemManager的结构。

载入Flex项目

SystemManager实现IFlexModuleFactory接口，但并不表示它可以作为一个Module载入，扩展IFlexModuleFactory是为了利用工厂模式分离preloader和Application的关联。整个Flex项目确实可以载入到其它项目中的，但不是以Module方式载入而是通过普通方法加载，例如使用SWFLoader或Loader加载，SystemManager作为顶级容器加入到项目的显示列表。

SystemManager的application:IUIComponent属性引用载入Flex项目的application实例，getDefinitionByName(name:String):Object方法获取载入swf中的定义，例如Object(SystemManager(mySwfLoader.content).application.testButton获取载入项目中的testButton按钮实例，SystemManager(mySwfLoader.content).getDefinitionByName("TestButton")获取载入项目中的TestButtond定义。

将Flex项目载入到另一个Flex项目中后，会使用新项目的SystemManager管理顶级层，因为全局管理器只能有一个，例如载入项目中有弹出窗口，这个弹出窗口的父级为新项目的SystemManager，原项目的SystemManager仅作为一个父级存在，它的功能只限定于引用，原项目中可以使用topLevelSystemManager:ISystemManager属性引用新项目的SystemManager。让一个Flex项目载入另外一个Flex项目没有什么优势，不能很好的体现项目和模块的关系，代码组织不明确且无法避免重定义，我们应该使用Module来分割应用程序。一个例外是你可以让Flash项目载入Flex工程构建UI来代替Flash的v3组件框架，但你需要斟酌加载swf给Flash项目带来的等待时间，Flex项目通常体积比较大。

Application

Application是应用层的顶级容器，Application的某些属性关系到Flex如何编译项目或生成的网页，这些属性不能用as设置，只能通过mxml标签设置，如下：

属性	说明
frameRate:Number	项目帧数，默认为24帧
pageTitle:String	浏览器标题栏中显示的文本
usePreLoader:Boolean	是否显示预加载器PreLoader
preloader:Object	预加载器类路径
scriptRecursionLimit:int	最大堆栈
scriptTimeLimit:Number	最大失去响应时间

获取swf地址和flashVars

Application的url:String可以获取swf地址，但这个属性依然不能获取网页传递的值对，因为Application是通过发布swf的loaderInfo获取地址，parameters:Object属性映射了loadInfo的flashVars，访问flashVars参数比较方便。

初始化流程

Application和UIComponent的初始化过程涉及到很多方面，若揉杂在一起便会对维护和修改造成混乱的局面，于是Flex将初始化过程进行阶段划分并制定执行顺序，每个阶段完成都会触发一个事件，这些事件不仅能够反映初始化过程，还为我们提供了对初始化进行增补的手段。

UIComponent初始化流程

Flex组件和Flex容器都继承UIComponent，它们的初始化流程都被定义在UIComponent中，这表示Flex组件和Flex容器的初始化流程是相同的，Flex组件虽然不能象容器那样添加子级，但不代表它们没有子级，如Button内部包含的UITextField，某些Flex组件和Flex容器一样包括其它Flex组件，如Combox的子级包括List组件，这样的组件称为复合组件。Flex组件和Flex容器均采取递归的方式初始化，即先完成子级初始化，然后完成父级初始化，在初始化过程中伴随者事件，如图：

在UIComponent的构造函数中不会创建组件的子级，构造函数中只对组件的默认属性、样式进行设置，并且为组件添加侦听器，子级是在initilize()方法中创建的，initilize()方法是UIcomponent初始化核心，它不由构造函数调用的，而是调用addChild()和addChildAt()方法时执行，好处是节省内存占用，初始化后的组件必然要占据大量的内存，动态添加的子级在加入容器之前保持其最小体积，直到加入容器时才具有正常的内存占用。在createChildren()方法中创建组件的子级，如果子级也是UIComponent，则会产生递归，preInitilize事件提供创建子级之前的准备工作，childrenCreated()和initilizationComplete()方法提供子级创建完毕之后的改造工作，区别是它们之间相隔一个initializeAccessibility()方法，initializeAccessibility()用于初始化辅助功能，当所有子级以及递归完成后，发送initilize事件，如果UIComponent是容器，则接着对组件进行布局，布局完成后发送creationComplete事件。了解initilize()方法工作原理对开发自定义组件非常重要，选择继承UIComponent时，应该把创建子级的代码放入createchildren()方法中；选择继承内置组件时，可以在childrenCreated()或initilizationComplete()方法中对组件进行改造；如果只需要对组件的属性或者样式进行设置，可以选择preInitilize、initilize、事件在不同阶段进行设置，要修改布局，可在creationComplete事件后进行。

Application初始化流程

Application的初始化过程不但包括内部子级的初始化，还通知SystemManager将其加入舞台的显示列表，Application是Flex容器，它的初始化规则遵守普通组件的规则，这里以事件为主线阐明Application在初始化过程中经历的阶段：

Application拥有普通容器没有的ApplicationComplete事件，Application被SystemManager添加到显示列表后触发，完成度比createComplete更高，在这个事件中可以访问舞台。

初始化事件

初始化事件都是FlexEvent事件，对应类型如下表：

事件名称	事件类型
preinitilize	FlexEvent.PREINITIALIZE
initilize	FlexEvent.INITIALIZE
creationComplete	FlexEvent.CREATION_COMPLETE
applicationComplete	FlexEvent.APPLICATION_COMPLETE