`
lxcaoxin
  • 浏览: 127358 次
  • 性别: Icon_minigender_1
  • 来自: 南宁
社区版块
存档分类
最新评论

Flex Application 初始化顺序

    博客分类:
  • Flex
阅读更多

preloader->systemManager->FlexApplication started...
然后才是

preinitialize
在所有的初始化之前触发,没有子组件的定义,但是可以引用组件的变量.

initialize
当所有子组件生成完成后触发,在这个时间点还没有组件被渲染出来.

creationComplete
组件定义完成并已经在显示列表.

applicationComplete
所有的组件初始化完成并显示.


首 先介绍一下SystemManager. SystemManager是Flex应用的主控者, 它控制着应用窗口, Application实例, 弹出窗口, cursors, 并管理着ApplicationDomain中的类. SystemManager是FlashPlayer实例化的第一个类, 它存储了主应用窗口的大小和位置信息, 保存其子组件比如:浮动弹出窗口和模态窗口的痕迹. 通过SystemManager可以获得内嵌字体,样式和document对象.
自定义的可视化组件(UIComponent的子类)只有在调用过addChild()后, 才会有一个SystemManager赋给他们, 之前是Null. 所以在自定义可视化组件的构造函数中不要使用SystemManager.

通常, Application对象创建时, 发生如下事件:
1. 实例化Application对象
2. 初始化Application.systemManager
3. Application在初始化过程之前, 派发预初始化事件.
4. 调用createChild(). 此时, 所有应用组件被创建, 所有组件的createChild()被调用.
5. Application派发初始化事件, 表明所有的组件初始化完毕.
6. 派发creationComplete事件
7. Application对象添加到显示列表中
8. 派发applicationComplete事件

大 多数情况下, 我们使用<mx:Application>来创建application对象, 但如果使用ActionScript来创建的话, 那么建议不要在application的构造函数中创建组件, 推荐在crateChildren函数中, 主要是从性能方面考虑.

Flash包含的是一个时间线上的多个帧, 而Flex的SWF只包含2个帧. SystemManager, Preloader, DownloadProgressBar和少量工具类都在第一帧, 剩下的包括应用代码/ 内嵌资源全都在第二帧中. 当Flash Player下载下载SWF时, 只要接收到第一帧内足够的数据, 就会实例化SystemManager, 由它来创建Preloader, 然后创建DownloadProgressBar, 这两个对象会察看剩余字节的传输过程. 当第一帧的所有字节传输完毕后, SystemManager发送enterFrame到第二帧, 然后是其他事件. 最后Application对象派发applicationComplete事件.

Flex 是一个事件驱动的编程模型, 任何事情的发生, 其背后必然存在一个事件. 而开发者第一次看到MXML时, 很难体会到一个Xml标记的应用的事件流和实例化的生命周期. 这个对于HTML和Flash的开发者尤其会感到困惑, 因为其熟悉的方式与Flex的一点也不相似. HTML的实例化是从上到下的, Flash的执行是从Frame0开始一帧帧运行的. 而Flex则又有不同.

从我们开始学习Flex时, 我们就需要了解事件流和MXML的实例化. 我非常困惑因为我实在难以理解什么样的事件会被触发或者事件什么时候会被触发. 关键是要理解事件的基础并亲自观察事件流的初始化.

我们来看一个简单的MXML的应用.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute"
    backgroundGradientColors="[#67cbff, #fcffff]"
    color="#000000"
    fontSize="12"  
    preinitialize="report( event , 'preinitialize' )"
    initialize="report( event , 'initialize' )"
    creationComplete="report( event , 'creationComplete' )"
    applicationComplete="report( event , 'applicationComplete' )"
    >
  
    <mx:Script>
        <![CDATA[  
                   
            [Bindable]
           
            public var outTextData:String="";
           
            public function report( event:Event , value:String ):void
          

Unknown macro: {                 outTextData += String( flash.utils.getTimer() ) + 'ms >> '                  + event.currentTarget + '.' + value + 'n';                 }
           
        ]]>
    </mx:Script>
  
    <mx:TextArea
        id="outTextArea"
        text="

Unknown macro: { outTextData }
"
        right="10" left="10" top="50" bottom="10" alpha="0.5"
        wordWrap="false"
        initialize="report( event , 'initialize' )"
        creationComplete="report( event , 'creationComplete' )"
        />
  
    <mx:Button
        y="10" height="30" left="168" width="150"
        id="HelloButton"
        label="Say Hello"
        initialize="report( event , 'initialize' )"
        creationComplete="report( event , 'creationComplete' )"
        rollOver="report( event , 'rollOver' )"
        rollOut="report( event , 'rollOut' )"
        click="report( event , 'click > Hello!' )"
        />
       
    <mx:Button
        id="GoodByeButton"
        label="Say Goodbye"
        y="10" left="10" height="30" width="150" color="#000000"
        initialize="report( event , 'initialize' )"
        creationComplete="report( event , 'creationComplete' )"
        click="report( event , 'click > Goodbye!' )"
        />
       
    <mx:Button
        id="ClearButton"
        label="Clear"
        y="10" left="326" height="30" color="#000000" right="10"       
        initialize="report( event , 'initialize' )"
        creationComplete="report( event , 'creationComplete' )"
        click="outTextData='';report( event , 'click' )"
         />  
</mx:Application>
这个应用运行时, 输出了实例流程和事件流. 这校我们就能够看到所有事件的触发顺序. 可以发现应用启动后, 事件的顺序是一定的. 下面是输出的内容:


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

一旦applicationComplete事件触发后, 组件就会在鼠标事件派发后触发自己的事件.

1807ms >> EventFlow0.HelloButton.rollOver
2596ms >> EventFlow0.HelloButton.rollOut
2954ms >> EventFlow0.HelloButton.rollOver
3170ms >> EventFlow0.HelloButton.rollOut
3543ms >> EventFlow0.HelloButton.rollOver
4052ms >> EventFlow0.HelloButton.click > Hello!
4267ms >> EventFlow0.HelloButton.click > Hello!
4474ms >> EventFlow0.HelloButton.click > Hello!
4569ms >> EventFlow0.HelloButton.rollOut
4907ms >> EventFlow0.GoodByeButton.click > Goodbye!
5130ms >> EventFlow0.GoodByeButton.click > Goodbye!

关于creationComplete事件的发生时机,手册中是这样说的:
    假设程序中有这样的结构:

Application
    OuterVBox
        InnerVBox1
            InnerVBoxLabel1
        InnerVBox2
            InnerVBoxLabel2 

    事件:preinitialize, initialize, creationComplete发生的顺序是这样的:

OuterVBox  preinitialize
    InnerVBox1  preinitialize
        InnerVBox1Label  preinitialize
        InnerVBox1Label  initialize
    InnerVBox1  initialize
    InnerVBox2  preinitialize
        InnerVBox2Label  preinitialize
        InnerVBox2Label  initialize
    InnerVBox2  initialize
OuterVBox  initialize
        InnerBox1Label  creationComplete
        InnerVBox2Label  creationComplete
    InnerVBox1  creationComplete
    InnerVBox2  creationComplete
OuterVBox  creationComplete 

    所有的initialization事件完成后,creationComplete时间才开始发生,先从叶子控件开始,然后是他们的父控件,直到application。

    如果将 OuterVBox容器变成ViewStack并且creationPolicy 属性为auto, 则事件发生顺序是:

OuterViewStack  preinitialize
    InnerVBox1  preinitialize
    InnerVBox2  preinitialize
OuterViewStack  initialize
        InnerBox1Label  preinitialize
        InnerBox1Label  initialize
    InnerVBox1  initialize
        InnerBox1Label  creationComplete
    InnerVBox1  creationComplete
OuterViewStack  creationComplete 

然而,对于item renderer 或者 item editor, Flex 可能会重用item renderer 或者item editor的实例。但是被重用的renderer 或者item editor的实例不会再次发生creationComplete事件。作为替代,你可以使用dataChange事件。Flex 会在每次data属性发生变化时触发dataChange事件。在Accessing the listData property(Flex2 help中)一节中的例子就使用了dataChange事件来更新在DataGrid控件的item renderer中的TextArea的内容。


转自:http://blog.csdn.net/fengyun14/archive/2008/11/02/3206270.aspx
分享到:
评论

相关推荐

    Flex启动与初始化

    下图为 swf 初始化的顺序: 1. SystemManager 2. 加载器 3. Application 二、SystemManager 的作用 SystemManager 是 Flex 发布 swf 的文档类,是应用程序的入口。它不仅控制 swf 的加载和启动,还划分 Flex 工程...

    关于Flex 初始化的research

    原因在于Flex组件的生命周期,尤其是初始化阶段的事件顺序。 Flex组件的生命周期包含多个关键阶段,这些阶段按照一定的顺序执行,确保组件的正确初始化和显示。主要阶段包括: 1. **PREINITIALIZE**:这是组件生命...

    flex事件运行流程

    本文将深入探讨Flex事件运行流程,特别是与`mx:Application.applicationComplete`、`creationComplete`以及Flex应用程序初始化顺序相关的知识点。 首先,Flex应用程序的启动始于`preloader`阶段,系统管理器...

    FLEX 系统管理器 SystemManager

    首先是Application对象的实例化,接着初始化Application的SystemManager。在初始化过程中,预初始化事件被派发,然后调用createChild()方法创建所有应用组件。初始化事件被派发,表明所有组件准备就绪。...

    flex 模块化modules源码例子

    4. **模块生命周期**:Flex模块有其特定的生命周期,包括加载、初始化、显示和卸载阶段。开发者需要理解这些阶段,以便正确处理模块的加载事件和状态变化。 5. **模块间的通信**:Flex模块可以通过事件、回调函数、...

    Flex3组件和框架的生命周期

    **Flex应用程序的初始化阶段** 初始化阶段主要负责配置应用程序的基础环境,包括加载外部资源、初始化外部接口等。这个阶段还会调用`createChildren()`方法,用于创建子组件实例。 **Flex应用程序的预加载阶段** ...

    LXF.zip_flex

    4. 初始化地图:在Flex的初始化事件中,使用API密钥初始化地图组件,并加载地图。 5. 功能扩展:通过API提供的方法,可以添加标记、绘制路径、设置信息窗口等,增强地图的功能性和互动性。 四、实例演示 以下是一个...

    LoadXML.rar_flex

    "LoadXML.rar_flex"这个压缩包文件很可能包含了一个Flex项目,该项目着重于如何加载XML文件并从中提取数据,以便进行程序初始化。以下是关于Flex加载XML及初始化程序的相关知识点。 1. **Flex与XML的结合**: Flex...

    Flex解决乱码问题

    这段代码中的`initialize`属性指定了初始化事件处理器,在该处理器中设置`useCodePage`为`true`,使得Flex应用能够正确地处理Unicode编码。 #### 2. 服务器端编码设置 除了客户端的配置之外,还需要确保服务器端的...

    理解Flex3的组件和框架的生命周期

    ##### 4.2 Flex 应用程序的初始化阶段 初始化阶段是应用程序启动后的第一个关键步骤。在这个阶段,Flex 框架会对应用程序进行初步的配置,并准备执行其他后续操作。 **示例代码**: ```as public function ...

    使用FLEX 和 Actionscript开发FLASH 游戏(一)

    - `creationComplete`事件在应用程序初始化完成后触发,适合在此时执行一些初始化操作。 - `enterFrame`事件则会在每一帧渲染前触发,这对于游戏循环非常关键,你可以在该事件处理函数中更新游戏状态和绘制下一帧...

    flex拍照案例,java后台保存照片

    - 通过 `&lt;mx:Application&gt;` 标签创建 Flex 应用程序。 - 使用 `&lt;mx:Style&gt;` 定义样式,如字体大小等。 - `&lt;mx:Script&gt;` 包含脚本逻辑,负责处理相机操作和图像处理。 - **初始化应用程序**: - `initApp()` ...

    Flex 时间问题

    `creationCompleteHandler`函数在应用创建完成后被调用,这里初始化了一个每秒触发一次的`Timer`。 `startTimer`和`stopTimer`函数分别用于启动和停止计时器。`timeTransform`函数接收起始时间和当前计数,计算并...

    Flex-jsp两个必要jar包

    这个jar包的核心功能是初始化Flex的SWF加载器,它负责在浏览器中加载Flex应用程序的SWF文件,并且处理与服务器的AMF(Action Message Format)通信,这是一种高效的数据交换协议,用于在Flex客户端和Java服务器之间...

    MapABC Flex API 示例 代码 用户手册 开发包

    - **地图初始化**:如何加载地图,设置初始位置和级别。 - **图层操作**:如何添加、删除和切换地图图层,如卫星图、地形图等。 - **标记与图例**:如何在地图上添加自定义图标作为标记,以及创建图例来解释地图...

    将 Flex 集成到 Java EE 应用程序的最佳实践(完整源代码)

    HttpFlexSession 是 BlazeDS 提供的一个 Listener,负责监听 Flex 远程调用请求,并进行一些初始化设置: 清单 4. 定义 Flex Listener &lt;listener&gt; &lt;listener-class&gt;flex.messaging.HttpFlexSession...

    NetBackup 8.3.0.1 Application Guide for Flex Appliance 2.0.1.pdf

    - 安装NetBackup管理控制台和客户端软件包是初始化过程的关键步骤,确保用户可以管理和监控备份环境。 4. **创建NetBackup应用实例** - 实例创建是NetBackup配置的核心部分,包括主服务器实例、媒体服务器实例和...

    +Flex+集成到+Java+EE+应用程序的最佳实践(完整源代码)

    HttpFlexSession 是 BlazeDS 提供的一个 Listener,负责监听 Flex 远程调用请求,并进行一些初始化设置: 清单 4. 定义 Flex Listener &lt;listener&gt; &lt;listener-class&gt;flex.messaging.HttpFlexSession...

Global site tag (gtag.js) - Google Analytics