Where does "new" fit in the flex creation cycle?

In the following code, the call to myChild.bar() results in an exception because myChild is null. myParent is a valid object. What I don't understand is why myChild has not been created yet.

I have read the following document related to object creation sequence, but I am unsure how "new" is related: http://livedocs.adobe.com/flex/3/html/help.html?content=layoutperformance_03.html

Any help is appreciated!

// Main.mxml

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="created()">
    <mx:Script>
        <![CDATA[
            public var myParent:Parent = new Parent();
            public function created():void {
                myParent.foo();
            }
        ]]>
    </mx:Script>
</mx:Application>

// Parent.mxml

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*">
    <mx:Script>
        <![CDATA[
            public function foo():void {
                myChild.bar();
            }
        ]]>
    </mx:Script>
    <Child id="myChild"/>
</mx:Canvas>

// Child.mxml

<mx:Canvas xmlns:mx="http://开发者_运维问答www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
             public function bar():void {
                trace("Hello World");
            }
        ]]>
    </mx:Script>    
</mx:Canvas>

creationComplete fires when an object and all its child elements are created and drawn to the screen. Since your parent object is created with

public var myParent:Parent = new Parent();

it is not a child of your main object and the creationComplete event fires before myParent is initialized.

In fact, myParent.myChild will remain null until something causes myParent to initialize. You can cause this by adding it to a component on screen or you could just call myParent.initialize();

Flex is a visual display / UI framework. It is designed to keep a display list of UI items and handle various updates the items in the display list.

The problem is that you have never added your Parent component to the display list. This is done with the AddChild method in the Flex 2/3 Halo architecture or AddElement if you're using the Flex 4 Spark architecture.

Once you add the Parent component to the stage using the AddChild method, that component will start stepping through the component lifeCycle which includes creating it's Children (via createChildren() method), and sizing and positioning the children (via updateDisplayList() ). When defining a component and child via MXML--as an example your Parent.mxml file defines the Child class as a child using XML--the addChild method call is done "automagically" in the background.

Keep in mind that the Flex Component LifeCycle is a process and may not be immediate. If you perform an addChild on the parent; you may not be able to immediately access that parent's children on the next line.

So, the new keywords creates a new instance of the component; but it does not put that component onto the displayList for processing by the Flex Framework layout managers.

One way to rectify the situation might be this change to your main application file:

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="created()">
    <mx:Script>
        <![CDATA[
            public function created():void {
                myParent.foo();
            }
        ]]>
    </mx:Script>
    <parent:Parent id="myParent" />
</mx:Application>

Another might be this:

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="created()">
    <mx:Script>
        <![CDATA[
            public var myParent:Parent = new Parent();
            public function created():void {
                myParent.foo();
            }
            override protected function createChildren():void{
                super.createChildren();
                this.addChild(myParent);
            }

        ]]>
    </mx:Script>
</mx:Application>

For some good reading about this stuff, read through the Flex Component LifeCycle docs. http://livedocs.adobe.com/flex/3/html/ascomponents_advanced_2.html#204762