Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Sponsored By

The Very Best Algebra Notes

The Very Best Algebra Notes for the Very Best Flash Games


FLASH ACTIONSCRIPT LESSON: Using the arrow keys to move objects in games

In this lesson, students learn how control the movement of stage objects with the arrow keys on the keyboard. Students select images, add them to the stage, and convert them to symbols. Students then create the AS3 code that will make the image on the stage up, down, right or left with the arrow keys on the keyboard.


The AS3 API object, components, methods and properties used in the lesson include addEventListener, keyBoardEvent (UP, DOWN, RIGHT, LEFT), event.ENTER_FRAME, event.keyCode, removeEventListener and others.

To activate the flash program, click the stage. To move the green character use the left, right, up or down arrow keys on your keyboard. The up key makes the character jump. The other keys move the character one pixel.


To schedule an online Flash lesson, contact


Text: (707)235-4095



//Making an object move when you press an arrow key on your keyboard is an essentional operation built into almost every game program. In fact, there are few games, and even fewer text editors that don't make use of these keys to move everything including mouse cursors.

// Select the "File" menu.Select the Import menu option than select the "Import to Stage" option. Select a graphic file (jpeg or gif format) from the directory list that apeears. Use the graphic file named, "fashionmodel.jpg" for this example. Click the "Open" button to import the graphic.

//Click on the graphic image of the file that apears on the stage. Select the "Properties" option from the "Window" menu. Scale the size of the graphic image with values set in the "width" and "height" text boxes in the properties dialog box.

// Select the "Convert to Symbol" option from the "Modify" menu. Check the "Export for ActionScript" box than click the "OK" button. Click the "OK" button on the new dialog box that appears.

// Type in the instance name, "sleeves" in the "instance name" textbox in the properties panel.
// Select "Actions" from the "Window" menu to open up the ActionScript (AS3) editor).
//Enter the code in the editor to detect that the left arrow key has been pressed. Attach a KeyboardEvent listener to the stage that will detect when a key has been pressed and call an eventhander that determines which key was pressed. Use the code stage.addEventListener(KeyboardEvent,KEY_DOWN, whichKey) to add the listener, set the event type ot KEY_DOWN and call the eventhandler named, "whichKey".

//Code the whichKey eventHandler function. Include in the function code, an "if" statement that checks if the keyCode property of the key sent to it is the "left arrow" key. Code the "if" statement such that it moves the sleeves object five uints to the left every time the left key is pressed. Attach the x-position property to the "sleeves" object in the "if" statement to accomplish this. : function whichKey(event:KeyboardEvent): void {if (event.keyCode = Keyboard.RIGHT){sleeves.x = sleeves.x - 5}


var i: int = 1
stage.addEventListener(KeyboardEvent.KEY_DOWN, whichKey)
function whichKey(event:KeyboardEvent):
if (event.keyCode == Keyboard.LEFT){sleeves.x = sleeves.x - 5}

if (event.keyCode == Keyboard.RIGHT){sleeves.x = sleeves.x + 5}
//if (event.keyCode == Keyboard.UP){sleeves.y = sleeves.y/2}
if (event.keyCode == Keyboard.UP)


sleeves.addEventListener(Event.ENTER_FRAME, moveit);

function moveit(myevent:Event):void
sleeves.y = sleeves.y - 5;
if (sleeves.y < 0){sleeves.removeEventListener(Event.ENTER_FRAME, moveit);sleeves.addEventListener(Event.ENTER_FRAME, moveit1)}

function moveit1(myevent:Event):void

//trace (sleeves.y)
sleeves.y = sleeves.y + 5;
//sleeves.x = sleeves.x + 1
//sleeves.y = 0.01*Math.pow(sleeves.x, 2) + 100
if (sleeves.y > 280){sleeves.removeEventListener(Event.ENTER_FRAME, moveit1)}
//trace (sleeves.y, "this never ends", i = i + 1 )
//trace (sleeves.x, sleeves.y)