Flash CS3 Documentation

Learning ActionScript 2.0 in Adobe Flash > Working with Images, Sound, and Video > Loading external SWF and image files

Loading external SWF and image files

To load a SWF or image file, use the loadMovie() or loadMovieNum() global function, the loadMovie() method of the MovieClip class, or the loadClip() method of the MovieClipLoader class. For more information on the loadClip() method, see MovieClipLoader.loadClip() in the ActionScript 2.0 Language Reference.

For image files, Flash Player 8 and later support the JPEG (progressive and non-progressive) image file type, GIF images (transparent and non-transparent, although only the first frame of an animated GIF will be loaded), and PNG files (transparent and non-transparent).

To load a SWF or image file into a level in Flash Player, use the loadMovieNum() function. To load a SWF or image file into a movie clip target, use the loadMovie() function or method. In either case, the loaded content replaces the content of the specified level or target movie clip.

When you load a SWF or image file into a movie clip target, the upper-left corner of the SWF file or image is placed on the registration point of the movie clip. Because this registration point is often the center of the movie clip, the loaded content might not appear centered. Also, when you load a SWF file or image to a root timeline, the upper-left corner of the image is placed on the upper-left corner of the Stage. The loaded content inherits rotation and scaling from the movie clip, but the original content of the movie clip is removed.

You can optionally send ActionScript variables with a loadMovie() or loadMovieNum() call. This is useful, for example, if the URL you're specifying in the method call is a server-side script that returns a SWF or image file according to data passed from the Flash application.

When you use the global loadMovie() or loadMovieNum() function, specify the target level or clip as a parameter. The following example loads the Flash application contents.swf into the movie clip instance named image_mc:

loadMovie("contents.swf", image_mc);

You can use MovieClip.loadMovie() to achieve the same result:

image_mc.loadMovie("contents.swf");

The following example loads the image1.jpg JPEG image into the image_mc movie clip instance:

image_mc.loadMovie("http://www.helpexamples.com/flash/images/image1.jpg");

For more information about loading external SWF and image files, see About loading SWF files and the root timeline.

To preload SWF and JPEG files into movie clip instances, you can use the MovieClipLoader class. This class provides an event listener mechanism to give notification about the status of file downloads into movie clips. To use a MovieClipLoader object to preload SWF and JPEG files, you must complete the following:

Create a new MovieClipLoader object You can use a single MovieClipLoader object to track the downloading progress of multiple files or create a separate object for each file's progress. Create a new movie clip, load your contents into it, then create the MovieClipLoader object as shown in the following code:

this.createEmptyMovieClip("img_mc", 999);
var my_mcl:MovieClipLoader = new MovieClipLoader();

Create a listener object and create event handlers The listener object can be any ActionScript object, such as a generic Object object, a movie clip, or a custom component.

The following example creates a generic listener object named loadListener and defines for itself onLoadError, onLoadStart, onLoadProgress, and onLoadComplete functions:

// Create listener object:
var mclListener:Object = new Object();
mclListener.onLoadError = function(target_mc:MovieClip, errorCode:String, status:Number) {
    trace("Error loading image: " + errorCode + " [" + status + "]");
};
mclListener.onLoadStart = function(target_mc:MovieClip):Void {
    trace("onLoadStart: " + target_mc);
};
mclListener.onLoadProgress = function(target_mc:MovieClip, numBytesLoaded:Number, numBytesTotal:Number):Void {
    var numPercentLoaded:Number = numBytesLoaded / numBytesTotal * 100;
    trace("onLoadProgress: " + target_mc + " is " + numPercentLoaded + "% loaded");
};
mclListener.onLoadComplete = function(target_mc:MovieClip, status:Number):Void {
    trace("onLoadComplete: " + target_mc);
};

Register the listener object with the MovieClipLoader object In order for the listener object to receive the loading events, you must register it with the MovieClipLoader object, as shown in the following code:

my_mcl.addListener(mclListener);

Begin loading the file (image or SWF) into a target clip To start downloading an image or SWF file, you use the MovieClipLoader.loadClip() method, as shown in the following code:

my_mcl.loadClip("http://www.helpexamples.com/flash/images/image1.jpg", img_mc);

The following example uses the setProgress() method of the ProgressBar component to display the downloading progress of a SWF file. For more information, see ActionScript 2.0 Components Language Reference.

To display downloading progress by using the ProgressBar component:

1. Create a new Flash document, and save it as progress.fla.
2. Open the Components panel (Window > Components).
3. Drag a ProgressBar component from the Components panel to the Stage.
4. In the Property inspector (Window > Properties > Properties), name the ProgressBar component my_pb.
5. Select Frame 1 in the Timeline, and open the Actions panel (Window > Actions).
6. Add the following code to the Actions panel:

   var my_pb:mx.controls.ProgressBar;
   my_pb.mode = "manual";
   
   this.createEmptyMovieClip("img_mc", 999);
   
   var my_mcl:MovieClipLoader = new MovieClipLoader();
   var mclListener:Object = new Object();
   mclListener.onLoadStart = function(target_mc:MovieClip):Void {
       my_pb.label = "loading: " + target_mc._name;
   };
   mclListener.onLoadProgress = function(target_mc:MovieClip, numBytesLoaded:Number, numBytesTotal:Number):Void {
       var pctLoaded:Number = Math.ceil(100 * (numBytesLoaded / numBytesTotal));
       my_pb.setProgress(numBytesLoaded, numBytesTotal);
   };
   my_mcl.addListener(mclListener);
   my_mcl.loadClip("http://www.helpexamples.com/flash/images/image1.jpg", img_mc);
   

7. Test the document by selecting Control > Test Movie.

   The image loads into the movie img_mc clip.

8. Select File > Publish > Formats, and make sure the SWF and HTML options are selected.
9. Click Publish and find the HTML and SWF files on your hard disk.

   They're in the same folder as progress.fla that you saved in step 1.

10. Double-click the HTML document to open it in a browser and see the progress bar animate.

    NOTE

    When you load files in the test environment, make sure you load an uncached file from the Internet and not a local file if you want to see the progress bar work. A local file loads too quickly to see the progress. Alternatively, upload your SWF file and test your document on a server.

For related information, see About loading SWF files and the root timeline. For more information on the MovieClipLoader class, see MovieClipLoader in the ActionScript 2.0 Language Reference. For information on creating a progress bar animation, see Creating a progress animation for loading SWF and image files.

For samples of photo gallery applications, see the Flash Samples page at www.adobe.com/go/learn_fl_samples. Download the Samples zip file and navigate to the ActionScript2.0/Galleries to access these samples:

• gallery_tree.fla
• gallery_tween.fla

These files provide examples of how to use ActionScript to control movie clips dynamically while loading image files into a SWF file.

Flash CS3