Simple Projectile Motion
Parabolic motion (Actionscript 2.0)
Immanuel Encarnacion
Flash developer, c++ programmer
Manila, Philippines
What I will show you here is only how to run the projectile.
1. Create two layers, one for actions, and the other for the graphics. Label the actions layer "Actions" for convenience. Make three keyframes for the actions layer, and three frames for the graphics layer. The purpose of the first frame is to initiate the variables, the second one for moving the projectile, and the third one for looping back to frame 2. Also, to make the movement smooth, set the frame rate to 100 fps.
2. Create the projectile; make a small, simple circle, and place it in the bottomleft corner, but not touching the bottom of the stage. Give it an instance name of bullet1.
3. Then, to adjust the attributes of the projectile, create two arrows (one up, one down), and one dynamic text, to adjust the angle. Then duplicate those for the adjustment of the initial speed. For the angle adjustment, name them up_angle, down_angle, and angle_txt. For the speed adjustment, name them up_spd, down_spd, and spd_txt. And last, make another movie clip named fire_bullet to fire the projectile after adjusting.
Your screen should look similar to this:
4. Then, write the code in frame 1 that initiates the variables of the projectile:
//Initiate
var angle:Number=55;
var cur_speed:Number=30;
var cur_speed_x:Number=cur_speed*Math.cos(angle*Math.PI/180);
var cur_speed_y:Number=cur_speed*Math.sin(angle*Math.PI/180);
var g:Number=9.8;
var x_orig:Number=_root.bullet1._x;
var y_orig:Number=_root.bullet1._y;
The angle variable specifies the angle, in degrees of the projectile.
The cur_speed variable indicates the initial speed of the release.
Now, this code:
var cur_speed_x:Number=cur_speed*Math.cos(angle*Math.PI/180);
var cur_speed_y:Number=cur_speed*Math.sin(angle*Math.PI/180);
Gets the x and y components of your projectile.
The g variable is the acceleration due to gravity, and the x_orig and y_orig variables just stores the initial position of bullet1.
5. Then, we move on to the second frame, we now write the code that moves the projectile:
if(_root.bullet1._y>=Stage.height)
{
stop();
}
else
{
_root.bullet1._x=_root.bullet1._x + (cur_speed_x/10);
_root.bullet1._y=_root.bullet1._y  (cur_speed_y/10);
cur_speed_y=cur_speed_y  g/50;
}
_root.angle_txt.text=angle;
_root.spd_txt.text=cur_speed;
The first if condition stops the frame "loop" when the projectile hits the bottom of the stage, so that it doesn't continue falling below the screen. The "else" part is the one that makes the bullet move. According to the laws of physics, only the ycomponent of the speed decreases, so we decrease it with the acceleration due to gravity. I divided the acceleration by 50, since the flash movie is 100 fps, and the loop is two frames long. Anyway, you can set it at any value you want. Finally, the part after the ifelse updates the dynamic text boxes of the values.
The next code, also in frame 2, should make the speed and angle adjustments work:
_root.up_angle.onRelease=function()
{
angle=angle+2;
_root.angle_txt.text=angle;
}
_root.down_angle.onRelease=function()
{
angle=angle2;
_root.angle_txt.text=angle;
}
_root.up_spd.onRelease=function()
{
cur_speed=cur_speed+0.5;
_root.spd_txt.text=cur_speed;
}
_root.down_spd.onRelease=function()
{
cur_speed=cur_speed0.5;
_root.spd_txt.text=cur_speed;
}
_root.fire_bullet.onRelease=function()
{
_root.bullet1._x=x_orig;
_root.bullet1._y=y_orig;
cur_speed_x=cur_speed*Math.cos(angle*Math.PI/180);
cur_speed_y=cur_speed*Math.sin(angle*Math.PI/180);
_root.gotoAndPlay(2);
}
The code of the four arrows is easy to understand.
The fire_bullet's code just restores the projectile back to its original position, updates the x and y speeds of the projectile, and starts the loop again.
The last code to write, in frame 3 is to make the frameloop:
if(_root._currentframe==3)
{
_root.gotoAndPlay(2);
}
6. Test the movie. Now, your timeline should look like this:
That's all. If you have any suggestions or questions, just leave comments. :) (No email please :D)
Spread The Word
10 Responses to "Simple Projectile Motion"
said this on 01 Feb 2009 12:51:39 AM CDT
Very cool tutorial. Thank
If some http:// A few stumbling bl a) how do you make dynam c) we added static text d) we p e) if an thank 
said this on 10 Dec 2009 11:15:20 PM CDT
mines not working at all.

said this on 04 Feb 2009 1:59:37 PM CDT
Forgot to say it's Action

said this on 05 Apr 2009 5:26:17 AM CDT
Very nice  easy to under
To stop it autom var cur_speed_x 
said this on 13 Oct 2009 1:20:03 PM CDT
Very, VERY easy to unders

said this on 12 Nov 2009 5:08:19 AM CDT
exactly what i needed ,)

said this on 18 Nov 2009 5:40:13 AM CDT
So easy explaination, Tha

said this on 04 Oct 2010 3:12:09 AM CDT
thank you for the tutoria
it's easy to follow e 
said this on 28 Jun 2011 10:57:56 AM CDT
Love the tutorial.
What 
said this on 24 Nov 2011 6:50:18 AM CDT
That's not just the best
