Actionscript Cookbook

4.11. Filling a Shape with a Complex Gradient

Problem

You want to draw a gradient-filled shape at runtime, but the box-style gradient matrix doesn’t offer sufficient control.

Solution

Use the beginGradientFill( ) and endFill( ) methods in conjunction with a TransformMatrix object.

Discussion

In Recipe 4.10, we used a box-style gradient to apply a simple fill pattern. However, you can attain precise control over the gradient by passing a transformation matrix as the matrix parameter sent to the beginGradientFill( ) method.

ActionScript uses a 3 × 3 transformation matrix to apply a custom gradient. Working directly with the transformation matrix can be a bit more complicated than it is worth, so you should take advantage of the TransformMatrix class, which makes this process much easier. You need to include TransformMatrix.as in any Flash document in which you wish to work with a transform matrix:

#include "TransformMatrix.as"

The TransformMatrix.as file is not part of the standard Flash installation, but it is included on the Flash CD-ROM under Goodies\Macromedia\OtherSamples\transformmatrix.as. You should copy the file from the CD-ROM to Flash’s Include directory (FlashIntallation\Configuration\Include).

First, create a TransformMatrix object using the standard constructor method:

matrix = new TransformMatrix(  );

Thereafter, you can call any of the five available methods:

translate(x, y)

The translate( ) method offsets the bottom-left corner (for linear gradients) or the center (for radial ...