|
Written by Rawpulse
|
|
Saturday, 05 November 2005 |
|
In this tutorial we show you how to move a character for a game in Flash.
Introduction
This tutorial will look at the basics of movement. That is, moving an
item with the up, left, right and down keys on your keyboard. Typically
used with overhead or platform games, when the character is moved with
these keys. While this tutorial shows you the basics, you can add level
designs and animations to bring it to life, to create an engaging game.
You will need to read some of our other tutorials to understand how to
make enemies etc, but they are still in development.
Tutorial
Ok so to start off, open Flash. I used Flash MX 2004, but this should work with any version that uses Actionscript 2.0.
Draw a small circle on the screen, using the Oval Tool. It can be any colour, but should be no larger than 20x20.

Then, convert it to a movie clip, by selecting it, and pressing F8. Call it "dot" and select movie clip from the behaviour list.

Although optional, give your new movie clip an instance name of "dot".
It's not specifically required for this tutorial, but for making games
you will need to assign instance names. To do this, select your dot and
go to Properties, then on the right hand side it will say <Instance
Name>. Replace this text with "dot".

Remember to save your work regularly.
The next part is the Actionscript. Don't be put off by the complexity
of the following code, it's really quite simple to understand. I will
explain what the code means. Select your movie clip, then open the
Actions panel. Paste the following code, or type it in yourself. If you
type it yourself you are more likely to remember it.
_______________________________
onClipEvent (load) {
moveSpeed = 3;
}
onClipEvent (enterFrame) {
if (Key.isDown(Key.RIGHT)) {
this._x += moveSpeed;
} else if (Key.isDown(Key.UP)) {
this._y -= moveSpeed;
} else if (Key.isDown(Key.DOWN)) {
this._y += moveSpeed;
} else if (Key.isDown(Key.LEFT)) {
this._x -= moveSpeed;
}
}
| _______________________________
You'll notice a similar pattern throughout the code. The first part of
the code defines the move speed. We classed the speed as 3. The next
part says that when you enter the frame, if the right key is being
pressed, the dot will move along the x axis (an invisible line) as a
plus (+) which means it will be adding to this x, and moving to the
right. Similarly, sutracting, rather than adding, would make the object
move in the opposite direction. (Think of it as a number scale. Minus and plus define which direction the dot will take)
The next part is similar, stating that if the up key is pressed, the
movie clip will move along the Y axis, as a negative. The third part
represents the movement when the down key is pressed, and works in the
same way as the up key, only with a subtraction, rather than a plus.
Finally, when the left key is addes, the movie clip will move along the
x axis in a negative fashion.
That is all you need to make the dot move. Test your movie by pressing
control + enter. Stay tuned for more games tutorials, explaining game
concepts in more detail. If this tutorial hasn't worked, post the problem on our forum and we'll help you out.
Update: People have been commenting on this tutorial saying that it doesn't let you move the character diagonally. This is because the actionscript includes "else" actions, which allows for one or the other. If you remove the else actions, it will allow you to combine a left and down movement to move diagonally that way, and so on. The code for this is:
_______________________________ onClipEvent (load) {
moveSpeed = 3;
}
onClipEvent (enterFrame) {
if (Key.isDown(Key.RIGHT)) {
this._x += moveSpeed;
} if (Key.isDown(Key.UP)) {
this._y -= moveSpeed;
} if (Key.isDown(Key.DOWN)) {
this._y += moveSpeed;
} if (Key.isDown(Key.LEFT)) {
this._x -= moveSpeed;
}
}
_______________________________
|
|
Last Updated ( Saturday, 16 September 2006 )
|