Selteco.com > FlashDesignerZONE.com > Tutorials > T1031

Create 3D motion.

Create animated 3D movement with ActionScript

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)

  8. Click "Advanced"

  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 OK

  13. Choose "Frame" > "ActionScript" and enter the following code:
    Angle = 0;
    
    function moveball()
    {
    Angle++; // increase angle by 1 degree at each frame
    
    rad = Angle / 20;  // divide angle by speed  
    
    // calculate x and y offset of the ball
    // sin and cos are between -1 and 1
    
    X = Math.sin(rad) * 100; // X: -100 to +100 pixels horizontally
    Y = Math.cos(rad) * 30;  // Y: -30 to +30 pixels vertically
    
    // place the ball at x and y
    // (120,120) is the center
    theBall._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 size
    theBall._xscale = 100 + Y;
    theBall._yscale = 100 + Y;
    
    // fade the ball based on y too
    theBall._alpha = 75 + Y / 2;
    }
    
    setInterval(moveball,25);
    
    
Press F9 to preview the animation

Products | Purchase | Downloads | Support | Flash Tutorials | Contact
Copyright © 1999-2017 Selteco Software, Inc. www.selteco.com, ph: +1 810 377 5778