Daily Archives: June 17, 2008

Tinting a Display Object

Tinting a display object in AS3 is remarkably easy:

// EXAMPLE 1: tint a display object
import fl.motion.Color;
// [..]
var tint:Color = new Color();
tint.setTint( 0x0099ff, 1 );
myobject.transform.colorTransform = tint;

You’ve got two options for resetting the colour, store the original colour or create a new Color object. The following example resets the colour of a display object when it is hovered over.

// EXAMPLE 2: reset with a new Color Object
import fl.motion.Color;
import flash.events.MouseEvent;
// [..]

// call the hover() function when we hover over the display object:
myobject.addEventListener(MouseEvent.ROLL_OVER, hover);

private function hover(e:MouseEvent):void{
    e.currentTarget.transform.colorTransform = new Color(); // removes tint
}

Alternatively, you can store the original “colour” of the untinted in a variable before you tint it. The following trivial example demonstrates this, but you wouldn’t see any visible change on the stage (FYI).

// EXAMPLE 3: reset the tint by storing the original value
import fl.motion.Color;
// [..]
var tint:Color = new Color();
tint.setTint( 0x0099ff, 1 );

var originalColour:Color = myobject.transform.colorTransform; // store the original colour.

myobject.transform.colorTransform = tint; // tint the object blue
myobject.transform.colourTransform = originalColour; // tint the object back to its original colour