<< 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.

The mouseevent.click listener.

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.

The keyboardevent.key_down listener.

private function eventHandler( event:KeyboardEvent):void {targetLabel.text = String.fromCharCode(event.charCode);} //end eventHandler

Get Jobilize Job Search Mobile App in your pocket Now!

Get it on Google Play Download on the App Store Now




Source:  OpenStax, Object-oriented programming (oop) with actionscript. OpenStax CNX. Jun 04, 2010 Download for free at http://cnx.org/content/col11202/1.19
Google Play and the Google Play logo are trademarks of Google Inc.

Notification Switch

Would you like to follow the 'Object-oriented programming (oop) with actionscript' conversation and receive update notifications?

Ask