FLASHのお勉強　ーアクションスクリプトの実践的事始めー
(53) フォーム用ラジオボタンの動的作成 　　200７/12/18

（actionscript3.0）
　本サイト「(51) フォーム用テキストフィールドの動的作成」で、入力チェック付テキストフィールドの作成、「（52）フォーム用コンボボックスの動的作成」でas3.0によるコンボボックスの作成について解説したが、本稿は、ラジオボタンの作成である。　ラジオボタンの項目（label）、配置座標、大きさなどを指定するｓｗｆファイルと、それらを引数とするラジオボタンの作成と選択された項目を返すクラスファイルの組み合わせで構成されるラジオボタンの作成スクリプトである。
　確認ボタンをクリックすると、選ばれている項目が表示用テキストフィールドに表示されるまでを作成する。
SAMPLE

ステージの準備
●500*120のステージを設定、背景色や枠を入れるかどうかなどは好みによる
●ライブラリーにコンポーネントウインドウからラジオボタン（ RadioButton ）をドラッグしドロップしておく
●選択された項目を取得し、確認するためのイベントボタンを画面右下に配置し、インスタンス名を kakunin としておく
スクリプト
　ファイルの構成：　setupRadioButton.fla(swf)　−　createRadioButton.as
setupRadioButton.flaファイル
import fl.controls.RadioButtonGroup;

var rb1_label:Array = ["20才以下","20-30才","30-40才","40才以上"];
var rbg1:RadioButtonGroup = new RadioButtonGroup("年代");
var rb1x:Number = 50;
var rb1y:Number = 30;
var rb1size:Number = 14;//表示文字サイズ
var rb1:createRadioButton = new createRadioButton(rbg1,rb1_label,rb1x,rb1y,rb1size);
addChild(rb1);

function confirm(event) {
        var clicked$:String = rb1.clickedData();
        display(clicked$);
}
kakunin.addEventListener(MouseEvent.CLICK,confirm);

var tf:TextField = new TextField();
tf.text = "";
tf.border = true;
tf.x = 30;
tf.y = 70;
tf.width = 200;
tf.height = 24;
addChild(tf);

function display(clicked$) {
        if (clicked$) {
                tf.text = clicked$;
        } else {
                tf.text = "何も選ばれていません";
        }
}
<説明>
●import fl.controls.RadioButtonGroup;
　　ラジオボタングループパッケージの読み込み
●var rb1_label:Array = ["20才以下","20-30才","30-40才","40才以上"];
　　選択対象項目のラベルを配列（rb1_label）で定義
●var rbg1:RadioButtonGroup = new RadioButtonGroup("年代");
　　ラジオボタングループインスタンス（rbg1）の作成
●var rb1:createRadioButton = new createRadioButton(rbg1,rb1_label,rb1x,rb1y,rb1size);
　　クラス(as)ファイルにrbg1以下の引数を渡し、ラジオボタン（rb1） を作成し、表示する（addChild(rbg1)）
−−−−ここまでで、ラジオボタンが作成される−−−−
●function confirm(event) {
　確認ボタンがクリックされたら以下を実行する関数
　　var clicked$:String = rb1.clickedData(); //　クリックされている項目データを、クラスファイルから取得する
　　display(clicked$);//　そのデータをdisplay関数に渡す
●var tf:TextField = new TextField();　以下は、
　確認ボタンがクリックされたら、選択された項目を表示するテキストフィールドを作成する
●function display(clicked$) {
　選択された項目を表示する（選ばれていない時は、選ばれていない旨のメッセージを表示)

createRadioButton.as ファイル

 
package {
        import fl.controls.RadioButton;
        import fl.controls.RadioButtonGroup;
        import flash.text.*;
        import flash.events.*;
        import flash.display.Sprite;

        public class createRadioButton extends Sprite {
                public function createRadioButton(rbg:RadioButtonGroup,rb_item:Array,
                x:Number,y:Number,rbsize:Number) {
                        var n:Number = rb_item.length;
                        for (var i:Number=0; i<n; i++) {
                                var rb:RadioButton = new RadioButton();
                                rb.group = rbg;
                                rb.label = rb_item[i];
                                if (i >0) { x += rbsize*(rb_item[i-1].length+2); }
                                rb.move(x,y);
                                addChild(rb);
                                var rb_style:TextFormat = new TextFormat();
                                rb_style.size = rbsize;
                                rb.setStyle("textFormat",rb_style);
                                rb.addEventListener(MouseEvent.CLICK, clickHandler);
                        }
                }
                private var clickedLabel:String;
                private function clickHandler(event:MouseEvent){
                        clickedLabel = event.currentTarget.label.toString();
                }
                public function clickedData():String {
                        return clickedLabel;
                }
        }
}
<説明>
●import　必要なパッケージの読み込み
●var n:Number = rb_item.length;
　　配列の長さ、すなわち、項目数
●var rb:RadioButton = new RadioButton();
　　ラジオボタンのインスタンス（rb）作成
●rb.label = rb_item[i];
　　引数で渡された配列データに基づいて、ラジオボタンのラベル（項目）を割りつける
●if (i >0) { x += rbsize*(rb_item[i-1].length+2); }
　　2番目以降のラベルの表示ｘ座標は、前の項の文字数に2を足した数に文字サイズを掛け算した数値だけ加える
●rb.move(x,y);
　　rbを座標(x,y)に配置
●rb.addEventListener(MouseEvent.CLICK, clickHandler);
　　ラジオボタンがクリックされたら、関数 clickHandler を実行
●clickedLabel = event.currentTarget.label.toString();
　　クリックされている項目をストリングに変換して、clickedLabel に取得する
●public function clickedData():String { return clickedLabel; }
　　ｓｗｆ(fla）ファイルから参照されたときにクリックされている項目データを返す
 
flashirohaサイト内　 Web全体　
HOME　　　お勉強総リスト