Detecting Keypresses

I l @ ve RuBoard

There are three ways to detect a single keypress on the keyboard. The first uses buttons . The second uses the Key object. A third method is new to Flash MX and uses listeners.

Detecting Key Presses Through Buttons

Strangely enough, you can use buttons to detect keyboard key presses. All you need to do is use a special on handler in the script attached to the button. For instance, here is a handler that looks for the "a" key to be pressed:

 on (keyPress "a") {     trace("Key 'a' pressed."); } 

The example movie 09keybutton.fla has a simple button on the screen with this script and some other examples in it. If you run the movie and press "a" on your keyboard, the message will go to the Output window. If it does not, the test window probably doesn't have focus. Click in the test window to give it focus.


Because the keyboard doesn't have a position on the screen like the mouse does, the question often arises as to what element on the screen do keystrokes get routed to. In many cases, such as Web browsers and other complex applications such as Flash, many elements can accept keyboard input at any one time.

The one element that gets the keystrokes is said to have keyboard focus. For instance, in a Web form, the field being typed into has focus, whereas the other fields do not. When you are finished with a field, you usually press Enter, Return, or Tab to move the focus to the next field.

Windows work the same way. Only one window will have keyboard focus. In this case, we want to make sure that the movie testing window has focus so that the buttons in the movie get the keystrokes. To ensure focus, clicking on the window or field usually does the trick.

The on (keyPress) handler is case sensitive, so one that detects "a" will not detect "A." You'll need to use a separate on (keyPress) handler for the capital "A." Fortunately, button scripts can contain as many on handlers as you want.

If you want to detect other keys, such as the arrow keys, there are special codes for these. For instance, <Left> can be used to detect the left arrow key.

 on (keyPress "<Left>") {     trace("Left pressed."); } 

Here is a list of other special codes:

<Left> <End> <PageUp>
<Right> <Insert> <PageDown>
<Up> <Delete> <Tab>
<Down> <Backspace> <Escape>
<Home> <Enter> <Space>

You can also combine events in an on statement. For instance, suppose that you want to have a button that has a keyboard shortcut. You would normally just do an on (release) handler. However, you can also do a slightly more complex handler that would handle the click and a key press at the same time:

 on (keyPress "b", release) {     trace("'b' pressed or button clicked."); } 

You can see all these code examples at work in the 09keybutton.fla example movie. Try the "a" key and the "A" key. Try the left arrow key. Also try clicking the button and pressing "b".

The Key Object

Although buttons are useful for getting a single key press, they are no good for detecting whether a key is being held down ”for instance, if you want to make a game where the player's character continues to move as long as the arrow keys are pressed.

For this type of functionality, you need the Key object. The Key object is a set of functions and constants built into Flash. You can use these functions and constants to determine whether a key is being pressed. For instance, to see whether the left arrow key is pressed, use this code:

 if (Key.isDown(Key.LEFT)) {     trace("The left arrow is down"); } 

The Key.isDown function returns a true or false depending on whether the key listed as a parameter is pressed. The Key.LEFT constant represents the left arrow key. So this if statement is true when the left arrow key is pressed.

The list of constants like Key.LEFT reads just like the previous list of constants understood by buttons. It has a few more keys, such as Control and Shift. It also has different spellings for other keys.


But what if you want to detect a normal key such as "a"? You still need to know the code for the key; you can't just use the character "a." The Key.getCode function does that. Here is an example:

 if (Key.isDown(Key.getCode("a")) {     trace("The left arrow is down"); } 

The example movie 09keyobject.fla has a movie clip with a script that demonstrates both of the previous examples.

Key Listeners

The problem with the Key object method of detecting key presses is that it cannot detect the initial key press. It just tests, over and over again, for the key to be down.

Consider a slow computer. The onClipEvent(enterFrame) handler runs and checks for the "a" key to be down. It isn't. Then the user clicks down on it quickly, before the next time the onClipEvent(enterFrame) runs. When the onClipEvent(enterFrame) does run, the key is no longer pressed. The key press is never recognized by the handler. So a user can click quickly, and your Flash movie will miss it.

Another problem would occur if you want the user to click multiple times. For instance, pressing space could fire a bullet in a game. The Key object might not be able to tell the difference between one long click and series of quick ones.

In Flash MX, you have a third choice when it comes to listening for key presses. You can create a listener to pay attention for the key press event to occur.

A listener has two parts . The first part is its creation. You have to tell the movie that you want it to listen for an event. In this case, you tell it with the following command:


The Key.addListener command takes an object, such as the root movie or a movie clip, as its parameter. This is the object that gets a message when the event happens.

In this case, the root level of the movie gets the event. For the root level to respond to this event, it should have a function that has been assigned to handle it.

The key listener can send two different types of messages: onKeyUp and onKeyDown . To make a function that handles one of these, you write code that looks like this:

 _root.onKeyUp = function() {     trace(Key.getAscii()); } 

You could also use another object, such as a movie clip, in place of _root , as long as it was the same object used in the Key.addListener command.

The Key.getAscii() function returns the ASCII code for the key pressed. ASCII code is a number that corresponds to a character: "A" is 65, "B" is 66, and so on.

Take a look at the movie 09keylistener.fla to see this code in action. Notice that it has absolutely no movie clips in it; it doesn't need any. The script is placed on the first and only frame of the main timeline.

Furthermore, if you want to see real characters rather than ASCII codes, you can use the String.fromCharCode() function to convert them. Here is the new line:


Movie Clip Key Events

There is actually a fourth way to detect key presses. This is to use the onClipEvent handlers keyDown and keyUp . You then need to use Key.getAscii() to determine which key was pressed.

I won't go into this method; it is obsolete now that Flash MX has introduced listeners. However, you should know about it in case you see it in older code examples.

I l @ ve RuBoard

Sams Teach Yourself Flash MX ActionScript in 24 Hours
Sams Teach Yourself Flash MX ActionScript in 24 Hours
ISBN: 0672323850
EAN: 2147483647
Year: 2002
Pages: 272 © 2008-2017.
If you may any questions please contact us: