- The Basic Smart Clips
- RadioButton Smart Clip
- CheckBox Smart Clip
- Menu Smart Clip
- Summary
This chapter is from the book
This chapter is from the book
This chapter is from the book
RadioButton Smart Clip
The RadioButton smart clip has the same functionality and purpose as the HTML radio button. You use radio buttons when you want your viewer to pick one item out of a list of several.
You can pass four different parameters into the RadioButton smart clip:
_name. The instance name of the radio button on the Stage. By default, each instance of the RadioButton you drop on the Stage is assigned an instance name of radioBox1. If you want to do anything useful with your radio buttons, make sure you change this so that they have unique instance names. Remember, these are objects—if they have unique instance names, you can get information about them. As is the case when assigning instance names normally, don't use any spaces.
checked. Indicates whether the radio button is selected by default. The whole point of radio buttons is that you can pick only one of several options. Don't set the value of checked to be true for more than one radio button. If you set the value of checked to true for more than one radio button, Flash assumes that you really meant to choose the last instance that was placed on the Stage.
label. Indicates the text to be displayed next to the radio button.
style. Indicates whether to display the radio button using the Windows or Macintosh style. The default setting of "auto" causes Flash to display the button based on the user's operating system.
Adding radio buttons to the Stage is as simple as drag and drop.
TIP
The _name property overrides the instance name, if it has been set in the Clip Parameters panel.
Changing the default variable values in a smart clip symbol does not change the values of the instance(s) on the Stage.
Exercise 20.1 Adding RadioButton Smart Clips
Before you can begin to work with the RadioButton smart clip, you need to open the Smart Clip Library (Window > Common Libraries > Smart Clips) and drag an instance of the RadioButton onto the stage.
-
Open smartclip.fla from your CD and then open the Smart Clips Library (Window > Common Libraries > Smart Clips).
Add a new layer and name it radio buttons. With the radio buttons layer selected, drag the RadioButton smart clip from the Smart Clips Library onto the Stage.
-
Duplicate the RadioButton smart clip on the Stage twice (Edit > Duplicate or Control+D or Command+D). Position all three smart clips in the Radio Button section of the movie. (See Figure 20.2.)
Figure 20.2 Drag a copy of the RadioButton smart clip onto the Stage and make two duplicates. Position all three smart clips in the Radio Buttons section of the Stage.
Open the Clip Parameters panel by right- or Control-clicking the first instance of the RadioButton smart clip on the Stage and selecting Panels > Clip Parameters.
TIP
Resize the Clip Parameters panel so that you can see both the Name/Value and Description panes.The Description pane gives you valuable information about the clip you are modifying.
-
To change the value of a parameter, you have to double-click the current value. For _name and label, you edit the text, but for checked or style, you select a value from the drop-down list. (See Figure 20.3.) For the three instances that are on the Stage, change the values for the parameters to the following:
_name: radioBox1 checked: false label: Red style: Auto _name: radioBox2 checked: false label: Blue style: Auto _name: radioBox3 checked: true label: Green style: Auto
You'll notice that when you change the values of the parameters, the clips on the Stage don't change. You won't see any changes until you test your movie.
Figure 20.3 You use the Clip Parameters panel to set the parameters for the three radio buttons.
NOTE
To change the font style and color of radio button descriptive text, edit the RadioButton Assets movie clip in the Library. Pay attention when you do this; there's more than one frame with text in it.Alternately, double-click one of the instances on the Stage three times to edit the text. Use the Character panel to make any changes.You also can change the size and appearance of the actual radio button as well—just edit it.
Test your file. You should be able to click any radio button to select it, but you can select only one at a time.
){kind=link}
){kind=link}
The CheckBox smart clip is very similar to the RadioButton smart clip. They share most of the same parameters.