Flex Custom component Life cycle

Question

1) preInitialize: This event is raised when the component has just been created but none of the child components exist.

2) initialize: This event is raised after the component and all its children have been created but before any dimensions have been calculated.

3) creationComplete: This even is dispatched after all the component and its children have been created and after all the layout calculations have been performed.

4) applicationComplete: Dispatched after all the components of an application have been successfully created

My Questions Here

1. Lets suppose i create a button component, what are the child components then? Can anyone explain me in depth on the Child components of a component.

2. Can anyone show me an example of code, where a component is a created.. i mean a custom component from scratch.

Answer 1

The Flex SDK source code is your friend. View it here:

http://opensource.adobe.com/svn/opensource/flex/sdk/tags/3.5.0.12683/frameworks/projects/framework/src

(You can also access the source code to any framework class by pressing CTRL-SHIFT-T in Flash Builder and then typing the name of the framework component you want to open).

1. Take a look at mx.controls.ComboBase which is the superclass of mx.controls.ComboBox. Its createChildren() method creates several children, including a border, arrow button and text input. The dropdown (which shows the item in ComboBox.dataProvider) is defined in ComboBox and created / destroyed dynamically, so it is not created in createChildren.

2. All of these classes are good examples, although sometimes the implementation could be cleaner. Simple components like Button, CheckBox and RadioButton are a good place to start.

Answer 2

I am going to Explain the 3 phases of the Component Life cycle:

1. Birth
2. Life

3. Death

   • 1.Birth:

     ==>application instantiation
     ==>Create Properties, sizing
     ==>Add children

• 2.Life

     ==>Validate and Invalidate Properties and sizes
     ==>Update list
        commitProperties(), measure(), and updateDisplayList().

      This is the way the functions communicate:

      invalidateProperties() –> commitProperties()‏
      invalidateSize() –> measure()‏
      invalidateDisplayList() –> updateDisplayList()‏

• 3.Death

    ==>Removing Children: removeChild(), removeAllChildrens()
    ==>Garbage Collection: Collecting memory

A broad overview of the component lifecycle is as follows...

1. The constructor is called and initial properties are set.
2. The preinitialize event is dispatched.
3. The createChildren() function is called.
4. The initialize event is dispatched.
5. The commitProperties() function is called.
6. The measure() function is called (if necessary).
7. The layoutChrome() function is called (very rare and will not be covered in this post).
8. The updateDisplayList() function is called.
9. The creationComplete event is dispatched.
10. The updateComplete event is dispatched.