Actionscript Cookbook

3.9. Controlling a Movie Clip’s Color with Sliders

This recipe presents a full application that creates sliders for the red, green, blue, and alpha values that control a movie clip’s color:

1. Create a new Flash document and save it.

2. On the main timeline, rename the default layer as movieClips and create a new layer named actions.

3. Create a movie clip symbol and draw a circle in it. The circle should be approximately 120 × 120 pixels.

4. Return to the main timeline and create an instance of the circle movie clip on the Stage on the movieClips layer. Place the instance on the left side of the Stage. Name the instance circle_mc using the Property inspector.

5. Open the Components panel (Window → Components) and drag four instances of the ScrollBar component onto the Stage on the movieClips layer. Name these instances red_sb, green_sb, blue_sb, and alpha_sb. Line them up horizontally on the right side of the Stage.

6. Select the keyframe of the actions layer and open the Actions panel.

7. Add the following code to the Actions panel and test the movie (Control → Test Movie). The scrollbars are automatically colorized to indicate the color components they control. Moving the thumb sliders on the scrollbars adjusts the circle’s color.

   // Define a function that will initialize the scrollbar instances as sliders to // control the color values. function initSliders ( ) { // First, set the scroll properties of each of the scrollbars. For the red, // green, and blue scrollbars, the values should range from 0 to ...