View comments | RSS feed

Potential issues for working with filters

There are several potential sources of confusion or trouble to keep in mind when you're working with filters. These are described in the following sections.

Subtopics

Filters and bitmap caching
Changing filters at run time
Filters and object transformations
Filters and Bitmap objects

Filters and bitmap caching

To apply a filter to a display object, bitmap caching must be enabled for that object. When you apply a filter to a display object whose cacheAsBitmap property is set to false, Flash Player automatically sets the value of the object's cacheAsBitmap property to true. If you later remove all the filters from the display object, Flash Player resets the cacheAsBitmap property to the last value it was set to.

Changing filters at run time

If a display object already has one or more filters applied to it, you can't add additional filters to the filters property array. Instead, to add or change the set of filters being applied, you create a copy of the entire filters array and make your modifications to this (temporary) array. You then reassign this array back to the filters property of the display object in order for the filters to be applied to the object. The following code demonstrates this process. Initially, a glow filter is applied to the display object named myDisplayObject; later, when the display object is clicked, the function addFilters() is called. In this function, two additional filters are applied to myDisplayObject:

import flash.events.MouseEvent;
import flash.filters.*;

myDisplayObject.filters = [new GlowFilter()];

function addFilters(event:MouseEvent):void
{
    // Make a copy of the filters array.
    var filtersCopy:Array = myDisplayObject.filters;

    // Make desired changes to the filters (in this case, adding filters).
    filtersCopy.push(new BlurFilter());
    filtersCopy.push(new DropShadowFilter());

    // Apply the changes by re-assigning the array to the filters property.
    myDisplayObject.filters = filtersCopy;
}

myDisplayObject.addEventListener(MouseEvent.CLICK, addFilters);

Filters and object transformations

No filtered region--a drop shadow, for example--outside of a display object's bounding box rectangle is considered to be part of the surface for the purposes of hit detection (determining if an instance overlaps or intersects with another instance). Because the DisplayObject class's hit detection methods are vector-based, you cannot perform a hit detection on the bitmap result. For example, if you apply a bevel filter to a button instance, hit detection is not available on the beveled portion of the instance.

Scaling, rotating, and skewing are not supported by filters; if the filtered display object itself is scaled (if scaleX and scaleY are not 100%), the filter effect does not scale with the instance. This means that the original shape of the instance rotates, scales, or skews; however, the filter does not rotate, scale, or skew with the instance.

You can animate an instance with a filter to create realistic effects, or nest instances and use the BitmapData class to animate filters to achieve this effect.

Filters and Bitmap objects

When you apply any filter to a BitmapData object, the cacheAsBitmap property is automatically set to true. In this way, the filter is actually applied to the copy of the object rather than the original.

This copy is then placed on the main display (over the original object) as close as possible to the nearest pixel. If the bounds of the original bitmap change, the filtered copy bitmap is recreated from scratch, rather than being stretched or distorted.

If you clear all filters for a display object, the cacheAsBitmap property is reset to what it was before the filter was applied.


Flash CS3


Comments


adbe_paul said on May 8, 2007 at 4:24 PM :
The section titled "Changing filters at runtime" shows how to add an additional filter to an existing set of filters that are applied to a display object. Removing one filter from a set of filters that are applied to a display object is a similar process -- you copy the filters into a temporary array, remove the unwanted filter(s) from the array, and reassign the temporary array to the display object's filters property.

There are several ways to remove one or more elements from any array, described on the following page (in the section titled "Removing array elements"):
http://livedocs.adobe.com/flash/9.0/main/00000089.html#wp119400

Here are a few examples that are specific to working with filters:

If you want to remove the top-most filter on the object, you just remove the filter from the array using the Array class’s pop() method:

// Example of removing the top-most filter
// from a display object // named "filteredObject".

var tempFilters:Array = filteredObject.filters;

// Remove the last element from the Array (the top-most filter) tempFilters.pop();

// Apply the new set of filters to the display object.
filteredObject.filters = tempFilters;

Similarly, if you want to remove the bottom-most filter you use the same code, substituting the Array class’s shift() method in place of the pop() method.

If you want to remove a filter from the middle of an array of filters (assuming there are more than two filters in the array) you can use the splice() method. You must know the index (the position in the array) of the filter you want to remove. For example, this code will remove the second filter (the filter at index 1) from a display object:

// Example of removing a filter from the middle of a stack of filters
// applied to a display object named "filteredObject".

var tempFilters:Array = filteredObject.filters;

// Remove the second filter from the Array. It's the item at index 1
// because Array indexes start from 0.
// The first "1" indicates the index of the filter to remove; the
// second "1" indicates how many elements to remove.
tempFilters.splice(1, 1);

// Apply the new set of filters to the display object.
filteredObject.filters = tempFilters;
adbe_paul said on May 8, 2007 at 4:31 PM :
And alas, the code got a bit scrambled when I pasted it in. =)

The second code listing is okay, but in the first one, the text "tempFilters.pop()" should be on its own line rather than at the end of the line that starts "// Remove the last element ..."

 

RSS feed | Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/flash/9.0/main/00000196.html