We will start with images first because they are simpler to work with; they have no "moving parts" so to speak, as Flash files do.
Flash uses certain methods to load content in dynamically, and the first one to cover is the loadMovie() method.
The loadMovie() Method
The loadMovie() method is used to load external files directly into a MovieClip object. It can be called either by the ActionScript reader hitting it, or on an event such as a button being clicked.
This method has two layouts; the first is the independent function:
loadMovie(URL, movieClip, method);
The second is the movie clip method:
Both usages do the exact same thing, and both have the same parameters basically, just arranged differently:
Now that you see the basic usage and parameters, let's do an example:
All this code does is call the loadMovie() method.
Run this code, and your screen should look like Figure 19.3. That's itthat's all the code necessary for loading an image into Flash at runtime. You could even take out the comment if you wanted to, but that wouldn't be good coding practice.
Figure 19.3. Loading external files is as easy as adding one line of code.
That was pretty simple. Now let's go back and add a button, and change the way we load the image in.
This code creates an event for the myButton_btn button on the stage. When triggered, it will accomplish the same thing that the preceding code didload an image into the _root timeline. Also notice that we used _root this time instead of this because we were calling code from inside a button event. If we had used this, it would have meant we were trying to load the image into the button instead of the _root timeline.
Test the movie; click the button and see what happens. The image still loads, but the button disappears. Welcome to the first limitation of loading external content into movie clips; it replaces everything in that movie clip, which is why the button was removed, because it was on the _root timeline.
Let's fix that by creating an empty movie clip with ActionScript as you learned in Chapter 13, "The Movie Clip Object."
This time, we created an empty movie clip on the _root timeline and loaded the image into that. We could have made the empty movie clip outside the button event, but in keeping with the content-on-demand mindset, it was better to create the movie clip when we needed it, and not before.
Test the movie, and as you can see in Figure 19.4, the image loads in when the button is clicked, and the button remains on the stage. As a matter of fact, you can continue to click the button, and it will refresh the image every time.
Figure 19.4. External files should be loaded into empty movie clips, or content within the movie clip being loaded into will be overwritten.
Now that we are loading content into movie clips other than the _root timeline, it is important to understand inheritance.
The idea of inheritance may be difficult to grasp at first, until you see an example. The idea is that any content loaded into a movie clip will inherit its parent's properties.
For instance, if you load an image into a movie clip that has an alpha of 50, the image in turn will also have an alpha of 50.
Let's take a look at an example of inheritance:
This code creates an empty movie clip on the _root timeline to load the image into. We set a few of its properties including the _rotation set to 180, which will flip the empty movie clip. Then we load the image into the empty movie clip just as before.
Now test the movie, and you will see that the image is completely upside down just like the one in Figure 19.5. This is very useful for aligning images or sizing them before they are even loaded.
Figure 19.5. Use inheritance to control external files before they are even loaded.
You are not limited to movie clip properties, however, as you will see in this next example. We will create a color object, change the tint of the empty movie clip, and then load the image into it.
The preceding code creates an empty movie clip as it did before. Then it creates an instance of the Color object associated with the holder_mc movie clip. After that, another object is created that will be used in conjunction with the Color object. We set a special property, and then pass the blueObj to the setTransform() method of the Color object, changing the tint of the empty movie clip to a shade of blue. Finally, we load the image into the empty movie clip.
Test the movie again and you will see that the image is right side up again (because we removed the rotation code), but this time the image is a shade of blue.
So far we have loaded images directly into movie clips. Now we will see how to load them into levels of the Flash player directly using the loadMovieNum() method.
The loadMovieNum() Method
The loadMovieNum() method, like the loadMovie() method, loads external files into Flash, but unlike the loadMovie() method, the loadMovieNum() method loads the files into a specific level of the Flash player directly.
This is the generic layout of the loadMovieNum() method:
loadMovieNum(URL, level, method);
This action has three parameters:
Although the loadMovieNum() method will not remove everything in a movie clip as the loadMovie() method does, it will remove anything on the level number it is being loaded into, so keep that in mind and know that _level0 is the same as _root.
Now that you've seen the parameters and layout of this method, let's start using it.
The preceding code first creates an empty movie clip to be the background, then loads an image into it. Next the code loads content into the first level of the Flash player.
Test this code and you will see that both images have loaded into Flash. Also, notice two important things. First, that the second image did not affect the first at all. Second that the second image, because it was a PNG, kept its transparency, even being loaded in at runtime.
Now you know how to load images into Flash, but how do we get rid of them?
The unloadMovie() Method
The unloadMovie() method is designed to clean out movie clips containing any content (but in this case, content that has been loaded into it).
Like the loadMovie() method, the unloadMovie() method has two basic layouts, the first being the independent function:
The other use is as a MovieClip method:
Both of these actions perform the same thing and have the same basic parameter, movieClip. The movieClip parameter is the movie to be cleaned.
Here is an example of removing a loaded image from the Flash movie:
The preceding code creates an empty movie clip to house the image being loaded into it. Then an event is created to remove the loaded content from that movie, and also to check to see if the movie is still there.
Run this code, and you will see that the image does load in, and when you click the button, the image disappears, and the Output panel shows a reference to the holder_mc movie clip that is still present.
There is another way to remove loaded content from movie clips: to remove both the clip and the content. Although it is a little more definite: the removeMovieClip() method will accomplish this.
The removeMovieClip() Method
The removeMovieClip() method can be used to remove loaded content from movie clips, but the difference between it and the unloadMovie() method is that the removeMovieClip() method will completely remove the movie clip it is referencing, not just the loaded content.
Like the unloadMovie() method, the removeMovieClip() method has two ways of being written. The first is the independent function:
And the second way is the MovieClip method:
Both ways of writing this action accomplish the same task: They both remove the movie clip completely from the Flash player.
We will continue the preceding example by merely changing the code to use the removeMovieClip() method.
The only thing changed in the code was that the method unloadMovie() was replaced with removeMovieClip().
Test this movie, and again when the button is clicked, the image is removed. However, this time in the Output panel, there is no reference to the holder_mc movie clip because it was also removed.
Those two methods are used to remove loaded content from movie clips, but to remove content from level numbers you must use the unloadMovieNum() function.
The unloadMovieNum() Function
The unloadMovieNum() method works the same way as the unloadMovie() method except that it cleans levels, not movie clips.
Here is the layout of this method:
The only parameter this method has is the level parameter representing which level is to be cleaned.
Returning to the same example, we will replace the code to show how the unloadMovieNum() method works.
The preceding code loads the image into level 1 of the Flash player. Then it creates the event for the button so that when the button is clicked, it will clean out that level.
Test this movie, and just like before, the image loads in fine, and when the button is clicked, the image is removed.
After all that work and coding to load images into Flash, now is the perfect time to tell you that there is an easier way.
The Loader Component
This is one of the simplest components shipping with Flash 8. The Loader component is designed to make it easy for designers and developers to load images and SWF files into Flash dynamically.
It has three parameters:
That's the basics of how these components work. Now let's see them in practice in this next example.
Now test the movie, and your screen should look like Figure 19.6. You can go back into the main timeline and change the size of the Loader component with the Free Transform tool (Q), retest the movie, and the image will reflect the changes made to the Loader component. Also, notice that after you test the movie (or if you click on the stage before you test the movie), the image you have set to it now appears there.
Figure 19.6. The Loader component makes it almost too easy to load dynamic images into Flash.
All we have done so far is load images into Flash. Next we begin to load other .swf files into Flash.