How to load pictures in flash CS4 dynamically using the loader component

How to load pictures in flash CS4 dynamically using the loader component.

In this tutorial we will learn how to load your pictures into flash dynamically using the loader component. The pictures I am going to work with is 500 pixels wide and 375 pixels height, so I am going to make the stage the same size. So click on the stage and go to properties panel and click on the size and change the size to 500×375 width and height as shown below.

Now I am going to drag the loader component to the stage, so click on the windows in the main menu -> components -> loader, and drag it on stage as shown below.

I am going to make it the same size as the stage and images ie:500×375, so click on the loader component and in your properties panel adjust the size to 500×375 with the ‘x’ and ‘y’ axis positioned at zero, so that it covers the entire stage, and give the loader an instance name and call it “myloader” as shown below.

And we are going to call this layer pictures.

Now your swf and the fla files have to be in the same directory as where your images are, so save your files in the directory where your images are stored. The advantage of doing this is, you are not loading your images along with your entire website, it is being called for externally, this way your flash loader takes less time to load.
Now create two buttons, name the first one as “1” and the second one as “2”, so lock the pictures layer and create another layer and call it buttons, make a round shape with the number “1” in it, and make another round shaped button with the number “2” in it. And bring it to either side of the stage, ie; one on the left extreme and the other on the right extreme.

Now click F8 and convert the symbol into button and call it btn_1 and btn_2 respectively as shown below.

Now we are going to add codes to these buttons, so that when number ‘1’ button is clicked the image1 loads and when the button ‘2’ is clicked the image2 loads. This way the flash does not take a long time to load, it loads first and then calls for the images when clicked on buttons.

In the action script, you are basically commanding that on release of the button, it calls for the instance name ie: myloader in this instance and the contentPath you defined is the image you are calling for as shown above.

Test your movie and you will notice that the flash CS4 loads faster, and only on clicking the buttons, it will display the image you have defined in your action script.
You now know how to load pictures in flash CS4 dynamically using the loader component.