topical media & game development
#graphic-flex-image-effects-06-Flex-InterpolateTest.ax
#graphic-flex-image-effects-06-Flex-InterpolateTest.ax
[swf]
[flash]
flex
package {
import flash.display.Shape;
import flash.display.Sprite;
import flash.geom.Matrix3D;
import flash.geom.Vector3D;
[SWF(width=550, height=400, backgroundColor=0xFFFFFF)]
Demonstrates how Matrix3D.interpolate() may be used to draw blends between two shapes in 3D space.
public class @ax-graphic-flex-image-effects-06-Flex-InterpolateTest extends Sprite {
private static const TOTAL_INTERPOLATED_SHAPES:uint = 100;
Constructor. Draws and positions all shapes in the blended box shape.
public function @ax-graphic-flex-image-effects-06-Flex-InterpolateTest() {
// creates rotated view of whole sprite
rotationX = 30;
// two colors to be used at either end of the shape blend
var startColor:uint = 0xFF0000;
var endColor:uint = 0xFFCC00;
// draw the bottom of the box shape
var startShape:Shape = createShape(startColor);
// move and rotate shape into position
var startMatrix:Matrix3D = new Matrix3D();
startMatrix.appendRotation(-90, Vector3D.X_AXIS);
startMatrix.appendRotation(-45, Vector3D.Y_AXIS);
startMatrix.appendTranslation(275, 250, -100);
startShape.transform.matrix3D = startMatrix;
// draw top shape of box blend
var endShape:Shape = createShape(endColor);
// use bottom's matrix, but move it up y axis by 200 units
var endMatrix:Matrix3D = startMatrix.clone();
endMatrix.appendTranslation(0, -200, 0);
endShape.transform.matrix3D = endMatrix;
// draw all intermediate shapes
var shape:Shape;
for (var i:uint = 0; i < TOTAL_INTERPOLATED_SHAPES; i++) {
// draw shape of intermediate color
shape = createShape(getColor(startColor, endColor, i));
// position shape with intermediate transform
shape.transform.matrix3D = Matrix3D.interpolate(
startMatrix,
endMatrix,
getPercent(i)
);
}
addChild(endShape);
}
Returns intermediate color between start and end colors using the current shape index.
parameter: startColor The start color of the blend.
parameter: endColor The end color of the blend.
parameter: index The index of the shape being drawn.
returns: Returns the intermediate color for the specified shape index.
private function getColor(
startColor:uint,
endColor:uint,
index:uint
):uint {
var percent:Number = getPercent(index);
// find each of the component values for the start and end colors
var startRed:uint = startColor >> 16 & 0xFF;
var startGreen:uint = startColor >> 8 & 0xFF;
var startBlue:uint = startColor & 0xFF;
var endRed:uint = endColor >> 16 & 0xFF;
var endGreen:uint = endColor >> 8 & 0xFF;
var endBlue:uint = endColor & 0xFF;
// calculate intermediate values
var red:uint = (endRed - startRed)*percent + startRed;
var green:uint = (endGreen - startGreen)*percent + startGreen;
var blue:uint = (endBlue - startBlue)*percent + startBlue;
// combine intermediate component values into full color
return red << 16 | green << 8 | blue;
}
Returns the percent of the index value within the total number of interpolated shapes.
parameter: index The index to determine the percentage for.
returns: The percent for the index within the total interpolated shapes.
private function getPercent(index:uint):Number {
return (index+1)/(TOTAL_INTERPOLATED_SHAPES+1);
}
Draws a shape with the specified color and adds it to the stage.
parameter: color The color of the shape.
returns: The shape created.
private function createShape(color:uint):Shape {
var shape:Shape = new Shape();
shape.graphics.beginFill(color);
shape.graphics.drawRect(-100, -100, 200, 200);
shape.graphics.endFill();
addChild(shape);
return shape;
}
}
}
(C) Æliens
04/09/2009
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.
