1.21 gigawatts
1.21 gigawatts

Reputation: 17770

How to lighten or darken a Flex 4 image

Is there a way to darken or lighten an image or actually any display object on mouse over and then restore it back on mouse out? I would prefer to use filters if possible just because I am already applying a filter on mouse over and removing it on mouse out. I would then be able to add it to the filters list. If not that's fine. In my code I'm using a Flex 4 Spark Image component.

Upvotes: 1

Views: 1104

Answers (2)

Michiel Standaert
Michiel Standaert

Reputation: 4176

You should use ColorTransform for this. Below is shown how you can utilise this.

image.addEventListener(MouseEvent.MOUSE_OVER, checkTransform);
image.addEventListener(MouseEvent.MOUSE_OUT, checkTransform);

private function checkTransform(e:event):void
{
    if(e.type == MouseEvent.MOUSE_OVER)
        image.transform.colorTransform = new ColorTransform(0.5, 0.5, 0.5); //multiplies all RGB-values by 0.5
    else
        image.transform.colorTransform = new ColorTransform(1, 1, 1); //restores to default image
}

this should do the trick. For more information on ColorTransform: http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/geom/ColorTransform.html?filter_flash=cs5&filter_flashplayer=10.2&filter_air=2.6

Upvotes: 5

Neeraj
Neeraj

Reputation: 8532

The easiesy way to do is, create a colorfilter, and apply this colorfilter to the image on rollover and remove the filter on rollout.

For details visit : http://cookbooks.adobe.com/post_Convert_images_to_grayscale_using_ActionScript_-12769.html

Thanks

Upvotes: 1

Related Questions