Billy T.

This user is yet to take control of their account and provide a biography. If you are the author of this article, please contact us via support AT actionscript DOT org.

View all articles by Billy T.

OK then the last 2 lines simply position our new movieclips on the stage.

_root["button"+i]._x=i*60;
_root["button"+i]._y=25;

So the first time Flash goes through the for loop, it will create a new movieclip with an instance name of button1 and will place it on the stage at an x position of 60 and a y position of 25. The second time it goes through the for loop, it will create a new movieclip with an instance name of button2 and will place it on the stage at an x position of 120 and a y position of 25.

OK that's some pretty serious scripting. Don't stress if it doesn't make sense straight away.

Test your movie. You should see 4 boxes up the top left. They should be red with a black stroke.

So we now have 4 movieclips on the stage with instance names of button1, button2, button3 and ....oh yeah...button4. Something new in Flash MX is that we can now give movieclips button actions such as onRelease - we'll get to that in a sec. First, lets make a couple of new text files for 2 of our buttons to load in. Back in your text editor, make a new file and paste in this text

myText=this is the text that will be loaded in when the user clicks on button1.

Save the file as text1.txt into the task2 folder and then close it.

Make a new text file and paste in this text -

myText=I'm some more text. I don't really want to be here but I have to be because the user clicked on button2 - can I go home now?

Save the file as text2.txt into the same folder and then close it.

Ok back into Flash, add this action underneath all the others -

button1.onRelease=function(){
        loadVariables("text1.txt", "_root");
}
button2.onRelease=function(){
        loadVariables("text2.txt", "_root");
}

As you can see, we have given 2 of our movieclips button actions. Flash kindly responds by changing the mouse to the finger when the user rolls over the boxes and allows the user to click on them. Test your movie and click on the 2 buttons to the left. You should see the 2 text files load in and display themselves in our text box (because, once again, we have used the variable name of myText in our external text files - the same as the variable name of our text box).

Well that's just great but I want some images. Get 4 photos, if you don't have any of your own then look in the samples folder inside the photoshop folder (I'm sure this won't be necessary though!). Crop and resize all your images so they are 100 pixels wide by 150 pixels high. Choose "save for the web" from photoshop and save them all as jpegs at max quality - make sure the "progressive" box is not checked. Save all four images to the task2 folder and name them image1.jpg, image2.jpg etc

Cool. Something else that's new to MX is you can load in jpgs and other stuff at run time. Let's do that now.

Paste these actions underneath the others -

_root.createEmptyMovieClip("imageHolder1", 200);
_root.createEmptyMovieClip("imageHolder2", 201);
imageHolder1._x=450;
imageHolder1._y=50;
imageHolder2._x=450;
imageHolder2._y=225;
loadMovie("image1.jpg","imageHolder1");
loadMovie("image2.jpg","imageHolder2");

Let's look at those actions. The first 2 lines create 2 new movieclips (same as before) and gives them instance names of "imageHolder1" and "imageHolder2". The next 4 lines just position our new movieclips on the stage. In the last 2 lines you will see the loadMovie action that you have all see before. Flash MX allows us to load in jpgs in the same way that you could already load in swf files. In this case, we are loading each image into a target mc (as opposed to a level) and Flash aligns the top left corner of our images with the registration point of the "imageHolder" movieclips that we just created.

Save your movie and then test it.

Great! Now let's add actions to our final 2 buttons that will allow the user to change the images displayed. Add this under all the other actions.

image1Loaded=true;
image2Loaded=true;
button3.onRelease=function(){
        if(image1Loaded){
                loadMovie("image3.jpg","imageHolder1");
                image1Loaded=false;
        }else{
                loadMovie("image1.jpg","imageHolder1");
                image1Loaded=true;
        }
}
button4.onRelease=function(){
        if(image2Loaded){
                loadMovie("image4.jpg","imageHolder2");
                image2Loaded=false;
        }else{
                loadMovie("image2.jpg","imageHolder2");
                image2Loaded=true;
        }
}

Let's break that down. The first 2 lines

image1Loaded=true;
image2Loaded=true;

simply sets a couple of variables. If you don't know what a variable is then please read this.

Next we tell Flash what to do if button3 is clicked. This is a little more complicated though. We want Flash to first check if a condition is true or not and then do 1 of 2 things accordingly. In this example, we check to see if image1 is loaded (via our image1Loaded variable). If it is, then Flash will load image3 into our imageHolder1 and set our image1Loaded variable to false. If it isn't, then Flash will load image1 into imageHolder1 and set the image1Loaded variable to true. What this means is that you can keep clicking the button over and over and Flash will load in alternating images. The code for button4 does the same thing.

Test your movie and click on all the buttons.

Almost done :)

Let's just bring in some audio. Flash MX allows us to dynamically load mp3s so that's just what we will do. Copy your favourite mp3 to the task2 folder (if you don't have any mp3s, I know an amazing band called CAB that have a website with mp3s to download - link :) )

Change the same of your mp3 file to track1.mp3

Add these actions under all the others.

mySound=new Sound();
mySound.loadSound("track1.mp3",true);
mySound.start();

Line 1 creates a new sound object. Line 2 loads our external mp3 file into that sound object and sets streaming to true. Line 3 starts our sound. Test your movie. If the sound doesn't work then try a different mp3 file.

OK I think that's more than enough for now :)

I hope you can see some advantages to utilising the "dynamic" capabilities of Flash MX (not least of which is the ease in which you can change audio, images and text without even having to open up your fla).

You can download the source files from this tute here (mp3 not included)

Please do not email me questions regarding the concepts covered in this tute ? that's what the forums are for.