• home
  • forum
  • my
  • kt
  • download
  • Preload External Flash Movies using Movie Clips

    Author: 2007-06-06 16:40:20 From:

    This tutorial shows you an easy way to load one Flash Movie into another. This loads the external Flash SWF Movie into a Movie Clip with the help of the Progress Bar Component. Loading a Movie into an MC means that you can address the Movie Clip in the ActionScript and change the Movie Clips properties. This MC includes the external swf file so any change that you impose on the Movie Clip also changes the external Movie nested within.

    Cross Ref: There are many other Flash Pre-Loader tutorials including several which cover loading external Flash Movies and loading multiple external Flash Movies. To ensure that you are following the right tutorial for your needs, you may wish to read a brief description of each: Preloader Tutorial Listings

    Example: Download the Flash file  Int 152a

    Step One: Setting up the Movie

    1. Open a new: Flash Movie
    2. Set the Movie to a size large enough to hold the externally loaded swf Movie. Mine is: 185 x 125 px
    3. In the Timeline use the Insert Layer button to add 1 layers so you have a total of: 2 Layers
    4. Rename Layer 1 to: ActionScript
    5. Rename Layer 1 to: Progress Bar

      You should now see this in the Timeline:

    Set Two: Setting up the Progress Bar

    1. Select Frame 1 or the Layer: Progress Bar
    2. Open the Component Panel: Window > Components (Ctrl F7)


      The Components in Flash 8 Basic.

    3. Drag onto Stage the:
    4. Centre the: Progress Bar


      The Progress Bar centred on Stage.

    5. If the Property Inspector is closed, open it: Window > Properties (Ctrl F3)
    6. Give the Progress Bar the Instance Name: myProgressBar


      The Progress Bar has the Instance Name: myProgressBar

      Warning: Instance Names are case sensitive.

    7. Right click (Mac: Ctrl click) on Frame 2 and select: Insert Frame (not Keyframe)
    8. Lock the Layer:

    Step Three: The Actions - Frame 1

    1. Select Frame 1 of the Layer: ActionScript
    2. Add this code (if you wish leave out the gray comments):

      // Create a new Object. The Progress Bar is an object so needs an object function to work
      myProgressBarListener = new Object();

      /* Create a listener object event function. When the Progress Bar is complete and has preloaded this Movie, the listener will call and run this code below:   */
      myProgressBarListener = function (eventObject) {

      // Hide the Progress Bar - we don¡¯t need it any more as the Movie has now loaded
      myProgressBar._visible = false;

      // Remove the listener
      myProgressBar.removeEventListener("complete", myProgressBarListener);

      // Ends the function
      };

      // Declares a listener. This detects when the Progress Component has loaded the Movie. Then when the preloading is complete it calls the function myProgressBarListener
      myProgressBar.addEventListener("complete", myProgressBarListener);

      // Set up the Progress Bar Component to polled when loading the Movie. This will give a polled look to the Progress Bar as it loads. It has to be set to polled to work
      myProgressBar.mode = "polled";

      // Set the location to load as this Movie.
      myProgressBar.source = "_root";

    Step Four: The Actions - Frame 2

    1. Right click on Frame 2 in the Layer: ActionScript
    2. Select: Insert Blank Keyframe (not frame)
    3. Add this code:

      // Create a Movie Clip to load the swf Movie into
      this.createEmptyMovieClip("myExternallyLoadedSWFMovieHolder", 0);

      // A variable to hold the name and location of where the external swf Movie is located

      var myVariable = "myMovie.swf";

      // Set the Movie's location on the Stage

      myExternallyLoadedSWFMovieHolder._x = 0;
      myExternallyLoadedSWFMovieHolder._y = 0;

      /* Set the Progress Bar to manual mode so that we can reset its value back to 0. We don't want it staring from 100 ! */

      myProgressBar.mode = "manual";

      // Reset the Progress Bar back to zero

      myProgressBar.setProgress(0, 100);

      // Show the Progress Bar

      myProgressBar._visible = true;

      // Create a listener object event.

      myProgressBarListener = new Object();

      // When the Progress Bar is complete and has preloaded the Movie, the listener will call and run this code below:

      myProgressBarListener = function (eventObject) {

      // Hide the Progress Bar now the Movie is loaded

      myProgressBar._visible = false;

      // This next section is optional.
      // If you wish to remain on Frame 2 and view the External Movie do nothing
      // Otherwise un-comment any of the options bellow:
      // Plays the Movie from Frame 2 onwards:
      // play();

      // Go to the next Frame:
      // nextFrame();
      // Go to the next scene but may not automatically play beyond the Frame 1 in the next scene:
      // nextScene();
      // Goes to a Frame Label or Frame number and Play:
      // gotoAndPlay("myFrameLabel");
      // gotoAndPlay(10);
      // Go to and stop at the Frame Label or Frame number:
      // gotoAndStop("myFrameLabel");
      // gotoAndStop(10);


      // closes the function
      };

      // Declares a listener that detects when the Progress Component has loaded the external Movie and is complete.
      // It will call the function myProgressBarListener when the external swf Movie has loaded

      myProgressBar.addEventListener("complete", myProgressBarListener);

      // Set up the Progress Bar Component variables
      // Set up the Progress Bar Component to polled when loading the Movie. It has to be set to polled to work

      myProgressBar.mode = "polled";


      // Set the preloader source to show the progress of the loader Component as it loads the external swf Movie

      myProgressBar.source = "myExternallyLoadedSWFMovieHolder";

      /* This is how we automatically load the external swf Movie. We call the load Movie Clip event and load the external swf Movie into the Movie Clip we created through ActionScript */

      loadMovie(_root.myVariable, _root.myExternallyLoadedSWFMovieHolder);

      // Stop the Movie at the frame until the Movie is loaded

      stop();


      Important:
      Make sure you change the name of the file to the name of your file:
      myMovie.swf

      Strange but True: It is the location of the web page and the Movie that is loading that is important not the location of this preloader Movie! If you wish to move this preloader Movie to a different folder you can. It can also be used several times on several different web pages as long as each time the web page is located in the same place as a Movie called:  myMovie.swf. Each version of the Movie  myMovie.swf could be a different Movie with different content!

      Usually the Main Content Movie would be in the same folder as the web page. If it is not you will need to type a target path like this:

      myLoader.contentPath = "images/myMovie.swf";

      You may also use a full URL like this:

      myLoader.contentPath = "
      http://www.webwasp.co.uk/images/myMovie.swf";

      Confused? If you get in a muddle the easiest thing is to have the Web Page, Preloader Movie and Main Movie all in the same folder.


    Your Layers should now look like this:


    That's it.

     

    discuss this topic to forum

    relation tutorial

    No information

    Category

      3D (36)
      Math Physics (18)
      3rd Party (10)
      Navigation (70)
      Actionscripting (228)
      Optimization (17)
      Animation (166)
      Projector (11)
      Audio (54)
      Special Effects (170)
      Backend (26)
      Text Effects (92)
      Drawing (34)
      Tips and Techniques (58)
      Dynamic Content (38)
      Tricks (8)
      Games (114)
      Utilities (24)
      Getting Started (99)
      Video (59)
      Interactivity (48)
      Web Design (37)

    New

    Hot