• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Hour 16. Using Components > Task: Apply the Radio Buttons

Task: Apply the Radio Buttons

Although our radio buttons are nice, they don't really do anything. Follow these steps to make some practical use out of the buttons:

Using the task you just completed, draw a rectangle (which will become a button) and put the text “proceed” on it. Convert it to a button and name it Proceed.

Make sure that the button is on the Stage in frame 1 (with the three instances of radio buttons). Go to frame 2 and insert a blank keyframe (F7). On the screen, create a Dynamic Text block and associate it with the variable name message. Go back to frame 1, and we'll make it so that when the user clicks Proceed, the user's skill level is determined and then the second frame displays an appropriate message.

Select the instance of your Proceed button and open the Actions panel. The following steps are far easier if you first use the Action Panel's Options menu to change to Expert Mode. Insert an on mouse event by pressing Esc followed by “O” and then “N.” Select press from the drop-down list (to insert press between the parentheses). After the opening curly brace ({), insert a new line and type: message="You selected blank". Insert a new line and type: nextFrame(). Before you test the movie, place a stop() Action in the first keyframe. Now test the movie. It doesn't fully work—that is, we still need to show a message that indicates that we know which radio button was selected (not just “You selected blank” every time).

Return to the movie and open the Actions panel with the button selected. We need to replace “blank” with the selected button's label. There happens to be a built-in method (under Flash UI Components, FRadioButton, FRadioButton Group) called getValue(). Simply change the line of code starting with message= to the following:

message="You selected " + radioGroup.getValue()

Notice that radioGroup was the default Group Name parameter that each button in this group shares.

Go ahead and test the movie and see whether you can find a minor bug (that we'll fix next). If you don't see the bug, test the movie and click the Proceed button before selecting any radio button. (The message will just say “You selected”.)

One solution to the issue (of the user never making a selection) is to simply make one radio button selected by default. Select the first RadioButton Component instance on the Stage (the one for Novice) and, from the Properties panel Parameters tab, change the initial state from false to true. That's it! There are actually other (different) solutions, but that one works perfectly well.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint