The Blog

This tutorial will teach you how to apply colors to movie clips. Best of all, you will be applying the colors using nothing but ActionScript. Roll the mouse over the colored buttons in the following animation to see what I am referring to:

To make your strenuous programming life easier, I have provided an incomplete source file for you to work on. Don’t worry, the source file does not include the ActionScript necessary to make the animation work! Click the link in the table to download the incomplete FLA file for this tutorial:

Here is how to change the color using ActionScript:

1. Make sure you open the color_tutorial.fla file you downloaded.

2. You will see a movie clip on the left with a cluster of random movie clips. Select the movie clip and select the Instance tab. In the Name field, enter the word shapes.

3. Now that you gave the movie clip a name, it is time to add the action to make the buttons work. Right click on the first button and select Actions. Copy and paste the code from the following box into the Object Actions window that should appear:

on (rollOver) {

var colorful = new Color(“_root.shapes”);
colorful.setRGB(0×003366);
}

4.   Right click on the second button on the top row and select Actions again. Copy and paste the code from the following box into the Object Actions window:

on (rollOver) {

var colorful = new Color(“_root.shapes”);

colorful.setRGB(0×006699);

}

5. That is all there is to the code. Preview the animation and the first two buttons will enable the color of the movie clip to be changed.

Do you see a pattern develop? You should; the code for each of the buttons is going to be nearly exactly the same. The only difference that will be visible is the hexadecimal color value after .setRGB; the hexadecimal color value is the numerical equivalent of colors. i.e. 0×006699.

No related posts.