Wednesday, 6 January 2010

Change movie clip colour randomly in AS3

I previously wrote a post called change movie clip colour in Actionscript 3 where the movie clip changed colour by using the colourPicker component. In this tutorial the colour of the movie clip will change randomly using the ColorTransform class and the Math.random method. Some knowledge of basic buttons will be needed for this tutorial.

Change movie clip colour randomly in AS3

Step 1

Open a new Flash AS3 file.
Select the Oval tool (O) and create an oval shape with no stroke on the stage like below. I have used a black colour for my oval, but you can use any colour you wish.

Step 2

Covert your oval shape into a movie clip by pressing the F8 key on the keyboard, and the give the instance name: oval_mc

Step 3

On the menu bar select Window > Component and drag a button component on the stage. You can alternatively create your own button on the stage if you wish.

Give the instance name: ‘random_btn’ to your button component, and change the button label to ‘Change colour’

Step 4

On the timeline insert a new layer called Actions. Then open up the Actions panel and enter the following code.

//Adds event listener to the button component.
random_btn.addEventListener(MouseEvent.CLICK, changeColour);

function changeColour(event:MouseEvent):void {

//Creates a new instance of the ColorTrasform class.
var myColorTransform:ColorTransform = new ColorTransform();

//Sets the new random colour using the Math.random().
myColorTransform.color = (Math.random() * 0xFFFFFF);

//Apply the colour changes to the movie clip.


Step 5

Test your movie clip Ctrl + Enter. Now click on the buttons and you should see the colour of the oval change change.

You should now be able Change movie clip colour randomly in Actionscript 3.0.


  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP