Make A Flash Matrix

Use the Flash matrix to spin and rotate 2-D and 3-D graphic objects.

A flash matrix will let you apply color, scaling, rotation, skewing and motion to two-dimensional and three-dimensional graphics within a Flash movie. Although you can use other methods to perform these operations, the Flash matrix method requires less coding to implement and less code to alter the effects. The Flash matrix can be implemented with one line of Flash ActionScript 3 code (the Flash programming language). However, you will also need to code a shape and specify the effect transformations to see just how useful an animation tool your Flash matrix is.

Instructions

1. Start the Flash program. Click “New” from the “File” menu on the main Flash menu bar. Click the file type “Flash File(ActionScript 3.0)” from the “New document” dialog box that appears. Click the “OK” button to close the dialog box.

2. Select the “Actions” option from the Window menu on the main Flash menu bar to open the “Actions” editor. Position your cursor on the first line of the “Actions” editor. Click your mouse button and type in the code below to instruct Flash to draw a red square and place it on the stage (with its center at stage coordinate (0,0) when the movie plays:

var square:Sprite= new Sprite();

square.graphics.lineStyle(1);

square.graphics.beginFill(0xFF0000);

square.graphics.drawRect(-50,-50,100,100);

square.graphics.endFill();

stage.addChild(square);

3. Type the code below, starting at the next line in the “Actions” editor, to declare an integer variable, “i,” that will control the rotation and movement of the square and also declare a Flash matrix object named “myMatrix” which will be used to store graphic effects parameters that will be applied to the red square:

READ  About Chinese Animation

var i:int = 0;

var myMatrix: Matrix = new Matrix();

4. Type the code below, starting at the next line in the “Actions” editor, to move the square 1 pixel down and 1 pixel to the right and rotate the square 1 degree every time the Flash animation displays a new frame:

stage.addEventListener(Event.ENTER_FRAME, matrix_fn)

function matrix_fn(event:Event):

void {

myMatrix.createBox(1,1, i, i, i);

square.transform.matrix = myMatrix;

i=i+1;

if (i>500){i=0};

};

5. Copy and paste the code below into the “Actions” editor to ensure that your Flash matrix rotate and move program runs error-free:

var square:Sprite= new Sprite();

square.graphics.lineStyle(1);

square.graphics.beginFill(0xFF0000);

square.graphics.drawRect(-50,-50,100,100);

square.graphics.endFill();

stage.addChild(square);

var i:int = 0;

var myMatrix: Matrix = new Matrix();

stage.addEventListener(Event.ENTER_FRAME, matrix_fn)

function matrix_fn(event:Event):

void {

myMatrix.createBox(1,1, i, i, i);

square.transform.matrix = myMatrix;

i=i+1;

if (i>500){i=0};

};

6. Click the “TestMovie” option in the “Control” menu on the main Flash menu bar and observe that a red square spins about its center as it moves from the top left-hand corner of the Flash stage to the lower right-hand corner of the stage.