Friday, 4 September 2009

Keyboard controls in AS3 part 2

I previously wrote a post on keyboard controls in AS3 which allowed you to move an object using the keyboard keys. In that tutorial the object could not be moved simultaneously to two directions. For example, moving an object in the up and right directions.

In this tutorial I will be show you how move an object simultaneously in two directions using the keyboard keys. This is achieved by testing the keyboard keys separately, instead of as a whole. Be sure you have attempted the previous tutorial as more code will be added in this one.


Keyboard controls in AS3 part 2

Step 1

Open up your keyboard controls file.
On the timeline locate the ‘Actions’ layers then open up the actions panel and enter the following code:

//1.
var leftArrow:Boolean=false;
var rightArrow:Boolean=false;
var upArrow:Boolean=false;
var downArrow:Boolean=false;

//2.
stage.addEventListener(KeyboardEvent.KEY_UP, nokeyHit);
stage.addEventListener(KeyboardEvent.KEY_DOWN, keyHit);
stage.addEventListener(Event.ENTER_FRAME, moveObject);

//3.
function keyHit(event:KeyboardEvent):void {
switch (event.keyCode) {
case Keyboard.RIGHT :
rightArrow=true;
break;
case Keyboard.LEFT :
leftArrow=true;
break;
case Keyboard.UP :
upArrow=true;
break;
case Keyboard.DOWN :
downArrow=true;
break;
}
}


//4.
function nokeyHit(event:KeyboardEvent):void {
switch (event.keyCode) {
case Keyboard.RIGHT :
rightArrow=false;
break;
case Keyboard.LEFT :
leftArrow=false;
break;
case Keyboard.UP :
upArrow=false;
break;
case Keyboard.DOWN :
downArrow=false;
break;
}
}

//5.
function moveObject(event:Event):void {
var speed:Number=5;
if (leftArrow) {
lemon_mc.x-=speed;
}
if (rightArrow) {
lemon_mc.x+=speed;
}
if (upArrow) {
lemon_mc.y-=speed;
}
if (downArrow) {
lemon_mc.y+=speed;
}
}


Code:
1. This sets the arrow variables initially to false.
2. Two more listeners are added from the previous tutorial. The key up and key down listener detect when the keyboard key are up or down. The enter frame listener deals with the movement of the object.
3. This function detects when the keyboard keys have been pressed and sets the arrow variable to true.
4. This function detect when the keyboard key have been released and sets the arrow variable to false.
5. This function moves the object 5 pixels when the keys have been pressed. This value can easily be changed.


Step 2

Test your movie clip Ctrl + Enter. You should now be able to move the object simultaneously in two directions. Try using two keyboard arrows to move the object. Obviously, if you have both the: up & down, and left & right key pressed, the object won’t move.



If you wish to limit the stage boundaries of the object then checkout this tutorial, and if you want to use the Key.isDown() method from AS2 to move the object, checkout this tutorial. To rotate the movie clip using the keyboard key, take a look at Keyboard controls in AS3 part 3.

5 comments:

Papa 27 September 2009 at 18:33  

This has been very helpful for me!

I was having a very hard time figuring out how to do this.


I was wondering, how would I set up some kind of obstruction like a wall or something?

iliketo 28 September 2009 at 03:44  

@Papa

Try using a the hitTestobject method.

Mark 24 February 2010 at 13:48  

Is is possible, instead of having it Up Arrow, Down Arrow, etc. to have an actual letter key control the movement, like A to go left and S to go right?

iliketo 24 February 2010 at 15:15  

@Mark

Sure it's possible to use the other characters in the keyboard. You will need to know the keycode of the character you intend to use. Take a look at this tutorial. The code in step 1 will trace out the keycode of the characters you type out on the keyboard.

telana 15 April 2011 at 22:49  

thanks this is the best i have found

  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP