flex启动过程和初始化

如果不了解 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

    Applicationurl:String可以获取swf地址,但这个属性依然不能获取网页传递的值对,因为Application是通过发布swfloaderInfo获取地址,parameters:Object属性映射了loadInfoflashVars,访问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

相关文章

一:display:flex布局display:flex是一种布局方式。它即可以...
1. flex设置元素垂直居中对齐在之前的一篇文章中记载过如何...
移动端开发知识点pc端软件和移动端apppc端软件是什么,有哪些...
最近挺忙的,准备考试,还有其他的事,没时间研究东西,快周...
display:flex;把容器设置为弹性盒模型(设置为弹性盒模型之后...
我在网页上运行了一个Flex应用程序,我想使用Command←组合键...