Flashのフレームワーク「Progression3」を始めてみよう!

第5回 Progression3でWebサイトを作る(後編)

この記事を読むのに必要な時間:およそ 8.5 分

XMLList形式のデータを扱う

シーンの作成ができたところで,各シーン固有の値を設定します。

作成したシーンオブジェクトのsceneInfo.dataでシーン固有のデータを参照でき,子シーンはシーンオブジェクト.scenesで参照できます。現在のシーンからは,scenes[子シーンのインデックス].sceneInfo.dataで,シーン作成用にXMLで設定した値を参照することができます。

取得したデータはrootノードの無いXMLすなわちXMLList形式となっていますので,そのまま扱うのは面倒です。そこで,Progressionに同梱されているXMLUtilクラスを利用します。

XMLUtilクラスはXMLListをオブジェクト形式にして返してくれる便利なクラスです。

var xmlData:XMLList = new XMLList( scenes[i].sceneInfo.data );
var obj:Object = XMLUtil.xmlToObject( xmlData );
btn_Thumbnail.imageUrl = obj.imageUrl;

ProgressionにはXMLUtilクラスのように便利なクラスがいくつか同梱されています。これらを有効に利用することでより開発のスピードアップを図ることができます。

CastButtonをCastSpriteで括る

次にシーンへ遷移する為のサムネールボタンを作成するのですが,今回サムネールと移動先シーンの画像をキャストスプライトで括ったキャストボタンにしています。

これは何故かというと,自作のキャストボタンクラスで_onCastAddedと_onCastRemovedメソッドが上書きできないために,ボタンの設置,削除時の動作を他のキャストオブジェクトクラス同様に実装できないからです。

そこで,キャストボタンクラスをキャストスプライトクラスで括ってしまいます。

こうすると,括った側のキャストスプライトで出現,削除時の動作を記述,括られた側のキャストボタンでロールオーバー,ロールアウト,遷移先シーンIDの設定等を行うことができるようになります。

今回,キャストボタンクラスへ画像の場所とシーンIDをinitObjectでは無く,setterを使用して値を渡していますが,もちろんinitObjectで値を渡してもかまいません。

図4 CastSpriteで括られたCastButton

図4 CastSpriteで括られたCastButton

シーンオブジェクトのファミリーアクセス

最後に,動的に作成される各クラスで使用しているTIPSを紹介します。

XMLで動的に作成するシーン,ImageScene.asの初期化処理を行っている_onInitメソッドの中を見てみましょう。

protected override function _onInit():void 
{
  //シーン固有の値をsceneinfo.dataより取得
  var xmlData:XMLList = new XMLList( sceneInfo.data );
  //データ形式がXMLListなので,XMLUtilを利用して変換
  var obj:Object = XMLUtil.xmlToObject( xmlData );
  //画像をボタンとして作成(画像クリックで戻る様にする為),また,ボタンはスプライトに内包する
  _btn_Image = new Btn_Image_Sprite();
  //setterへ値をセットする
  //parentで親シーンのインスタンスを参照出来る
  _btn_Image.sceneId = parent.sceneId;
  _btn_Image.imageUrl = obj.imageUrl;

  addCommand(
    // 任意のコマンドを記述してください。
    new AddChild(progression.container, _btn_Image)
  );
}

表示される画像はクリックで元のシーンに戻る様にしたため,キャストボタンにしています。

ここで特筆すべきなのは,シーンオブジェクトのparentプロパティです。parentで現在のシーンオブジェクトの親オブジェクトの参照を得ることができます。parent.parentとすると親の親の参照になります。

著者プロフィール

楢山哲弘(ならやまのりひろ)

3年前に上京してきた北海道出身のFlasher。

開発スピードを上げるため,Progressionに傾倒中。そのため,ブログではProgressionについての言及が多くなっている。

URLhttp://narayama.heteml.jp/