Sunday, 20 September 2009

Radio button component in Actionscript 3

In this tutorial I will teach you how to use the radio component in Actionscript 3.0. I have created a simple quiz which uses the radio components, but you could also create a form if you wish. Some knowledge of basic buttons is also need for this tutorial.


Radio button component in Actionscript 3

Step 1

Open a new Flash AS3 file.
Select the Text tool with static text and type your message on the stage. I will be creating a quiz, so I have typed the following question: “What is the capital of Great Britain?” You can type whatever question you wish.


Step 2

Drag four radio components from the components window by selecting Window > Components and place the components beneath each other on the stage. Then drag a button component on the stage as show below. You can alternatively create your own button if you wish.




Step 3

Select Window > Component Inspector to open up the component inspector and change the labels of each of the radio buttons, and also change the label for the button.


Step 4

Select each radio button and give the following instance name accordingly: radiobutton1, radiobutton2, radiobutton3 and radiobutton4. Then give the button the following instance name: showAnswer_btn


Step 5

Select the Text tool with dynamic text and drag a text field below the ‘Show Answer’ button as show below. Then give the dynamic text field the instance name: ‘result_txt’




Step 6

On the timeline create a new layer called ‘Actions’ then open up the Actions panel (F9) and enter the following code:

//import the nessary controls for the radio button.
import fl.controls.RadioButtonGroup;

//This sets a group nanme for the radio button instances.
var myradioGroup:RadioButtonGroup=new RadioButtonGroup("Group 1");

//This assigns the radio button instances to the radio group.
radiobutton1.group=myradioGroup;
radiobutton2.group=myradioGroup;
radiobutton3.group=myradioGroup;
radiobutton4.group=myradioGroup;

//Mouse click event listener added to the button.
showAnswer_btn.addEventListener(MouseEvent.CLICK, showResult);

//This function displays the appropriate answer when the button is clicked.
function showResult(event:MouseEvent):void {
switch (myradioGroup.selection) {
case radiobutton1 :
result_txt.text="Wrong answer";
break;
case radiobutton2 :
result_txt.text="Correct answer";
break;
case radiobutton3 :
result_txt.text="Wrong answer";
break;
case radiobutton4 :
result_txt.text="Wrong answer";
break;
}
}

Step 7

Test your quiz Ctrl + Enter. Now try choosing different values from the radio buttons and hitting the show answer button.



You should now be able to use the Radio button component in Actionscript 3.0.

2 comments:

stublackett 7 October 2009 at 03:15  

There isnt a capital of Great Britain.

There is a capital of England, a capital of Scotland and an capital of Wales.

But not Great Britain. London is the capital of England

iliketo 7 October 2009 at 10:20  

@stublackett

You are unfortunately incorrect!!!

London is definitely the capital of Great Britain (look it up on the internet). You are thinking of Capital Cities in the UK. Below is a list of the Capital Cities:

England - capital city, London
Scotland - capital city, Edinburgh
Wales - capital city, Cardiff
Northern Ireland - capital city, Belfast.

  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP