Applying simple filters to display objects is very easy for two
reasons. First, the filter classes are easy to use and work similarly to
the way the same filters are applied in the Flash authoring environment.
Second, there is a built-in
filters property in any display
object that can have a filter applied, making it straightforward to set
the property to the filters you wish to add.
Creating a filter follows the same pattern as most other
instantiations in ActionScript 3.0, using the
new keyword. Conveniently, the parameters for
setting the values of the filter are all optional, and use default
values if none are specified. This means that, at minimum, you can
create filters using the following example format, which demonstrates
the drop shadow and bevel filters:
var dsFilter:DropShadowFilter = new DropShadowFilter(); var bvFilter:BevelFilter = new BevelFilter();
You can apply the filters just as easily by setting the
filters property of your display object. The
filters property requires an array to
let multiple filters be applied at the same time (such as applying both
a bevel and a drop shadow). When applying only one filter, you need only
pass a single-item array to the property. The following new script
creates a filled rectangle, and applies a drop shadow effect:
var sp:Sprite = new Sprite(); addChild(sp); sp.x = sp.y = 100; var g:Graphics = sp.graphics; g.lineStyle(1, 0x000099); g.beginFill(0x0000FF, 1); g.drawRect(0, 0, 100, 60); g.endFill(); var ds:DropShadowFilter = new DropShadowFilter(); sp.filters = [ds];
If you wanted to apply both a drop shadow filter and a bevel filter, the last block of code would read:
var ds:DropShadowFilter = new DropShadowFilter(); var bv:BevelFilter = new BevelFilter(); sp.filters = [ds, bv];
To manipulate a filter’s settings, you can use different optional settings for each filter. The first batch of settings for the drop shadow filter are relatively intuitive numerical values, in this order: distance offset (pixels), angle (degrees), color (in hexadecimal notation), alpha (decimal percent range, 0–1), extent of blur in the x direction, extent of blur in the y direction, strength (the amount of color applied and degree of spread), and quality (how many times the filter’s applied). The last batch of options are three Booleans that represent the special setting of this filter—whether or not the shadow is cast inside the shape (to represent a “hole” in the canvas, for example), whether or not the underlying shadow is knocked out (revealing the canvas), and whether or not the object casting the shadow is hidden (leaving only the shadow).
So, if you want to create a lighter, softer shadow, cast down and to the left, you might substitute the previous filter instantiation with the following:
var ds:DropShadowFilter = new DropShadowFilter(5, 135, 0x000099, .5, 10, 10);
You can also change values after creating a setting by manipulating the desired property directly. You just have to remember to reapply the filters to the display object after any change. For example, revisit the filter setup at the beginning of this recipe:
var ds:DropShadowFilter = new DropShadowFilter(); sp.filters = [ds];
ds.angle = 135; sp.filters = [ds];
This excerpt is from The ActionScript 3.0 Quick Reference Guide. If you're ready to give your Flash projects a considerable performance boost, learning ActionScript 3.0 is a must. This Quick Answer Guide is designed specifically to help Flash designers and developers make the leap from ActionScript 2.0 to the new object-oriented ActionScript 3.0 quickly and painlessly. You'll learn key differences between the two language versions, allowing you to more easily leverage ActionScript 3.0 using Flash CS4 and other Adobe technologies like Flex and AIR.