Toxiclab.org

Change the color of any object using the action script 3 and Color Picker

23.2.2009, 15:15
Submited in: Flash | Total Views: 11417

Using this thoroughly explained, detailed action script lesson, you'll see how to change the color of any object using the action script 3, color picker and Adobe Flash. You can use this action script lesson, for any web site when you need to change the object color, for some presentation... Using this lesson, you will also learn how to move Color Picker into a flash stage, how to create instance name and much, much more! Let's start!



Step 1

Create a new flash document.



Step 2


Using the flash tools for drawing, draw any shape you want to use for this lesson!

Step 3

While the shape is still selected, press F8 key (Convert to Symbol) to convert it into a Movie Clip Symbol.



Step 4

While the new made Movie Clip is still selected, go to the Properties Panel below the stage. On the left side, You will find the Instance name input field there. Call this Movie Clip "shape". See the picture below!



Step 5

Hit now Ctrl+F7 key. After that, find in Components Panel - Color Picker, and move it on the stage using the Selection Tool (V) and "drag and drop" technique.





Step 6

While the Color Picker is still selected, go again to the Properties Panel below the stage. On the left side, You will find the Instance name input field there. Call this Movie Clip "ColorPicker". See the picture below!



Step 7

Select the Text Tool (A) and go to the Properties Panel (Ctrl+F3) below the stage. Then, Select a Dynamic Text field, and type Current color selected. See the picture below!



Step 8

Draw now another dynamic text field on the right of the text, but donít write anything there, just give it an instance name of CurrentColor. See the picture below!



Step 9

Create now a new layer above the layer 1 and name it action.

Step 10

Click now on the first frame of layer action and go to the Action Script Panle. After that, enter this code inside the actions panel:

import fl.events.ColorPickerEvent;
import flash.geom.ColorTransform;
 
ColorPicker.selectedColor = 0xffffff;

var colorInfo:ColorTransform = shape.transform.colorTransform;

ColorPicker.addEventListener (ColorPickerEvent.CHANGE, colorChanged);
 
function colorChanged (e:ColorPickerEvent):void {
 
 colorInfo.color = ColorPicker.selectedColor;
 
 shape.transform.colorTransform = colorInfo;

 CurrentColor.text = ColorPicker.hexValue;
}

We're done!

Test your Movie and enjoy!

Download example

Are you a website owner?
Click here to register and submit your tutorials!

Browse by category


Most popular tutorials


Resources Worth visiting


Friends