Ben Silvis

Once you really get going into designing basically any kind of computer game – whether it be a 2-D platformer like Contra or even online video Poker – you are eventually going to need some kind of keyboard control besides general typing. Traditionally this could be the arrow keys or W,A,S,D for movement, spacebar for jumping or plasma-ray firing, R for retry or Q for quit, but really the level of control is up to you.

A keyCode is an integer representing a particular type of key on your keyboard. By differentiating between one keyCode and another in Flash, we can trigger separate events based on each individual keyboard key or combination of.

The example above displays the keyCode for each keyboard button.

Note: You will have to click the example to give your keyboard’s focus to the flash player.

Actionscript:

All you need to import is the KeyboardEvent class for our example.

Actionscript:

What we do here is:

1. Attach a KeyboardEvent listener to the stage
2. Create a new String of the pressed keyboard character
3. Listen for a particular key press that triggers an action

Actionscript:

Here we create a new event listener and attach it to the stage. We define the listener to be of type KeyboardEvent and to listen for any KEY_UP events. Lastly we instruct the listener to call function onKeyEvent every time this event occurs. Roughly speaking, every time we release a keyboard key we do something.

Actionscript:

Once we are working within our event fired function, onKeyEvent, we have access to all of the information concerning that event through ‘e‘. We can extract a lot from the event for just a simple button press, but for now we will just look at a particularly handy bit of info – charCode.

CharCode

A charCode is an ASCII code that represents a character on a keyboard. (a,b,c,D,E,F,1,2,3,!,@,#..) Each character has its own unique code – For instance: the charCode for ‘A’ is 65, being different from ‘a’ which is 97. Even a spacebar space has a charCode (32) because each space is a recognized character.

Note: Keyboard buttons like ‘Enter’, ‘Ctrl’, and ‘Num Lock’ do not have charCodes. (They return a charCode of 0)

In the code snippet above we do something relatively complex to accomplish a task assumedly simple. We convert the typed keyboard character’s ASCII alter-ego into the character we understand intelligibly. Your OS does this constantly for you when in fact all your keyboard knows is which key is pressed. This is necessary for keyboards of multiple languages to function.

fromCharCode(... charCodes):String

So, what we accomplish here is: fromCharCode – a method of the String class – takes a charCode, converts it and returns the respective character as a String which we then pass to a new variable character.

Actionscript:

KeyCode

Now that we understand charCode, keyCode should be easy. Like briefly mentioned above, a keyCode is a number associated with a button on your keyboard – contrary to a character like that of a charCode. Working with a keyCode for keyboard driven events is more useful than charCodes because generally: for instance, when ‘X’ is pressed you are not concerned with whether or not it is the capitalized form or not.

In the above ‘if statement’, we simply evaluate whether the keyCode input is equal to 66 (The code for the ‘B’ key). If this is true we print character,which we captured in the previous block, to the output screen. Since 66 in this case pertains only to the keyboard button for ‘B’, character could be either lowercase ‘b’ or capital ‘B’.

You could replace this trace with anything! In the example at the top, character is placed inside of a text box and randomly attached to the stage.

Actionscript:

Here our code is a lot like the last block except this time, in addition to needing a particular keyCode, we are listening for the Shift key. The shiftKey Boolean is yet another KeyboardEvent attribute we have access to that tells us whether or not the Shift key is pressed. Ergo, if we press both the ‘S’ key (83) and the Shift key we will satisfy the statement and trace character. In this case, since the Shift key is down, we can only expect a capital ‘S’ (Granted Caps Lock isn’t on ).

Besides Shift, KeyboardEvent also lets us listen for Ctrl and Alt. Check out the Adobe documentation for all of the attributes.

Concluding..

By now you should hopefully have a better understanding of the KeyboardEvent class. Feel free to post or message me with any additional questions you might have!

The source to the example is available below

Note: When testing the example inside the Flash IDE, the internal shortcut keys tend to override your programmed events. To prevent this you will need to disable them. Control > Disable Keyboard Shortcuts

Ben

Download Source