Does Flash? | AS3 Blog

• Tweet
• Share

• Tweet
• Share

Changing the Hue, Contrast, Saturation and Brightness on a DisplayObjects at runtime is no easy task, well in the case of this: mySprite.saturation = -1 being easy. Lets jump right in, have a look at this:

var colourFilter : ColourFilter = new ColourFilter();
colourFilter.saturation = -1;

var sprite : Sprite = new Sprite();
sprite.filters = [colourFilter.filter];

This will make your sprite grayscale, now isn’t that a step forward.

The ColourFilter can adjust:

• alpha – This alpha property is useful if you have a complex object with multiple layers of object and you want a flat opacity. See example below.
• brightness
• contrast
• saturation
• hue

Here we can see the difference between “standard” alpha and the ColourFilter’s alpha. This is a SWF running and is included in the source bundle below.

How does it work?

The ColourFilter uses the ColourMatrix class (which I adapted from Grand Skinner‘s version) to manipulate a matrix for the ColorMatrixFilter. Each time you change a value on the ColourFilter the matrix is recalculated to incorporate all your adjustments. When tweening/adjusting values be sure to re-apply the filter to your object to see the effects. Also I’ve added an optimizedMode for the ColourFilter, because of the performance knock if constantly make adjustments.

The optimizedMode will limit you one property/adjustment being active, but it increases the re-calculation speed by ~5. I found in most cases you only use one of the adjustments at a time, so why calculate all of the adjustments each time?

Great! Now let’s see it in action!

Built with FDT, Robotlegs, AS3Signals and MinimalComps.

Source:

• ColourFilter – Includes all source.

Hope you all enjoy “wowing” those clients with cool contrast burn out effects.

ColourFilter