<< Chapter < Page | Chapter >> Page > |
Set the size
The constructor in Listing 3 begins by setting the width and height properties of the Canvas object to set the overall dimensions of the object in pixels.
Set the text for the upper-left Label object
The constructor sets the text property of the Label object referred to by canvasLabel to the small text shown in the upper-left corner of Figure 1. Since the x and y coordinate values for thisobject are not purposely set, they will each have a default value of zero. This will cause them to be placed in the upper-left corner of the canvas as shown in Figure 1.
Set various properties for the TextArea object
Then the constructor sets various property values for the TextArea object, including its text, its dimensions, and its location coordinates. As Imentioned earlier, the sole purpose of this object in this program is to provide operating instructions.
Set various properties for the target Label object
The Label object that is referred to by targetLabel in Listing 3 is used to display the character for the key that is pressed asshown by the large lower-case "a" in Figure 2.
The constructor sets various properties for this object including a font size of 30 points and an initial string value that is an empty string.
Add the objects to the Canvas
Then the constructor calls the addChild method on the Canvas object three times in succession to add the three objects to the canvas in the locations specifiedby their location coordinates.
Set the background color to yellow
The constructor sets the background color of the canvas to yellow. Otherwise, it would be indistinguishable from the gray background color of the Flashwindow.
Register event listeners
Finally, the constructor registers two event listeners on the Canvas object.
A MouseEvent.CLICK listener
The first event listener that is registered is one that will handle events of the type MouseEvent.CLICK . As you will see shortly, this handler causes the Canvas object to gain the focus when the user clicks the canvas with the mouse.
A KeyboardEvent.KEY_DOWN listener
The second listener that is registered is one that will handle events of the type KeyboardEvent.KEY_DOWN and display the character for the key that is pressed as shown by the large lower-case "a" in Figure 2.
The MouseEvent.CLICK listener
This listener is shown in its entirety in Listing 4.
private function clickHandler(event:MouseEvent):void {
stage.focus = this;}//end clickHandler
As I explained earlier, the sole purpose of this event listener is to make it possible for the user to cause the yellow canvas object to gain the focus.
Rather than attempt to explain the one statement in the method in Listing 4, I will refer you to the page in the Adobe documentation that explains it.
The KeyboardEvent.KEY_DOWN listener
The method shown in Listing 5 is executed each time any key is pressed. However, some of the keys, such as the shift key, aren't represented by a character thatcan be displayed.
private function eventHandler(
event:KeyboardEvent):void {targetLabel.text =
String.fromCharCode(event.charCode);} //end eventHandler
Notification Switch
Would you like to follow the 'Object-oriented programming (oop) with actionscript' conversation and receive update notifications?