Flash component

How to: Display a custom preloader

In a timeline layer above your component instance, add a Movie Clip named "preload_mc". Inside the Movie Clip create a dynamic text instance (preload_txt) and a simple, rectangular Movie Clip (preload_bar).

The heiarchy of the movie should be like this:

- SlideShowPro Player (my_ssp)
- preload_mc
-- preload_txt
-- preload_bar

Then, create a new timeline layer above that and name it "actions". Add the following to the empty keyframe for that layer:

// Hide preload_mc until we need it
preload_mc._visible = false;

// Set the xscale of the preload bar to zero
preload_mc.preload_bar._xscale = 0;

// Create a new listener object
var sspListenUp = new Object();

// Make the preloader visible
sspListenUp.onPreloadInit = function():Void {
   preload_mc._visible = true;
}

// Continually update text with progress data
sspListenUp.onPreloadProgress = function(eventObject):Void  {
  // Set the text box to display the current progress of the preload
  preload_mc.preload_txt.text = eventObject.data;

  // Set the preload bar to scale to show progress
  preload_mc.preload_bar._xscale = eventObject.data;
};

// Preloading is done, what to do now?
sspListenUp.onPreloadEnd = function():Void  {
  // Hide preload_mc and reset the preload_bar scale
  preload_mc._visible = false;
  preload_mc.preload_bar._xscale = 0;
};

// Hook the listeners up to your SSP instance
my_ssp.addEventListener("onPreloadInit", sspListenUp);
my_ssp.addEventListener("onPreloadProgress", sspListenUp);
my_ssp.addEventListener("onPreloadEnd", sspListenUp);

Publish a movie, and test it online (where there's latency for the preloader to use). You should see your preloader functioning just like the one embedded inside the SlideShowPro Player.