如何檢查Flex 3中單選按鈕的狀態？

Question

我正在研究Flex中動態調查問卷的模板。在我的前一個線程中的更詳細的描述HERE

要創建問卷，我使用嵌套中繼器 - 一個用於問題，一個用於答案（因爲它們的數量可能會有所不同）。

<mx:Repeater id="r" dataProvider="{questions}"> 
    <mx:Label text="{r.currentItem.question}" width="200"/> 
     <mx:Repeater id="r2" dataProvider="{r.currentItem.answers}"> 
     <mx:RadioButton label="{r2.currentItem.text}" width="200"           
      click="answerHandler(event, event.currentTarget.getRepeaterItem())"/> 
     </mx:Repeater> 
</mx:Repeater> 

要了解我的數據提供商，它可能是最好檢查有無我以前的線程的答案 - 不是，如果我嘗試在這裏解釋更容易。

這裏的問題是......正如您所看到的，我爲每個單選按鈕創建了單擊事件處理程序，並且我的計劃是每次用戶選擇正確時執行playerScore ++（可以通過檢查布爾屬性「correct 「發送RepeaterItem）。

但是，我現在看到，即使按鈕已被選中，我仍然可以多次點擊該按鈕，即使它沒有改變視圖中的任何內容，它也會每次增加分數..我也會以處理用戶改變主意的情況（我可以爲每個好的答案給出+分，並指出錯誤，但這意味着，如果用戶選擇了更多錯誤的答案，我的分數將是負數，而我不想要它）。

因此，只需提交一個提交按鈕並檢查所有按鈕的狀態，以及只有在用戶單擊「提交」之後它們是正確的，方式纔會更加簡單。可能嗎？

Answer 1

我建議您參考following sample並將RadioButtonGroup添加到您的轉發器組，並聽取change事件而不是click。您可以在RadioButtonGroup處聽change事件，並檢查if (radioGroup.selectedValue.correct)以瞭解新選擇的正確性。見corresponding documentation。

要有可能分配radiogroups獨特的名稱，你必須提取內部中繼器與答案到單獨的組件。將您的應用程序分解爲更小的組件可以使您的應用程序更加清晰易讀。您可以將每個MXML文件視爲一個類（如在OOP中），但是以聲明形式。並且告訴真正的每個MXML組件都是從根節點類繼承的類。

讓我們看看代碼。

首先，我們的內部組件供應答案：

<?xml version="1.0" encoding="utf-8"?> 
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Metadata> 
     [Event(name="rightAnswerEvent", type="AnswerEvent")] 
    </mx:Metadata> 
    <mx:Script> 
    <![CDATA[ 
     import mx.collections.ArrayCollection; 

     [Bindable] 
     public var answers:ArrayCollection; 

     protected function answerGroup_changeHandler(event:Event):void 
     { 
      if (answerGroup.selectedValue.correct) 
       dispatchEvent(new AnswerEvent(AnswerEvent.RIGHT_ANSWER_EVENT)); 
     } 
    ]]> 
    </mx:Script> 

    <mx:RadioButtonGroup change="answerGroup_changeHandler(event)" id="answerGroup" /> 
    <mx:Repeater dataProvider="{answers}" id="answersRepeater"> 
     <mx:RadioButton group="{answerGroup}" label="{answersRepeater.currentItem.text}" 
      value="{answersRepeater.currentItem}" /> 
    </mx:Repeater> 
</mx:VBox> 

它得到answers集合作爲輸入並引發自定義事件，告知正確答案的一些組件（見Metadata標籤）。

我們的自定義事件是非常簡單的如下所示：

package 
{ 
import flash.events.Event; 

public class AnswerEvent extends Event 
{ 
    public static const RIGHT_ANSWER_EVENT:String = "rightAnswerEvent"; 

    public function AnswerEvent(type:String) 
    { 
     super(type); 
    } 
} 
} 

所以，現在我們的頂級組件：

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application layout="vertical" xmlns:local="*" 
    xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Script> 
    <![CDATA[ 
     import mx.collections.ArrayCollection; 

     [Bindable] 
     private var questions:ArrayCollection = new ArrayCollection(); 

     [Bindable] 
     private var scoreCounter:int; 
    ]]> 
    </mx:Script> 
    <mx:Label text="{'Score ' + scoreCounter}" /> 
    <mx:Repeater dataProvider="{questions}" id="questionRepeater"> 
     <mx:Label text="{questionRepeater.currentItem.question}" /> 
     <local:AnswerGroup answers="{questionRepeater.currentItem.answers}" rightAnswerEvent="scoreCounter++" /> 
    </mx:Repeater> 
</mx:Application> 

我省略初始化代碼來填充我們的Question和Answer域對象與來自XML的數據（請參閱前一個主題）。

所以現在我們有緊湊的模塊化代碼，其中每個部分都解決了自己的任務。

希望這會有所幫助！