We will change the color of the flower to a random color when we click the button. This time, the flower has 3 color areas: lightArea, darkArea, and colorArea. We generate random values for red, green and blue then multiply by a value less that 1 to get a darker shade and multiply by a value greater than 1 to get a lighter shade. We must ensure that the values are never more than 255.
The code is shown below:
var light,medium,dark:int; //3 shades of the same color
btnChange.addEventListener(MouseEvent.CLICK,changeColor);
function changeColor(e:MouseEvent):void {
var colorT:ColorTransform = new ColorTransform();
setRandomColor();
colorT.color = light;
flower.lightArea.transform.colorTransform = colorT; //change the color of the box
colorT.color = medium;
flower.colorArea.transform.colorTransform = colorT; //change the color of the box
colorT.color = dark;
flower.darkArea.transform.colorTransform = colorT; //change the color of the box
} //changeColor
function setRandomColor(): void {
var red:int=Math.random()*256;
var green:int=Math.random()*256;
var blue:int=Math.random()*256;
medium=(red*256*256)+(green*256)+blue; //RGB value
var darkRed:int=red*0.6;
var darkGreen:int=green*0.6;
var darkBlue:int=blue*0.6;
dark=(darkRed*256*256)+(darkGreen*256)+darkBlue; //RGB value
//notice the difference in setting ltRed,ltGreen and ltBlue. The result is the same
var ltRed:int=red*1.5;
if(ltRed>255) ltRed=255;
var ltGreen:int=green*1.5;
ltGreen=Math.min(ltGreen,255);
var ltBlue:int=Math.min(blue*1.5,255);
light=(ltRed*256*256)+(ltGreen*256)+ltBlue; //RGB value
} //randomColor
Download movie