11.4 The Document Timeline

 <  Day Day Up  >  

We've now created two classes ( A and B ) and a Flash document that will use them ( AppName.fla ). Let's see exactly how AppName.fla loads the classes and invokes the class method A.main( ) , which starts our application.

In Chapter 2, we learned that the fundamental metaphor of a Flash document is the timeline, which can be used to create animations like a filmstrip. When used for animation, the frames in the timeline are displayed in rapid linear succession by the Flash Player. However, the timeline can also be used to create a series of application states, in which specific frames correspond to specific states and frames are displayed according to the application's logic, not linearly (according to the passing of time).

In our example application framework, we'll use the timeline of AppName.fla to create two basic application states: loading and main . Each state is implemented by pausing the playhead in a corresponding labeled frame. On the frame labeled loading , we display a loading message while our application's classes load. On the frame labeled main , we invoke A.main( ) , which starts the application.

Using frames as application states is a common practice for creating Flash applications (both OOP and non-OOP). While the practice definitely works and is widespread, it can also be awkward to work with and generally feels unfamiliar to programmers coming from other languages. To address this situation, Flash MX Professional 2004 introduces a Visual Basic-style forms-based development feature called Screens, which is not covered in this book. For information on developing applications with Screens, see Help Using Flash Working with Screens (Flash Professional only).


To load our A and B classes, we'll follow these general steps:

  1. Specify the export frame for classes in the movie.

  2. Add the labeled state frames loading and main to AppName.fla 's timeline.

  3. Add code that displays a loading message while the movie loads.

The specific procedures for those three steps are listed next . If you've already read Chapter 5 you'll have seen some of these procedures before.

To specify the export frame for classes in the movie, follow these steps:

  1. Open AppName.fla in the Flash authoring tool.

  2. Choose File Publish Settings.

  3. In the Publish Settings dialog box, on the Flash tab, next to the ActionScript Version, click Settings.

  4. In the ActionScript Settings dialog box, for the Export Frame for Classes option, enter 10 . The choice of frame 10 is arbitrary, but the specified frame must come after the code that displays the loading message (i.e., after the preloader).

  5. Click OK to confirm the ActionScript settings.

  6. Click OK to confirm the publish settings.

To add the labeled state frames loading and main to AppName.fla 's timeline, follow these steps:

  1. In AppName.fla 's main timeline, double-click Layer 1 and rename it to scripts . We'll place all our code on the scripts layer. As a best practice, you should keep all your timeline code in the scripts layer, which should be the topmost layer in your timeline. The scripts layer should contain only scripts, not movie clips or other content. Some developers call the layer actions instead of scripts , but the premise is the same.

  2. In the main timeline of AppName.fla , select frame 15 of the scripts layer.

  3. Choose Insert Timeline Keyframe (F6).

  4. Choose Insert Timeline Layer.

  5. At frames 4 and 15 of the labels layer, add a new keyframe (Insert Timeline Keyframe or F6). Just as the scripts layer holds all our scripts, the labels layer is used exclusively to hold frame labels. Frame labels are a convenient , human-friendly way to refer to frames instead of referring to frames by number.

  6. With frame 4 of the labels layer selected, in the Properties panel, under Frame, change <Frame Label> to loading .

  7. With frame 15 of the labels layer selected, in the Properties panel, under Frame, change <Frame Label> to main .

Next, follow these steps to add code that displays a loading message while the movie loads:

  1. At frame 5 of the scripts layer, add a new keyframe (Insert Timeline Keyframe or F6).

  2. With frame 5 of the scripts layer selected, enter the following code into the Actions panel (F9):

     if (_framesloaded == _totalframes) {   gotoAndStop("main"); } else {   gotoAndPlay("loading"); } 

  3. With frame 1 of the scripts layer selected, enter the following code into the Actions panel:

     this.createTextField("loadmsg_txt", 0, 200, 200, 0, 0); loadmsg_txt.autoSize = true; loadmsg_txt.text = "Loading...Please wait."; 

  4. With frame 15 of the scripts layer selected, enter the following code into the Actions panel:

 loadmsg_txt.removeTextField( ); 

We've now provided the basic timeline structure that loads our application's classes. All that's left is to start the application by invoking A.main( ) . We do that on the frame labeled main in AppName.fla . Add the following code to the end of the script on frame 15 (i.e., just below loadmsg_txt.removeTextField( ); ):

 import com.somedomain.A; A.main( ); 

In theory, that will be the last change we ever make to AppName.fla , unless we want to include components , sounds, or custom graphics. Any code in our application will reside in a class that's referenced either directly by A.main( ) or indirectly by a class referenced in A.main( ) . We won't place any more code in AppName.fla .

Our application is complete. We now need to test that everything works. To do that, we need to export a .swf file and run it in the Flash Player.

 <  Day Day Up  >  


Essential ActionScript 2.0
Essential ActionScript 2.0
ISBN: 0596006527
EAN: 2147483647
Year: 2004
Pages: 177
Authors: Colin Moock

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net