Flash CS3 Documentation

Learning ActionScript 2.0 in Adobe Flash > Animation, Filters, and Drawings > Using filter effects

Using filter effects

Filters are visual effects that you can apply to objects rendered at runtime by Flash Player, such as movie clip instances. The filters include drop shadow, blur, glow, bevel, gradient glow, and gradient bevel. You can also use an adjust color filter that lets you edit a movie clip's brightness, contrast, saturation, and hue. You can apply filters using the Flash user interface in Flash Professional 8, or using ActionScript in Flash Basic 8 or Flash Professional 8.

You can apply each of these filter effects to movie clips, buttons, or text fields by using either the Filters tab in the Property inspector or by using ActionScript. If you use ActionScript to apply the filters to an instance, you can also use a displacement map filter (see Using the displacement map filter) or a convolution filter (see Using the convolution filter). These filters are applied to the vector definitions, so there is no overhead of storing a bitmap image within the SWF file. You can also write ActionScript that lets you modify an existing filter that you applied to a text field, movie clip, or button.

The following procedure demonstrates how you could use an onEnterFrame event handler to animate a glow filter effect on a movie clip.

To animate a filter effect applied to a movie clip instance:

1. Create a new Flash document and save it as animFilter.fla.
2. Add the following ActionScript to Frame 1 of the Timeline:

   this.createEmptyMovieClip("box_mc", 10);
   box_mc.lineStyle(20, 0x000000);
   box_mc.beginFill(0x000000);
   box_mc.moveTo(0, 0);
   box_mc.lineTo(160, 0);
   box_mc.lineTo(160, 120);
   box_mc.lineTo(0, 120);
   box_mc.lineTo(0, 0);
   box_mc.endFill();
   box_mc._x = 100;
   box_mc._y = 100;
   
   box_mc.filters = [new flash.filters.GlowFilter()];
   var dir:Number = 1;
   box_mc.blur = 10;
   box_mc.onEnterFrame = function() {
       box_mc.blur += dir;
       if ((box_mc.blur >= 30) || (box_mc.blur <= 10)) {
           dir *= -1;
       }
       var filter_array:Array = box_mc.filters;
       filter_array[0].blurX = box_mc.blur;
       filter_array[0].blurY = box_mc.blur;
       box_mc.filters = filter_array;
   };
   

   This code completes two different functionalities. The first section creates and positions a movie clip instance, and draws a black rounded rectangle on the Stage. The second block of code applies a glow filter to the rectangle on the Stage and defines an onEnterFrame event handler, which is responsible for animating the filter effect. The onEnterFrame event handler animates the glow filter between a blur of 10 and 30 pixels, and after the animation is greater than or equal to 30, or less than or equal to 10, the direction of the animation reverses.

3. Save your changes to the Flash document and select Control > Test Movie to test the SWF file.

For more information on working with filters in an application, see the following topics:

• Working with filter packages
• Working with filters, caching, and the MovieClip class
• About hit detection, rotating, skewing, and scaling filters
• Applying filters to object instances and BitmapData instances
• About error handling, performance, and filters

For a sample of using ActionScript to apply filters, Filters.fla, see the Flash Samples page at www.adobe.com/go/learn_fl_samples. Download the Samples zip file and navigate to the ActionScript2.0/Filters folder to access this sample.

Flash CS3