How to Create an Interactive Flash Glossary

Create an interactive glossary in Flash by writing a short ActionScript program. This program displays the glossary's definitions when a user clicks a button showing a word she wants the definition for. A key part of this program is the addEventListener statement because it tells Flash to trigger a function whenever the button referenced in that statement is clicked. To customize the quiz, add more buttons to the Stage using the project's instructions as your guide.

Instructions

1. Click the "File" menu's "New" command, then click "OK" to create a new Flash project. Drag two Buttons and a Label control from the Component panel to the Stage. The Buttons will display the words you want to show a definition for. The Label will show the definition when the glossary's user clicks a button.

2. Click the Label, then type "lblQ" in the text box atop the Properties panel to name the Label. This lets your program display a definition in the Label. Name the buttons "btn0," and "btn1," as you did the Label. Note that naming the buttons doesn't change the text they display. It only gives them a tag that your program needs to refer to the buttons.

3. Click the first button to select it, then type in the "Label" text box in the Properties panel a word you'd like to include in the glossary. For example, if you want the word "Paint" in the glossary, type that word in the "Label" text box just described. Type a different word in the "Label" text box for the second button.

4. Press "F9" to open the Actions panel, then paste the following ActionScript program into the programming window. This program displays a definition in the Label control when the glossary's user clicks a button. The program's "function" statements use the Label's "text" property to assign a definition from the strDef array to the Label.

   import flash.events.Event;
   import fl.controls.RadioButtonGroup;
   import fl.events.ComponentEvent;
   import flash.text.*;
   import fl.events.ColorPickerEvent;
   import flash.events.MouseEvent;
   var strDef:Array = ["definition 1", "definition 2" ];
   btn0.addEventListener(MouseEvent.CLICK, btnH0);
   btn1.addEventListener(MouseEvent.CLICK, btnH1);
   function btnH0(event:MouseEvent):void
   {
   lblQ.text = strDef[0];
   }
   function btnH1(event:MouseEvent):void
   {
   lblQ.text = strDef[1];
   }

5. Type over the "Definition 1" dummy definition with the definition of the word you labeled the first button with. For example, if you labeled the first button "Paint," you might type "Pigment applied to a canvas" for the definition. Type over the "Definition 2" bogus text with the definition for the second button.

6. Press "Control" and "Enter" simultaneously to run the interactive glossary. Each button shows a word in the glossary. Click a button to make the Label display the definition of the word displayed on the button.

References

• Adobe: Flash Add Event Listener