Creating Interaction with ActionScript > Creating complex interactivity > Capturing keypresses |
![]() ![]() ![]() |
Capturing keypresses
You can use the methods of the built-in Key object to detect the last key the user pressed. The Key object does not require a constructor function; to use its methods, you simply call the object itself, as in the following example:
Key.getCode();
You can obtain either virtual key codes or ASCII values of keypresses:
![]() |
To obtain the virtual key code of the last key pressed, use the |
![]() |
To obtain the ASCII value of the last key pressed, use the |
A virtual key code is assigned to every physical key on a keyboard. For example, the Left Arrow key has the virtual key code 37. By using a virtual key code, you ensure that your movie's controls are the same on every keyboard, regardless of language or platform.
ASCII (American Standard Code for Information Interchange) values are assigned to the first 127 characters in every character set. ASCII values provide information about a character on the screen. For example, the letter "A" and the letter "a" have different ASCII values.
To decide which keys to use and determine their virtual key codes, use one of these approaches:
![]() |
See the list of key codes in Keyboard Keys and Key Code Values. |
![]() |
Use a Key object constant. (In the Actions toolbox, click the Objects category, click Movie, click Key, and click Constants.) |
![]() |
Assign the following clip action, then choose Control > Test Movie and press the desired key: |
onClipEvent(keyDown) { trace(Key.getCode()); } |
The key code of the desired key displays in the Output window.
A common place to use Key object methods is within an event handler. In the following movie, you move the car using the arrow keys. The Key.isDown
method indicates whether the key being pressed is the right, left, up, or down arrow. The event handler, onEnterFrame
, determines the Key.isDown(
keyCode
)
value from the if
statements. Depending on the value, the handler instructs the Flash Player to update the position of the car and to display the direction.
The following procedure shows how to capture keypresses using a car example.
To create a keyboard-activated movie clip:
1 |
On the Stage, create a movie clip that will move in response to keyboard arrow activity. |
In this example, the movie clip instance name is |
|
2 |
On the Stage, create a dynamic text box that will be updated with the direction of the car. Using the Property inspector, give it a variable name of |
Note: Don't confuse variable names with instance names. |
|
3 |
Select frame 1 in the Timeline; then choose Window > Actions to open the Actions panel if it is not already visible. |
4 |
To set how quickly the car moves across the screen with each keypress, in the Actions toolbox, click the Actions category, click Variables, double-click |
5 |
To create the event handler that processes the event and subsequent behavior, in the Actions toolbox, click the Objects category, then click Movie, Movie Clip, and Events, and double-click |
6 |
Click in the Parameters text box to place the insertion point. Then click the Actions category, click the Variables category, and double-click |
Your code should look like this: |
|
speed = 10; car.onEnterFrame = function() { with (car) { } }; |
|
7 |
To add the conditions to the event handler, in the Actions toolbox, click the Actions category, click Conditions/Loops, and double-click |
8 |
Click in the Condition text box to place the insertion point. Click the Objects category, click Movie, Key, and Methods, and double-click |
speed = 10; car.onEnterFrame = function() { with (car) { if (Key.isDown(Key.RIGHT)) { } } }; |
|
Next, the |
|
9 |
To enter the conditional statements, in the Actions Toolbox, click the Operators category; then click Assignment, and drag |
_x += speed |
|
10 |
To limit the car to the right edge of the movie, add a nested |
|
|
11 |
Click the Actions category, click Variables, and double-click |
12 |
To update the dynamic text box, in the Actions toolbox, click the Actions category, click Variables, and drag |
Your code should look like this: |
|
speed = 10; car.onEnterFrame = function() { with (car) { if (Key.isDown(Key.RIGHT)) { _x += speed; if (_x >= 339) { _x = 339; } _root.display = "Right"; } } }; |
|
You can take the time now to test the movie (Control > Test Movie), but the car will only move to the right. |
|
13 |
To add the left, up, and down movement, in the Actions Toolbox, click the Actions category, click Conditions/Loops, and drag |
} else if (Key.isDown(Key.LEFT)) { _x -= speed; if (_x < 60) { _x = 60; } _root.display = "Left"; } else if (Key.isDown(Key.UP)) { _y -= speed; if (_y < 114) { _y = 114; } _root.display = "Up"; } else if (Key.isDown(Key.DOWN)) { _y += speed; if (_y > 244) { _y = 244; } _root.display = "Down"; } |
|
Make sure to place your code on the correct lines (lines 10 through 28). The bracket that closes the outer |
|
14 |
Choose Control > Test Movie to test the movie. |
For more information about the methods of the Key object, see Key (object) in the ActionScript Dictionary.
![]() ![]() ![]() |