Donate
 
Has KnowFlash helped you?

Donate towards running costs:


Why donate?

Newsletter
Sign up to our newsletter:
 
Enter your email address:
 
flash menu
Tutorials
Video Tutorials
Store
Main Menu
Home
News
Forum
Help/FAQ's
Contact Us
Search
Register
Advertise
Links
Webmasters

Character Movement Print E-mail
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.


Your Dot


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 )

In association with Coursework Essays , Free Essays , Phishing Scams and Big Red Directory

Copyright Oxford Information Services Ltd 2007