Sound and Animation
var absSin:Number = Math.abs(Math.sin(card. rotationY*Math.PI/180)); card.x = cardPos.x + 60*absSin; card.z = -10*absSin; Note how easy it is to obtain a basic 3D effect by simply manipulating the rotationX or rotationY properties. No slicing, dicing, or triangulating required. More sophisticated rotation effects and texture mappings can be obtained using the Matrix3D class and the new drawTriangles method of the graphics object. We will discuss only the first of these in this article, but we will suggest resources for the drawTriangles method at the end. Matrix3D and Rotating a Cube in Space Since every Display Object can be rendered and manipulated in 3D, Display Objects have an associated transform.matrix3D property (of type Matrix3D) that keeps track of the transformations that have been performed on the object, including rotation, scaling and translation. While mathematicians will be tempted to fiddle with the inner workings of a Matrix3D object, it is best to use ActionScript’s 3D transformation methods to manipulate the Display Object, and simply use the transform.matrix3D property to keep track of the current status of the object.
Listing 5. Setting up the background (spBoard) and spCube objects
var picSize:Number = 160; var boardWidth:Number = 450; var boardHeight:Number = 360; var spBoard:Sprite= new Sprite(); addChild(spBoard); spBoard.x = boardWidth/2 + 30; spBoard.y = boardHeight/2 + 30;
spBoard.graphics.lineStyle(1,0x666666); spBoard.graphics.beginFill(0x007700); spBoard.graphics.drawRect(-boardWidth/2, -boardHeight/2, boardWidth, boardHeight); spBoard.graphics.endFill(); var spCube:Sprite = new Sprite(); spBoard.addChild(spCube);
spCube.x=0; spCube.y=0; spCube.z=0; var isRotating:Boolean;
var prevX:Number; var prevY:Number; Listing 6. Create a Vector object consisting of centers (in 3D) of the cube faces vecMidPts[0] = new Vector3D(0,0,picSize/2); vecMidPts[1] = new Vector3D(0,0,-picSize/2); vecMidPts[2] = new Vector3D(-picSize/2,0,0); vecMidPts[3] = new Vector3D(0,-picSize/2,0); vecMidPts[4] = new Vector3D(0,picSize/2,0); vecMidPts[5] = new Vector3D(picSize/2,0,0); Listing 7. Create a Vector object consisting of the MovieClips to be used as faces var vecSides:Vector.
Listing 8. The makeCube function appropriately positions and rotates the faces
Figure 3. A Rotating Cube
function makeCube() { var i:int;
for (i=0; i<6; i++) {
vecSides[i].x = vecMidPts[i].x; vecSides[i].y = vecMidPts[i].y; vecSides[i].z = vecMidPts[i].z; spCube.addChild(vecSides[i]);
} mcSide0.rotationY = 180; mcSide1.rotationX = 0; mcSide2.rotationY = 90; mcSide3.rotationX = -90; mcSide4.rotationX = 90; mcSide5.rotationY = -90
}
Figure 4. The Cube Sides
03/2009 (5)
80
Made with FlippingBook HTML5