Macromedia Flash - RGB Color Slider: Step

The following guide provides a clear overview of Step, with the most relevant background, details, and practical takeaways.

Step Overview

Step 1 Create a new flash file. Go to Modify > Document ( Ctrl + J ). Set the width of the flash file to 450 x 350px. The background color you can set arbitrarily, in this lesson I will use white. Set the frame rate to 14fps or whatever you want.

Step 2 Pick the Rectangle Tool ( R ). In the Properties Panel select the Fill color to be red, Stroke color choose no color, then draw a rectangle with dimensions of 5x 225px.

Step 3 Take the Rectangle Tool (R) and continue drawing a horizontal rectangle (to make the color control bar) with a size of 40 x 10px and place it as shown below.

Step 4 Select the entire slider ( Ctrl + A ) and press F8 key ( Convert to Symbol ) to convert it into a Movie Clip.

Step 5 When the Movie Clip created (slider) is still selected, go to the Properties Panel ( Ctrl + F3 ). On the left side of Properties you will find the entry, enter the name in the field that is RedSlider

Step 6 Grab the Selection Tool (V) and double click on the Movie Clip. You will edit inside the movie clip

Step 7 Select the Selection Tool (V) and select only the horizontal slider (created in step 3). Press F8 ( Convert to Symbol ) to convert it into a Movie Clip.

Step 8 When the horizontal slider is still selected, go to the Properties Panel and enter RedControlBar in the box. See the picture below.

Step 9 Using the Selection Tool, select once the horizontal slider, open the Action Script Panel (F9) and enter the following code:

OnClipEvent ( load ) { top = _y; bottom = _y +224; left = _x; right = _x; }

Step 10 Close the Action Panel (F9) and select the Selection Tool (V). Double click on the newly created Movie Clip (horizontal slider)

Step 11 Press F8 again to move the horizontal slider to Button.

Step 12 When the horizontal slider is still selected, go to the Properties Panel and enter RedControlBarBtn

Step 13 Take the Selection Tool (V) click once on the button (Button) you just created, go to the Action Script Panel (F9) and enter the following code:

On ( press ) { startDrag ( this, false, left, top, right, bottom) } on ( release ) { stopDrag (); }

Step 14 Return to the main scene (Scene 1)

Step 15 Using the Text Tool (A), go to the Properties Panel and select the properties below: - Choose Dynamic Text. You need to select this type of text because it can be changed via ActionScript. - Select Arial font, bold type ( B ) - Choose font size 12 - Text color is black. - The rendering option is Bitmap text (no anti-alias)

Then click and drag a text field below the slider. See the picture below.

Step 16 In the Properties Panel, in the Var section enter redRGB

So we have completed the first slider ( Red ). Repeat the steps above to create the Green and Blue colored bars according to the respective steps.

Step 17 Using the Oval Tool (0), select no color for the Stroke color, and choose any color in the Fill color field and draw a circle with a size of 230 x 230px

Step 18 Select the drawn circle, press F8 key ( Convert to Symbol ) to convert it into a Movie Clip Symbol.

Step 19 While still selecting the newly created Movie Clip (circle), go to the Properties Panel and enter circle into the section

Step 20 Now create a control point: select the Oval Tool (O), choose the Stroke color without color, Fill color choose any color and draw a 5 x 5px circle.

Step 21 When the control point is still selected, press F8 key and convert it into a Movie Clip Symbol

Step 22 Go to the Properties Panel of the control point, at the part and enter ControlPoint.

Step 23 Pick the Selection Tool (V), click on the control point, go to the Properties Panel again. On the right side you will see the Color menu section. Select Alpha and 0%.

Step 24

OnClipEvent ( enterFrame ) { _parent. RedRGB = ( _parent. RedSlider. RedControlBar. _y +122). ToString (16); if ( length ( _parent. RedRGB) == 1) _parent. RedRGB = "0" + _parent. RedRGB; _parent. GreenRGB = ( _parent. GreenSlider. GreenControlBar. _y +122). ToString (16); if ( length ( _parent. GreenRGB) == 1) _parent. GreenRGB = "0" + _parent. GreenRGB; _parent. BlueRGB = ( _parent. BlueSlider. BlueControlBar. _y +122). ToString (16); if (length ( _parent. BlueRGB) == 1) _parent. BlueRGB = "0" + _parent. BlueRGB; finalColor = "0x" + _parent. RedRGB + _parent. GreenRGB + _parent. BlueRGB; _parent. CircleColor. SetRGB (finalColor); _parent. CircleColor. SetRGB (finalColor); }

Step 25 Create a new layer and name it action. Select the first frame, go to the Action Script Panel (F9), enter the following code:

CircleColor = new Color (circle);

And finally test the product (Ctrl + Enter).

FAQ

What is the main topic of Macromedia Flash - RGB Color Slider: Step?

The following guide provides a clear overview of Step, with the most relevant background, details, and practical takeaways.

Why is Step important?

Step Overview Step 1 Create a new flash file.

What should readers remember about Step?

Go to Modify > Document ( Ctrl + J ).