Swish-Designs.co.uk where imagination is the creation

Welcome, Have a Nice Friday

How To Create Radio Buttons In - SwishMax

Learn how to create fully functionable radio buttons with swishmax.

First Of All

Open swishmax and set the size for the movie, i have used 150 x 100

and frame rate of 25 fps.

Step.1

Using the Elipse tool and whilst holding down the Shift Key drag out a circle approximately 14 pixels wide and 14 pixels high.
by holding down the shift key whilst dragging you will get a uniform shape.
give a solid line colour of #336699 and a linear colour fill of #CCCCCC with the transparency set to 80 to solid #FFFFFF, when you have done that right click on the shape -->Transform --> Rotate 90, Now name the shape as radio_button_1 you should have something like fig.1 below.

This is an enlarged view.

Fig.1

Step.2

Now to create the marker, again using the Elipse tool and whilst holding down the Shift Key drag out another circle this time Approximately 7 pixels wide x 7 pixels high, and give a radial gradient fill colour of solid #00FF00 to solid #339933 now right click --> Group As Sprite and name option_1
you should have something looking like fig.2 below
This is an enlarged view.

Fig.2

Step.3

Now place the option_1 sprite in the center of the radio_button_1 select both shapes and group together as a sprite, name the sprite as set_1 you should now have something looking like fig.3 below
This is an enlarged view.

Fig.3

Step.4

To add more buttons just copy and paste the option_1 sprite and the radio_button_1 shape in place, and with the new shapes selected move them into place using the arrow keys.
name the duplicate items as option_2 and radio_button_2, now using the text tool name your options i have used 1 & 2, you should now have something looking like fig.4 below.
This is an enlarged view.

Fig.4

you can have as many radio buttons as you wish, just keep duplicating them and renaming then addin one to the number, but for the tutorial we are just going to have two.

Step.5

Now to add the code to make the buttons work.
Add the following code to the set_1 sprite

Code:

onLoad () {
option1="true";
option2="false";
}
onEnterFrame() {
radio_button_1.useHandCursor = false;
radio_button_2.useHandCursor = false;
if (option1=="false") {
option_1._visible=false;
}
if (option2=="false") {
option_2._visible=false;
}
if (option1=="true") {
option_1._visible=true;
info="option 1 is selected";
}
if (option2=="true") {
option_2._visible=true;
info="option 2 is selected";
}
}

now on the radio_button_1 shape add the following code

Code:

on (press) {
option1="true";
option2="false";
}

 

and finaly on the radio_button_2 shape add the following code
Code:

on (press) {
option2="true";
option1="false";
}

Thats it Now press Ctrl+t to test it working in the player.
Thank You for reading.