Selteco.com > FlashDesignerZONE.com > Tutorials > T1031

Create 3D motion.

Create animated 3D movement with ActionScript

gradientfill

Download source project t1031.zip (2 kb)

  1. Launch Flash Designer and choose “Blank document”
  2. Set frame size to 300 x 300
  3. Set frame delay to Stop
  4. Choose “Ellipse” tool and draw the ball, hold CTRL to draw a circle
  5. Choose “Item” > “Gradient Fill”
  6. Click “Center Color” and change it to your favourite color (this is the light color)
  7. Click “Outer Color” and change it to a color darker than center color (this is the shadow color)gradient fill
  8. Click “Advanced”set the gradient
  9. Change “Delta X” and “Delta Y” to -50 (this will move the center of the gradient)
  10. Click OK twice to fill the ball with the gradient
  11. Choose “Edit” > “Convert to Sprite”, the ball will appear as “Sprite2”
  12. Choose “Item” > “Placement Properties”, check “ActionScript Target” and change “Item Name” to “theBall”, click OKsprite
  13. Choose “Frame” > “ActionScript” and enter the following code:
    Angle = 0;function moveball(){Angle++; // increase angle by 1 degree at each framerad = Angle / 20;  // divide angle by speed  // calculate x and y offset of the ball// sin and cos are between -1 and 1X = Math.sin(rad) * 100; // X: -100 to +100 pixels horizontallyY = Math.cos(rad) * 30;  // Y: -30 to +30 pixels vertically// place the ball at x and y// (120,120) is the centertheBall._x = 120 + X;theBall._y = 120 + Y;// scale the ball based on y coordinate (vertical axis)// negative y will increase the scale// 100 is the normal sizetheBall._xscale = 100 + Y;theBall._yscale = 100 + Y;// fade the ball based on y tootheBall._alpha = 75 + Y / 2;}setInterval(moveball,25);

Press F9 to preview the animation

get flash