Använda komponenten RadioButton

Med komponenten RadioButton kan du tvinga användaren att göra ett enda val i en uppsättning med alternativ. Komponenten måste användas i en grupp med minst två RadioButton-förekomster. Endast en medlem i gruppen kan väljas åt gången. Om en alternativknapp väljs i en grupp avmarkeras den knapp som är markerad för tillfället. Du ställer in groupName -parametern så att den anger vilken grupp en alternativknapp tillhör.

En alternativknapp är en grundläggande del av många formulärprogram på webben. Du använder alternativknappar när du vill att användaren ska göra ett val i en uppsättning med alternativ. Du använder till exempel alternativknappar i formulär som frågar efter vilket kreditkort en kund vill använda.

Använda komponenten RadioButton

En alternativknapp kan vara aktiverad eller inaktiverad. En inaktiverad alternativknapp tar inte emot mus- eller tangentbordsinmatning. Om användaren klickar på en RadioButton-komponentgrupp får endast den valda alternativknappen fokus. Användaren kan sedan använda följande tangenter för att styra den:

Nyckel

Beskrivning

Uppil/vänsterpil

Markeringen flyttar till den föregående alternativknappen i gruppen med alternativknappar.

Nedpil/högerpil

Markeringen flyttar till nästa alternativknapp i gruppen med alternativknappar.

Tabb

Flyttar fokus från gruppen med alternativknappar till nästa komponent.

Mer information om att kontrollera fokus finns i avsnittet om gränssnittet IFocusManager och i klassen FocusManager i Referenshandbok för ActionScript 3.0 i Adobe Flash Professional och Arbeta med FocusManager .

En direktförhandsvisning av varje RadioButton-förekomst på scenen reflekterar ändringar som gjorts på parametrar i egenskapsinspektören eller komponentinspektören vid redigeringen. Men den ömsesidiga uteslutandet av markering visas inte i direktförhandsvisningen. Om du ger den markerade parametern värdet true för två alternativknappar i samma grupp ser båda ut som om de är markerade, även om endast den förekomst som skapades sist visas som markerad vid körningen. Mer information finns i Komponentparametrar för RadioButton .

När du lägger till RadioButton-komponenten i ett program kan du göra den åtkomlig för en skärmläsare genom att lägga till följande rader med kod: 

import fl.accessibility.RadioButtonAccImpl; 
RadioButtonAccImpl.enableAccessibility();

Du aktiverar bara en komponents åtkomlighet en gång, oavsett hur många förekomster du har av komponenten. Mer information finns i Kapitel 18, "Skapa åtkomligt innehåll" i Använda Flash .

Komponentparametrar för RadioButton

Du kan ställa in följande utvecklingsparametrar i egenskapsinspektören eller komponentinspektören för varje förekomst av RadioButton-komponenten: groupName, label, LabelPlacement, selected och value . Var och en av de här parametrarna har en motsvarande ActionScript-egenskap med samma namn. Information om möjliga värden på de här parametrarna finns i avsnittet om klassen RadioButton i Referenshandbok för ActionScript 3.0 i Adobe Flash Professional .

Du kan skriva ActionScript för att ange ytterligare alternativ för RadioButton-förekomster med hjälp av metoderna, egenskaperna och händelserna i RadioButton-klassen.

Skapa ett program med komponenten RadioButton

I proceduren nedan beskrivs hur du lägger till RadioButton-komponenter i ett program när du redigerar. I det här exemplet används RadioButtons för att visa en fråga där svaret kan vara ja eller nej. Data från RadioButton visas i en TextArea.

  1. Skapa ett nytt Flash-dokument (ActionScript 3.0).

  2. Dra två RadioButton-komponenter från panelen Komponenter till scenen.

  3. Markera den första alternativknappen. I egenskapsinspektören ger du den förekomstnamnet yesRb och gruppnamnet rbGroup.

  4. Markera den andra alternativknappen. I egenskapsinspektören ger du den förekomstnamnet noRb och gruppnamnet rbGroup.

  5. Dra en TextArea-komponent från panelen Komponenter till scenen och ge den förekomstnamnet aTa .

  6. Öppna åtgärdspanelen, markera bildruta 1 i huvudtidslinjen och ange följande ActionScript-kod: 

    yesRb.label = "Yes"; 
yesRb.value = "For"; 
noRb.label = "No"; 
noRb.value = "Against"; 
 
yesRb.move(50, 100); 
noRb.move(100, 100); 
aTa.move(50, 30); 
noRb.addEventListener(MouseEvent.CLICK, clickHandler); 
yesRb.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    aTa.text = event.target.value; 
}

  7. Välj Kontroll > Testa filmen för att köra programmet.

Skapa en RadioButton med ActionScript

I det här exemplet används ActionScript för att skapa tre RadioButtons för färgerna röd, blå och grön, och en grå ruta ritas. Egenskapen value för varje RadioButton anger det hexadecimala värdet på färgen som associeras med knappen. När användaren klickar på en RadioButton anropar clickHandler() -funktionen drawBox() och överför färgen från RadioButtons value -egenskap för att färglägga rutan.

  1. Skapa ett nytt Flash-dokument (ActionScript 3.0).

  2. Dra RadioButton-komponenten till bibliotekspanelen.

  3. Öppna åtgärdspanelen, markera bildruta 1 i huvudtidslinjen och ange följande ActionScript-kod: 

    import fl.controls.RadioButton; 
import fl.controls.RadioButtonGroup; 
 
var redRb:RadioButton = new RadioButton(); 
var blueRb:RadioButton = new RadioButton(); 
var greenRb:RadioButton = new RadioButton(); 
var rbGrp:RadioButtonGroup = new RadioButtonGroup("colorGrp"); 
 
var aBox:MovieClip = new MovieClip(); 
drawBox(aBox, 0xCCCCCC); 
 
addChild(redRb); 
addChild(blueRb); 
addChild(greenRb); 
addChild(aBox); 
 
redRb.label = "Red"; 
redRb.value = 0xFF0000; 
blueRb.label = "Blue"; 
blueRb.value = 0x0000FF; 
greenRb.label = "Green"; 
greenRb.value = 0x00FF00; 
redRb.group = blueRb.group = greenRb.group = rbGrp; 
redRb.move(100, 260); 
blueRb.move(150, 260); 
greenRb.move(200, 260); 
 
rbGrp.addEventListener(MouseEvent.CLICK, clickHandler); 
 
function clickHandler(event:MouseEvent):void { 
    drawBox(aBox, event.target.selection.value); 
} 
 
function drawBox(box:MovieClip,color:uint):void { 
            box.graphics.beginFill(color, 1.0); 
            box.graphics.drawRect(125, 150, 100, 100); 
            box.graphics.endFill();         
}

  4. Välj Kontroll > Testa filmen för att köra programmet.

    Mer information finns i avsnittet om klassen RadioButton i Referenshandbok för ActionScript 3.0 i Adobe Flash Professional .