• home
  • forum
  • my
  • kt
  • download
  • Loading External Symbols During Playback

    Author: 2007-06-13 14:45:34 From:

    Introduction

    If you want to create flash 5 movies that contain dynamic content (i.e. are different each time they are viewed) then there are two major approaches to take:

    1. Use Macromedia generator extensions:

    Generator extensions allow you to compile flash movies at download-time, making it possible to completely customize the content that is downloaded to a browser. For more information on generator check the Macromedia support site.

    2. Dynamically load in symbols from external libraries during playback:

    The idea is that you create a main flash movie that loads and plays other flash movies during playback. For various reasons you may wish to make several movie-clips available form within the library, then have the main movie choose which of these movie-clips to playback. Techniques for achieving this are described in this tutorial.

    Steps

    Before diving into a step-by-step example, let's explore what we're going to achieve:

    1. We'll create a SWF movie that contains three simple movies in its library. This file acts as a library containing the movies that we want to dynamically load.
    2. We'll create a main SWF file that will load in the external library and it's symbols, then display them on-stage.

    Step 1 - Creating a library movie

    Open a new flash project (any stage-size will do) and perform the following steps:

    1. Choose Insert> New Symbol. Give it the name "box" and type "movie clip".
    2. Draw a box (any size).
    3. Choose Insert> New Symbol. Give it the name "circle" and type "movie clip".
    4. Draw a circle (any size).
    5. Choose Insert> New Symbol. Give it the name "line" and type "movie clip".
    6. Draw a diagonal line (any size).

    We now have three new library symbols - each are movie clips. In order for these movie clips to be loaded (or "attached") dynamically, we need to add linkage names to these symbols.

    Note: Whilst all library symbols can be export and linked to, only Movie-Clips can be accessed by ActionScript to dynamically load symbols. For this reason, all dynamically loaded symbols must be Movie-Clips. If you want to put a graphic (JPG, etc.) in your library, then put the graphic into an empty movie-clip, and export the movie-clip.


    To export your library's movie clips, open up the library panel (Window> Library) and:

    1. Select the box symbol in the library list, right click and choose Linkage.
      Choose Export this symbol and type "box" into the Identifier field.
    2. Select the circle symbol in the library list, right click and choose Linkage.
      Choose Export this symbol and type "circle" into the Identifier field.
    3. Select the line symbol in the library list, right click and choose Linkage.
      Choose Export this symbol and type "line" into the Identifier field.
    Note: It is crucial that you export symbols that you want to use from external movies. The linkage identifiers you give symbols are the names that these symbols are given when your work is published to a SWF movie. The names given to symbols in the library window are for authoring purposes only - they are not available to ActionScript

    Lastly - save the movie as "library.fla" and then publish it to "library.swf". Pressing Shift+F12 is a good shortcut to publish your flash movie.

    Step 2 - Create the main movie

    First we'll create a place holder into which the library will be loaded.

    1. Open a new flash project.
    2. Choose Insert> New Symbol (or press F8). Name it "Empty" and click OK.
    3. Draw a box (or whatever you like - it really doesn't matter) so that you'll be able to see the movie clip.
    4. Go back to the main stage (click Scene 1 above the timeline).
    5. Open the library window (Window> Library) drag the "Empty" movie onto the stage.
    6. Open the "Instance" panel (Window> Panels> Instance) and give the instance the name "placeHolder". The name is case sensitive.
    Note: The place holder is crucial. In the next step you'll use the loadMovie command on the place holder. The loadMovie command replaces whatever movie-clip it is executed on - so without a place holder the entire main movie would be replaced.

    Add ActionScript to load the library.

    1. Create a new layer in the timeline and name it "Actions".
    2. Right click on the first frame of the "Actions" layer and from the menu choose Actions.
    3. In the actions panel, add the following code:
    placeHolder.loadMovie("library.swf");
    

    Add ActionScript to wait until the library has been loaded.

    Since it takes time for library.swf to download, we need to loop through some frames until the library has completely loaded, since the symbols contained in the library will not be available until downloading is complete. While it would be nice to put a proper loader in here, for brevity we'll do the minimum and just make the play-head loop over frames 2 & 3 until the library is loaded.

    Once the library has been loaded we'll use the attachMovie command to load the symbols onto the stage.

    1. Create a blank keyframe in frame 3 of the Actions layer. Clicking on frame 3 and pressing F6 should do the trick.
    2. Extend the last frame on Layer1 to frame 3. Clicking on Layer1's frame 3 and pressing F5 will achieve this.
    3. In the Actions panel (for frame 3 of the Actions layer) type:
    if(placeHolder.getBytesLoaded() < placeHolder.getbytesTotal()) {
     prevFrame();
     play();
    } else {
     placeHolder.attachMovie("line","myLine",2);
     placeHolder.attachMovie("circle","myCircle",3);
     placeHolder.attachMovie("box","myBox",4);
     placeHolder.myLine._x = -20;
     placeHolder.myCircle._y = 20;
     stop();
    }

    Play the movie (CTRL + Enter). You should see the line, the box and the circle loaded on the stage.

    How it works...

    The library's symbols cannot be attached directly to the main movie's stage :- they can only be accessed from the library's main timeline. When we load the library movie into the placeHolder instance, we essentially enable ActionScript to access the exported symbols via the library.

    Note: Because the library's main timeline is always loaded, its a good idea to keep the library's stage empty so that you can load any symbol onto it. This is a guide line though, not a rule.

    Put another way, the main movie itself can never attach to external library symbols.
    The main movie can, however, load another movie's main timeline as if it where a movie-clip instance.
    We use this fact to fool ActionScript - we load the library into the place holder, then load the library's symbols onto the library's stage - with the library's stage itself being a movie clip on the main stage.

    Note: If you want to load symbols onto different levels/clips, then you'll need to repeat the above process for each level/clip that you want to do this on. In other words, load the library into a placeholder on each level and then attach the appropriate symbol to that place holder.

    Tips, tricks and pitfalls...

    You can use the above technique to load multiple libraries. My application for this was to load an XML file from an IIS server that instructed the main movie which libraries to load to display the correct icons for a user. The applications for this are endless.

    When using this technique, be aware that the play-head of timeline on which the ActionScript resides must move in order for commands like loadMovie and attachMovie to work correctly. For example, if you call loadMovie, then loop (in a while(...) statement) until loaded and then call attachMovie all in the same frame, you often get unexpected results.

    As with all flash authoring, ActionScript programming is time-based, not procedural. Always sculpt your script to work with the play-head - remember that the play-head controls the scripting, not vice-versa!

    Enjoy!

    » Level Advanced

    Added: : 2001-10-29
    Rating: 8.53 Votes: 102
    Hits: 6174
    » Author
    No details avialable.
    » Download
    Download the files used in this tutorial.
    Download (4 kb)

    discuss this topic to forum

    relation tutorial

    No relevant information

    Category

      3D (20)
      Math Physics (14)
      3rd Party (5)
      Navigation (60)
      Actionscripting (26)
      Optimization (16)
      Animation (32)
      Projector (9)
      Audio (46)
      Special Effects (112)
      Backend (25)
      Text Effects (65)
      Drawing (18)
      Tips and Techniques (41)
      Dynamic Content (25)
      Tricks (6)
      Games (66)
      Utilities (19)
      Getting Started (71)
      Video (10)
      Interactivity (21)
      Web Design (22)

    New

    Hot