Flex组件实例化的生命周期

新手必须掌握的内容。节选自 Adobe 的官方文档. 原文地址

组件的生命周期描述了通过组件类来创建组件对象的一系列步骤。在这个过程中Flex会自发调用组件的某些方法、派发一些事件并使组件显现出来。

下面的例子创建一个 Button 并将其添加至容器：

// 创建 Box 容器. 
var boxContainer:Box = new Box(); 

// 配置该 Box 容器

// 创建 Button 控件
var b:Button = new Button() 
// 配置该 Button 控件
b.label = "Submit"; 
... 

// 向 Box 容器添加 Button 控件
boxContainer.addChild(b);

下面分步解析代码的执行过程:

1. 调用组件的构造函数，代码如下:

// 创建一个 Button 控件
var b:Button = new Button()

2. 配置组件，为组件的属性赋值，代码如下:

// 配置该 Button 控件
b.label = "Submit";

在这里组件的setter方法可能会调用invalidateProperties(), invalidateSize(), 或 invalidateDisplayList() 方法

3. 调用 addChild() 方法添加组件到其上层，代码如下:

// 添加 Button 控件至 Box 容器
boxContainer.addChild(b);

接下来， Flex 会:

4. 设置控件的 parent 属性为其父容器。

5. 设定组件的样式

6. 在组件上派发 preinitialize 事件

7. 调用组件的 createChildren() 方法。

8. 调用 invalidateProperties(), invalidateSize(), 和 invalidateDisplayList() 方法，这些方法的调用使得下次 render 事件触发 commitProperties(), measure(), 或 updateDisplayList() 方法的执行。唯一的例外是如果用户设置了组件的 height 和 width 属性后，Flex 将不会调用 measure() 方法。

9. 在组件上派发 initialize 事件。此刻，组件的子部都已完成初始化，但尚未被设定大小及布局。您可以籍此事件对组件在展示前做某些额外处理。

10. 在父容器上派发 childAdd 事件。

11. 在父容器上派发 initialize 事件

12. 下次 render 事件发生期间，Flex 会:
　a. 调用组件的 commitProperties() 方法;
　b. 调用组件的 measure() 方法;
　c. 调用组件的 layoutChrome() 方法;
　d. 调用组件的 updateDisplayList() 方法;
　e. 大多数情况下13和14不是必须步骤，这样会在组件上派发 updateComplete 事件

13. 如果在 commitProperties(), measure(), 或 updateDisplayList() 方法内部调用了 invalidateProperties(), invalidateSize(), 或 invalidateDisplayList() 方法，Flex 会派发额外的 render 事件。

14. 在最后一个 render 事件过后，Flex 会:
　a. 设置组件的 visible 属性为 true ，呈现组件;
　b. 在组件上派发 creationComplete 事件。组件兼具了的尺寸和布局。 creationComplete 事件只在组件创建时派发唯一的一次。
　c. 在组件上派发 updateComplete 事件。而且之后无论何时，只要组件的布局、位置、大小或其它视觉特性发生的改变而导致了组件显示的更新，Flex都会派发额外的 updateComplete 事件。

在组件被放到某个具体的容器中之前，Flex无法确定组件的尺寸，样式以及如何在屏幕上绘制。基于此，组件绝大部分的配置工作都是在通过 addChild() 方法将其添加到容器时才完成的。

如果用 MXML 也可以，代码如下:

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:s="library://ns.adobe.com/flex/spark"> 
    <mx:Box> 
        <mx:Button label="Submit"/> 
    </mx:Box> 
</s:Application>

执行步骤上，MXML 和 ActionScript 没有什么区别。

可以通过容器上的 removeChild() 方法来移除一个组件。组件一旦没有被引用，它最终会被 Flash Player 或 AIR 的垃圾回收机制从内存中清除。