Actionscript Key Listener Tutorial

August 1, 2008 at 7:23 pm · 1,093 views · Filed under tutorial

Overview

Allowing users to use the keyboard as well as the mouse is a great way to incite interaction with your flash. This tutorial will show how to code it and what you can do with some keyboard events. This changed with actionscript 3, note this tutorial is AS3.
altKeY (Boolean) Indicates whether the Alt key is active (true) or inactive (false).
charCode (uint) Contains the character code value of the key pressed or released.
ctrlKey (Boolean) Indicates whether the Control key is active (true) or inactive (false).
keyCode (uint) The key code value of the key pressed or released. KeyboardEvent
keyLocation (uint) Indicates the location of the key on the keyboard. KeyboardEvent
shiftKey (Boolean) Indicates whether the Shift key modifier is active (true) or inactive (false).

Steps

1. import KeyboardEvent,

   import flash.events.KeyboardEvent;

2. assign any keycodes

   //keycodes
   var left:uint = 37;
   var up:uint = 38;
   var right:uint = 39;
   var down:uint = 40;

3. add event listener KeyboardEvent.KEY_DOWN

   stage.addEventListener(KeyboardEvent.KEY_DOWN,keyDownListener);

4. respond to keys

   function keyDownListener(e:KeyboardEvent) {
           trace(e.keyCode.toString());
   }

   or

   function keyDownListener(e:KeyboardEvent) {
           if (e.keyCode==left){
   		ship.x-=10;
   		ship.rotation = 90;
   	}
   	if (e.keyCode==up){
   		ship.y-=10;
   		ship.rotation = 180;
   	}
   	if (e.keyCode==right){
   		ship.x+=10;
   		ship.rotation = 270;
   	}
   	if (e.keyCode==down){
   		ship.y+=10;
   		ship.rotation = 0;
   	}
   }

Example

Here we have a swf with the keyboard event listener on the stage, and feedback boxes to give us all we can know about the event. It will tell us about certain keys (alt, ctrl (cmd), and shift) with a Boolean, it will tell us the keyCode and the charCode. The keyCode is the number that is tied to the actual button pressed or key, and the charCode relates to the character represented by the button(s) pressed. So hitting ’s’ and then hitting ’shift + s’ will tell you different charCodes, ’s’ and ‘S’. but you’ll see that the s key has the same keyCode (you’ll also see the ’shift’ keyCode as well). If needed you can use the String.fromCharCode function to determine what the charCode for something is. The location on the keyboard is even reported, this helps distinguish between the left shift and the right shift and even the numbers across the qwerty and the numpad on the right of the screen.

Actionscript

Download

source file download: key-listener.fla

Tags: actionscript, as3, download, interactive, open source, tutorial

Comments (2)