FlexEvent.APPLICATION_COMPLETE never called in simple app

Question

Hello, I've got a really simple flex application, with a main file Rec.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="215" minHeight="138" width="215" height="138" backgroundAlpha="0.0">

 <fx:Script>
  <![CDATA[
   var rec:LRec = new LRec();
  ]]>
 </fx:Script>

 <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
</s:Application>

And an AS3 class:

package
{
 import mx.core.Application;
 import mx.events.FlexEvent;

 public class LRec extends Application
 {

  public function LRec()
  {
   trace("CONSTRUCTED"); 
   addEventListener(FlexEvent.APPLICATION_COMPLETE, this.mainInit); 
  }

  /**
   * After the application startup is complete, debug
   */
  public function mainInit(event:FlexEvent):void {
   trace("COMPLETE");
  }
 }
}

The trace ("CONSTRUCTED") is printed, but not "COMPLETE" -- it looks like the FlexEvent.APPLICATION_COMPLETE event is never registering. Any ideas why?

Also, this is the first time I've really done this sort of programming, so if anything else looks wrong, please tell me!

Answer 1

I've updated your code below with some comments on where you were going wrong. If you have any other questions feel free to ask.

Test.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="215" minHeight="138" width="215" height="138" backgroundAlpha="0.0"
    initialize="handle_initialize(event)"
>

    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;

            // Probably want to keep your rec object around
            private var rec:LRec;

            // Construct your LRec instance in the Application's inititialize state,
            // rather than declaring it statically.
            protected function handle_initialize(event:FlexEvent):void
            {
                // Construct a new LRec instance, assign it to our private variable.
                this.rec = new LRec();

                // The <s:Applicaiton instance we define in this mxml is the object that 
                // will actually dispatch the applicationComplete event, so we want to
                // listen for that here and pass it on to our LRec instance's mainInit 
                // method when it fires.
                this.addEventListener(FlexEvent.APPLICATION_COMPLETE, this.rec.mainInit);
            }
        ]]>
    </fx:Script>

    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
</s:Application>

LRec.as

package
{
    import mx.events.FlexEvent;

    // Don't inherit from Application, as you've already defined your application
    // in your mxml, and you should have only one Application instance per application.
    public class LRec
    {

        public function LRec()
        {
            trace("CONSTRUCTED");

            // Doesn't need the event listener anymore.

            // Do any instantiation needed.
        }

        /**
         * After the application startup is complete, debug
         */
        public function mainInit(event:FlexEvent):void {
            trace("COMPLETE");

            // Do any of the work that needs to wait for the applicationComplete
            // event to fire.
        }
    }
}

Here's a good article (though a bit dated) on the Flex Instantiation Model.