NORIのFlashユーザのためのMovable Type講座 gihyo.jp版

第4回 Flash側:XML解析をAS3.0で

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

今回は,これまでに作成したXMLファイルをFlashで読み込みます。

今回はFlash CS4と,E4XというXML解析手法が使用できるActionScript3.0(以下,AS3)を使用します。

まず,Flashの新規ドキュメントを作成します。

本来はオブジェクト指向で作成しますが,まずは,フローをしっかりと把握するため,フレームにAS2の時と同じスタイルで記述します。ただし,文法はAS3なので,注意してください。

外部テキストを読み込む手順は,大まかに次の通りです。

  1. URLLoaderを準備
  2. 読み込み完了イベントへの関連づけ
  3. 読み込み完了時の関数定義
  4. URLRequestでアクセス

URLLoaderを準備

外部テキストは,URLLoaderオブジェクトで読み込みますので,myLoaderという変数名でURLLoaderのオブジェクトを生成しましょう。

フレームに次のように記述します。

var myLoader:URLLoader = new URLLoader();

次に,myLoaderの受け取るデータがテキストであることを宣言します。

myLoader.dataFormat=URLLoaderDataFormat.TEXT;

読み込み完了イベントへの関連づけ

そして,myLoaderが読み込み完了したとき(Event.COMPLETE)に実行する関数(onLoaded)を指定します。

myLoader.addEventListener(Event.COMPLETE,onLoaded);

先ほど設定した,関数「onLoaded」を定義します。

function onLoaded(e:Event):void {
   var myXML:XML=new XML(e.target.data);
   trace(myXML.toString())
}

このonLoaded()関数では,読み込み終わったXMLデータをトレースするだけです。

読み込み完了イベントから呼ばれる関数を定義

このとき,関数onLoaded()には,Eventオブジェクトが引数で返されます。そのため,それを受け取る引数の宣言がないとエラーになります。

このonLoaded()関数が呼ばれたとき,読み込んだXMLテキストはmyLoaded.dataでアクセスできるようになっています。そこで,myLoaded.dataをnew XML()の引数にしても良いのですが,ここでEventオブジェクトである引数eのtargetプロパティは,myLoadedを参照しています。つまりmyLoaded.dataをe.target.dataと書き換えることができます。

このe.target.dataの値は,XMLフォーマットで記述されたテキストデータです。それをE4XやXMLクラスのメソッドでアクセスできるようXMLオブジェクトにします。

var myXML:XML=new XML(e.target.data);

trace()の実行結果は,次のようなものになります(データの中身は環境によって異なりますが,XMLフォーマットになっているはずです)。

<entries>
<entry id="9" title="お台場">
<img src="http://www.3oclock.com/my_first_blog-gihyojp/images/2007-03-25-FromDaiba.jpg"/>
</entry>
<entry id="8" title="銀座4丁目">

<img src="http://www.3oclock.com/my_first_blog-gihyojp/images/2006-10-28-ginza.jpg"/>
</entry>
<entry id="7" title="かくれんぼ">
<img src="http://www.3oclock.com/my_first_blog-gihyojp/images/2006-11-10-park.jpg"/>
</entry>
<entry id="6" title="駐輪場">
<img src="http://www.3oclock.com/my_first_blog-gihyojp/images/2006-10-28-cycle.jpg"/>
</entry>
<entry id="5" title="ショッピング">

<img src="http://www.3oclock.com/my_first_blog-gihyojp/images/20070503-shopping.jpg"/>
</entry>
</entries>

E4Xで解析

myXMLに対して,E4Xを使用してデータを抽出します。

E4Xとは,ECMAScript for XMLの略で,Flash独自のものではなく,ECMAScriptで定義されたXMLを解析する手法です。

E4Xの特徴は,XMLの構造に沿って,.(ドット)で階層を下りテキストノードを指定したり,@を使用して属性値を取得する点です。

また,ワイルドカードとして*を使用できます。

たとえば,次のXMLフォーマットの場合を考えてみましょう。

<togoru> 
   <member age="38" sex="male"> 
      <name>NORI</name> 
   </member> 
</togoru> 

E4Xにより,次のAS3では,myXMLを生成します。

var myXML:XML =<togoru> 
<member age="38" sex="male"> 
<name>NORI</name> 
</member> 
</togoru> 

その後,次のようにE4XでXMLオブジェクトへアクセスすることができます。

trace(myXML.member.name);  //NORIが出力される
trace(myXML.member.@age);    // 38 が出力される

myXMLは,<togoru>と同じレベルなので,togoru.member.name を変数myXMLを使用して表現するならば,myXML.member.name となります。

著者プロフィール

NORI(伊藤のりゆき)

Twitter:@nori_togoru

有限会社トゴル・カンパニー代表。Flashアクセシビリティをきっかにアクセシビリティ全般に興味を持つ。UIデベロッパとして企業用WebアプリケーションのUIデザインを行う。写真集「Snap or Nothing写真集」(iTunes AppStoreにて)をリリースするなど写真家としても活動している。

コメント

コメントの記入