Lesson objectives: By the time you're
finished with this lesson, you'll be able to assign user
controls to a movie clip so that the user's keyboard input
controls its movement. You'll also play a little with an
inertia effect to make the spaceship "spin out"
slightly for more stylistic movement.
You need to add a healthy amount of code to the makeShip()
function in order to move the spaceship, just like you had
to add a bunch of code to make the asteroids move.
Enter
the code into your movie or open up lesson_4.fla, publish
it, and play with the arrow keys. Now you can move the ship
around the playable area. Notice if you make sharp turns,
the ship spins out a little bit. It's kind of fun, and a
lot easier to maneuver than with a joystick in the old arcade
game.
Without getting super-analytical, let's take a look at
some of the math that's involved in making this movement
possible:
if (Key.isDown(Key.RIGHT)) {
this.torque = 5;
} else if (Key.isDown(Key.LEFT)) {
this.torque = -5;
} else {
this.torque = 0;
}
this.rtorque = 0.5*this.AngVelocity;
this.AngAcceleration = this.torque - this.rtorque;
this.AngVelocity += this.AngAcceleration;
this.angle += this.AngVelocity;
If you press the right or left-arrow keys, the torque
is set to some value (5 or -5). If no arrow key is pressed,
the torque is reset to
0. In physics, torque is a turning or twisting force so
all you're talking about is the amount of force applied
to the ship when steering right or left.
Let's say you turn right. The torque
is now equal to 5. If you follow the four lines of code
after the if-then statements, the first time you go through
the code, Macromedia Flash figures out the math like this:
- "rtorque" = 0.5 times 0 (there is no AngVelocity
yet so it defaults to 0)
- "AngAcceleration" = 5 (you have a torque value)
minus 0 (the "rtorque" value above is 0)
- "AngVelocity" increases from 0 to 5 because
it's adding "AngAcceleration"
- "angle" increases from 0 to 5 (the "AngVelocity
from above)
This is just for the first frame that the key is pressed.
When the frame refreshes, if you're still holding down the
right-arrow key, these values change to the next sequence:
- "rtorque" = 0.5 times 5 (you now have an AngVelocity
of 5)
- "AngAcceleration" = 5 (your torque value is
constant) minus 2.5 (your new "rtorque" value)
- "AngVelocity" increases from 5 to 7.5
- "angle" increases from 5 to 12.5
You probably think this is overly complicated and unnecessary.
I included this torque engine because I wanted one's ability
to turn to be a little more powerful than one's ability
to thrust forward. In the heat of the game, I think it's
easier if you can make fast turns to fire at incoming asteroids.
The forward thrusting engine is pretty easy to grasp, by
comparison:
this.drag = this.momentum*this.v;
if (Key.isDown(Key.UP)) {
this.force = 1;
} else {
this.force = 0;
}
this.xa = ((this.drag*this.xv)*-1)+(this.force*Math.sin(mp/180*this.angle));
this.ya = ((this.drag*this.yv)*-1)-(this.force*Math.cos(mp/180*this.angle));
this.xv += this.xa;
this.yv += this.ya;
If you press the up arrow, the force
is equal to 1. If the up arrow isn't pressed, the force
is equal to 0. Going forward is simply a true/false decision—either
it's on or it's off. Programmers call this a Boolean
statement; either you're going forward or you're not.
If it's on, the acceleration uses some trigonometry to determine
where it's going and how fast it's going.
I'm not going to make you walk through this part of the
functionality like I did with the torque but if you want
to see what's going on, just start with the initial values
of the variables you know (this.drag,
this.momentum, this.v,
and this.force), treat
everything else with a value of zero, and solve these math
equations in order.
When you do the whole thing once, record the new values
for any of the variables that got changed and use those
values when you do it a second time.
Just think, this is what Macromedia Flash MX does—making
all these calculations on every frame!
|
