使用 RadioButton 組件

此 RadioButton 組件可以讓您強制使用者在一組選擇中做出一個選擇。使用此組件時,群組中至少必須有兩個 RadioButton 實體。不論任何時候,都只能選取群組中的一個成員。選取群組中的某個選項按鈕後,將會取消選取群組中目前選取的選項按鈕。您應該設定 groupName 參數來指定選項按鈕屬於哪個群組。

選項按鈕是許多表單或網路應用程式的基本項目。如果您希望使用者從選項群組中選取一個選項,您就可以使用選項按鈕。例如,您可以在表單中使用選項按鈕詢問客戶要使用哪一張信用卡。

與 RadioButton 組件的使用者互動

選項按鈕可以啟用或停用。停用的選項按鈕不接受滑鼠或鍵盤輸入。當使用者按一下或用 Tab 鍵移到 RadioButton 組件群組時,只有已選取的選項按鈕會成為焦點。接著使用者便可以用下列按鍵來進行控制:

按鍵

說明

向上鍵/向左鍵

選取範圍移到選項按鈕群組中的上一個選項按鈕。

向下鍵/向右鍵

選取範圍移到選項按鈕群組中的下一個選項按鈕。

Tab 鍵

將焦點從選項按鈕群組移到下一個組件。

如需有關控制焦點的詳細資訊,請參閱 Flash Professional 的 ActionScript 3.0 參考 中的「IFocusManager 介面」和「FocusManager 類別」,以及 使用 FocusManager

進行編寫時,「舞台」上每個 RadioButton 實體的即時預覽會反映您在「屬性」檢測器或「組件檢測器」中對參數進行的變更。但是,選取範圍的互斥效果不會顯示在即時預覽中。如果您將同一個群組中兩個選項按鈕的 selected 參數都設定為 true ,則這兩個選項按鈕都會呈現選取狀態;但是實際上,只有最後建立的實體會在執行階段呈現選取狀態。如需詳細資訊,請參閱 RadioButton 組件參數

將 RadioButton 組件加入應用程式時,您可以加入下列 ActionScript 程式碼,讓螢幕朗讀程式能夠存取此組件:

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

不論您有多少個組件實體,都只需要啟用組件的輔助功能一次。如需詳細資訊,請參閱「使用 Flash」中的第 18 章「建立輔助功能內容」。

RadioButton 組件參數

您可以在「屬性」檢測器或「組件檢測器」中,為每個 RadioButton 組件實體設定下列編寫參數: groupName、label、LabelPlacement、selected value 。這些參數都具有相對應的 ActionScript 同名屬性。如需有關這些參數可能值的詳細資訊,請參閱 Flash Professional 的 ActionScript 3.0 參考 中的 RadioButton 類別。

您可以使用 RadioButton 類別的方法、屬性和事件撰寫 ActionScript,來設定 RadioButton 實體的其它選項。

建立具有 RadioButton 組件的應用程式

下列程序說明如何在編寫時將 RadioButton 組件加入應用程式。此範例使用 RadioButton 呈現是非題選項。來自 RadioButton 的資料會顯示在 TextArea 中。

  1. 建立新的 Flash (ActionScript 3.0) 文件。

  2. 將兩個 RadioButton 組件從「組件」面板拖曳到「舞台」。

  3. 選取第一個選項按鈕。在「屬性」檢測器中,賦予實體名稱 yesRb 以及群組名稱 rbGroup

  4. 選取第二個選項按鈕。在「屬性」檢測器中,賦予實體名稱 noRb 以及群組名稱 rbGroup

  5. 將 TextArea 組件從「組件」面板拖曳到「舞台」,並賦予實體名稱 aTa

  6. 開啟「動作」面板,選取主要「時間軸」中的「影格 1」,然後輸入下列 ActionScript 程式碼:

    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. 選取「控制 > 測試影片」,執行應用程式。

使用 ActionScript 建立 RadioButton

此範例使用 ActionScript 建立顏色各為紅色、藍色和綠色的三個 RadioButton,並繪製一個灰色方塊。每一個 RadioButton 的 value 屬性都會指定與該按鈕相關顏色的十六進位值。當使用者按一下其中一個 RadioButton 時, clickHandler() 函數就會呼叫 drawBox() ,傳遞 RadioButton value 屬性的顏色而為該方塊上色。

  1. 建立新的 Flash (ActionScript 3.0) 文件。

  2. 將 RadioButton 組件拖曳到「元件庫」面板。

  3. 開啟「動作」面板,選取主要「時間軸」中的「影格 1」,然後輸入下列 ActionScript 程式碼:

    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. 選取「控制 > 測試影片」,執行應用程式。

    如需詳細資訊,請參閱 適用於 Adobe Flash Platform 的 ActionScript 3.0 參考 中的 RadioButton 類別。