Switch On The Code RSS Button - Click to Subscribe
Aug
9

Flex Snippet Tutorial - Application Creation Life Cycle Events

There are many times when I don't remember exactly when application startup events are fired in Flex. I figured this probably happens to other people so why not write a small post about what life cycle events are fired when? Hopefully after this short tutorial you will have a good idea of when particular life cycle events are fired.

First lets go over what events there are for an application creation life cycle. These include preinitialize, initialize, creationComplete, and applicationComplete. Below is a diagram that explains when each happens and shows the order.


Application Creation Life Cycle Events

Also below is a sample application that shows the four application life cycle events and when they occurred after the start of the application. You can always grab the code for this sample by right clicking the example.


Looking at the code below we see that all that is done in the example is that when each event is fired I call a small function. This function, recordEvent, takes in a FlexEvent and adds some text to our report string. Also you see that not only is a little bit of text added, the time from flash.utils.getTimer() is printed. This getTimer() function returns the amount of milliseconds that have gone by since the start of the application. So what we get printed out is event.type and the time at which the event occurred.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  layout="absolute" width="349" height="319"
  viewSourceURL="../files/LifeCycleEventsTutorial.mxml"
  preinitialize="recordEvent(event)"
  initialize="recordEvent(event)"
  creationComplete="recordEvent(event)"
  applicationComplete="recordEvent(event)">

  <mx:Script>
    <![CDATA[
      import mx.events.FlexEvent;
      import flash.utils.getTimer;
     
      [Bindable]
      private var reportTxt:String = "";
     
      private function recordEvent(event:FlexEvent):void
      {
        reportTxt += (event.type + " event occured at "
          + flash.utils.getTimer() + "ms" + "\n");
      }
    ]]>
  </mx:Script>

  <mx:Panel x="0" y="0" width="349" height="319"
    layout="absolute" title="Life Cycle Events">

    <mx:TextArea x="10" y="10" width="309" height="259"
      editable="false" id="txtReport" text="{reportTxt}"/>

  </mx:Panel>
</mx:Application>

Now once the last event applicationCreation is fired all other events can start firing, such as click events and so on. Understanding how the application is created is an important aspect to any program but it is especially so in Flex because of its event driven nature.

I hope this quick run through helps you out when trying to figure out what starup event(s) you should hook into. If you would like more info on these check out the Adobe livedocs and a special thanks to Ted Patrick, who has great info on all aspects of Flex.



Posted in Flex, All Tutorials by The Fattest |

Leave a Comment

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.

Powered by WP Hashcash