Exploring the Event Object

Every time an event occurs in Flex framework, whether it is a user clicking a button or the creationComplete event signaling that all components are ready for use, an Event object is created. This object is an instance of the Event class and contains important information about what type of event occurred and the object that emitted the event. You have the power to add your own custom events to the Event object. You will work with events much more in future lessons to produce applications that are loosely coupled and follow good object-oriented design.

This procedure defines a project you will use for exploring the event object.

1.	Define a new project with the name of EventTest and be sure that the EventTest.mxml file is the main application file.
2.	Open the EventTest.mxml file and add an <mx:Button> tag. Assign the <mx:Button> tag an id of myButton. Add a click event that will call the myFunction() function and pass it an instance of the Event class, as follows: <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*" layout="absolute"> <mx:Button click="myFunction(event)"/> </mx:Application> This very simple application calls a function when the user clicks a button. It passes the function an instance of the Event class, which is created automatically every time any type of event fires. The event object that is created is extremely powerful because the object contains important information about the event that occurred.
3.	Above the <mx:Button> tag, add a script block. Inside of this block, define a new function with the name of myFunction(). Specify the parameter as event:Event, as shown: <mx:Application xmlns:mx="http://www.adobe.com/2005/mxml" xmlns="*" layout="absolute"> <mx:Script> <![CDATA[ public function myFunction(event:Event):void{ } ]]> </mx:Script> <mx:Button click="myFunction(event)"/> </mx:Application> The function will capture the event when the user clicks the button. In the next step, you will see the useful information that is encapsulated inside this Event object.
4.	Inside the myFunction() function, add two trace statements that will trace the currentTarget and the type property: private function myFunction(event:Event):void{ trace (event.currentTarget); trace (event.type); } Both the currentTarget and type properties are automatically added to every instance of an Event object. The current target is the name of the control that generated the event; in this case, myButton. The type is a simple string of the event itself; in this case, click.
5.	Debug the application and click the button. In the output panel, you should see the fully qualified path to the myButton component that emitted the event and the name of the event that was emitted; in this case, click.