Accessing Multiple Buttons in UI Components #2 Message Box - Page 2

Accessing Multiple Buttons in UI Components #2 Message Box

Next, just for fun, drag a "Push Button" onto the stage from the "Components" Panel. Open it's "Properties" Panel and give it an instance name, and make up a "Click Handler" name. I named my instance "myButton", labeled it "Try Again", and called the "Click Handler" "tryButton."

Now unlock the message box, and un-hide it. The images on your stage should look something like this.

Our dynamic text field is underneath the message box, but will become visible when the box closes. The box will close as soon as a button is clicked as part of it's "Close Handler" function.

By default, the message box starts off with a _visible property of true meaning the box is visible on the screen. This makes it easy to get rid of the box and bring it back just by changing it's _visible property-- no shuffling it off and on the screen, no switching back and forth between frames. In most cases in a "real" application you will probably start with the box hidden-- that is with it's property set to false.

Everything else we need to take care of to make this work is in the "Close Handler" function, so let's go take a look at that. First we want to "close" the box by changing it's _visible property to false.

Now the tricky part. I won't go into everything I went through or everything I did or didn't discover along the way, but will pretty much stick to the basics here. From what notes there are on this component and from digging through the debugger, I did discover that the buttons are all stored in an array, and each entry in this array gets a corresponding movie clip of the button component. Flash names the movie clips "buttons_mc" plus the array index of the button. Flash actually stacks these components together to make a single unit. Reading through the debugger also told me that these buttons had a "state" that could be read. The "state" indicates if the button as been clicked or not, and is expressed as either true or false.

So the first if block has the condition of checking the first button-- button "0" (remember this is an array that starts numbering with "0")-- to see if it's state is true -- meaning "has it been clicked or not?" If it has been clicked, we set the text of our dynamic text box to "Yes", corresponding to the first button in our set. The second statement in that if block sets the state of the button back to it's unclicked state-- false. You must be sure and reset the button state-- it does not automatically reset.

The other two if blocks simply repeat these actions, testing the other two buttons.

One last piece of business is to add a function that is out "Click Handler" for the "Try Again" button. Pretty simple stuff here-- just make the window visible again and clear the text in the dynamic box.

Use Control->Test Movie to run this. Click a button and the message box closes, showing the name of the button you clicked on the screen, demonstrating that we actually captured the button click correctly. Enjoy!