Flex 页面 初始化顺序

 

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

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

 

 

Flex中实现Application未初始化前加载配置内容

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

 

 

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

 

[c-sharp] view plain copy 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.             {  
  13.                 trace(flash.utils.getTimer().toString()+" >> "  
  14.                 +event.currentTarget.name+" "+event.type);  
  15.             }  
  16.         ]]-->  
  17.     </mx:Script>  
  18.    
  19.     <mx:Canvas id="canv1"  
  20.         preinitialize="showEvent(event)"   
  21.         initialize="showEvent(event)"   
  22.         creationComplete="showEvent(event)"   
  23.         updateComplete="showEvent(event)">  
  24.    
  25.         <mx:Button id="btn1"  
  26.             preinitialize="showEvent(event)"   
  27.             initialize="showEvent(event)"   
  28.             creationComplete="showEvent(event)"   
  29.             updateComplete="showEvent(event)"/>  
  30.     </mx:Canvas>  
  31.    
  32.     <mx:Button id="btn2"  
  33.             preinitialize="showEvent(event)"   
  34.             initialize="showEvent(event)"   
  35.             creationComplete="showEvent(event)"   
  36.             updateComplete="showEvent(event)"/>  
  37.    
  38. </mx:Application>  

 

输出:

[c-sharp] view plain copy print ?
  1. 349 >> InitExample0 preinitialize  
  2. 356 >> canv1 preinitialize  
  3. 359 >> btn1 preinitialize  
  4. 369 >> btn1 initialize  
  5. 370 >> canv1 initialize  
  6. 371 >> btn2 preinitialize  
  7. 372 >> btn2 initialize  
  8. 372 >> InitExample0 initialize  
  9. 476 >> btn1 creationComplete  
  10. 477 >> btn1 updateComplete  
  11. 477 >> canv1 creationComplete  
  12. 477 >> canv1 updateComplete  
  13. 477 >> btn2 creationComplete  
  14. 477 >> btn2 updateComplete  
  15. 478 >> InitExample0 creationComplete  
  16. 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

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

    Flex显示层级划分

          SystemManagerFlex应用程序的显示层级划分如下:

           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是为了利用工厂模式分离preloaderApplication的关联。整个Flex项目确实可以载入到其它项目中的,但不是以Module方式载入而是通过普通方法加载,例如使用SWFLoaderLoader加载,SystemManager作为顶级容器加入到项目的显示列表。

           SystemManagerapplication: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来代替Flashv3组件框架,但你需要斟酌加载swfFlash项目带来的等待时间,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参数比较方便。

     

    初始化流程

           ApplicationUIComponent的初始化过程涉及到很多方面,若揉杂在一起便会对维护和修改造成混乱的局面,于是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()方法中对组件进行改造;如果只需要对组件的属性或者样式进行设置,可以选择preInitilizeinitilize、事件在不同阶段进行设置,要修改布局,可在creationComplete事件后进行。

    Application初始化流程

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



      

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

    初始化事件

    初始化事件都是FlexEvent事件,对应类型如下表:

    事件名称

    事件类型

    preinitilize

    FlexEvent.PREINITIALIZE

    initilize

    FlexEvent.INITIALIZE

    creationComplete

    FlexEvent.CREATION_COMPLETE

    applicationComplete

    FlexEvent.APPLICATION_COMPLETE

     


     

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值