ColorTransform for multiple movie clips

206 Views Asked by At

Despite searching both the web and youtube for a solution, it remains difficult to find information on colorTransforming multiple movie clips in AS3. I found a video on youtube about colorTransform which i followed steps to create a fully functional colorTransform for a single clip but i would like to use it for multiple clips and be able to change colors for each on a mouse click.

I have included the code below and perhaps someone knows how i can add more movie clips to it. When i copy and change mc1. EventListener code to mc2, i get a duplicate function error which i don't know how to fix.

import flash.geom.ColorTransform;
import flash.geom.ColorTransform;
import flash.events.MouseEvent;

// this here is the little movieclip where the main clip gets its color from,the clip is made up of two movieclips but can also be one movieclip
// instead of brushColor i have used myColor and instead of brush.tip i have used square.
var myColor:ColorTransform=new ColorTransform();
myColor.color=0xffffff; square.transform.colorTransform=myColor

red.addEventListener(MouseEvent.CLICK,onclick);
green.addEventListener(MouseEvent.CLICK,onclick);
blue.addEventListener(MouseEvent.CLICK,onclick);
orange.addEventListener(MouseEvent.CLICK,onclick);
yellow.addEventListener(MouseEvent.CLICK,onclick);
pink.addEventListener(MouseEvent.CLICK,onclick);

function onclick(event:MouseEvent){

    if(event.target==red)
    {myColor.color=0xff0000}

    else if(event.target==green)
    {myColor.color=0x99ff33}

    else if(event.target==blue)
    {myColor.color=0x00ccff}

    else if(event.target==orange)
    {myColor.color=0xffcc33}


    enter code here
    else if(event.target==yellow)
    {myColor.color=0xffff66}

    else if(event.target==pink)
    {myColor.color=0xff99ff}

    else
    {myColor.color=0x666666}
    square.transform.colorTransform=myColor

}


mc1.addEventListener(MouseEvent.CLICK, colorChange);
function colorChange(event:MouseEvent)
{
    mc1.transform.colorTransform=myColor;
}


// upto here the code works fine but from below i get a  duplicate fuction error which i don't know how to fix.
// the idea is to add more movie clips so i can change their colors just like i can do for mc1.

1021: DUPLICATE FUNCTION DEFINITION "ERROR"

mc2.addEventListener(MouseEvent.CLICK, colorChange);
function colorChange(event:MouseEvent)
{
    mc2.transform.colorTransform=myColor;
}
1

There are 1 best solutions below

3
On

Push all movieclips into array and then add eventlistener to all of them like this:

var mcArray:Array=new Array();
mcArray.push(mc1,mc2);
for (var i:int=0;i<mcArray.length;i++)
{
    mcArray[i].addEventListener(MouseEvent.CLICK,colorChange);
}

And add only one colorChange function like this:

function colorChange(event:MouseEvent)
{
    e.currentTarget.transform.colorTransform=myColor;
}