FLASHのお勉強　ーアクションスクリプトの実践的事始めー
XMLファイルデータをFLASHで活用 2006/9/10
ここでは、SAMPLEに用いたｘｍｌ ファイルの内容と、そのデータをFLASHにロード（load、読み込み）する手順について解説する。　ｘｍｌ についての詳細は、詳しく解説しているサイトがたくさんあるのでそちらを参照されたい。
ｘｍｌ ファイルの内容（ファイル名をphotodata.xmlとし、メモ帳などでutf-8形式で保存）
<?xml version="1.0" encoding="utf-8"?> <Photos> <picture image="img/pic1.jpg" p_width="475" p_height="240">白峰三山</picture> <picture image="img/pic2.jpg" p_width="320" p_height="240">薬師岳</picture> <picture image="img/pic3.jpg" p_width="320" p_height="240">観音岳</picture> <picture image="img/pic4.jpg" p_width="480" p_height="279">地蔵＆甲斐駒が岳</picture> <picture image="img/pic5.jpg" p_width="480" p_height="207">駒ヶ岳＆地蔵岳</picture> <picture image="img/pic6.jpg" p_width="320" p_height="240">オベリスク</picture> <picture image="img/pic7.jpg" p_width="200" p_height="265">五色滝</picture> </Photos>
説明
<?xml version="1.0" encoding="utf-8"?> 　このドキュメントがｘｍｌ であり、文字エンコーディングがｕｔｆ−８形式であることを宣言する。 　utf-8の場合は、この宣言を省略することが出来る。　shift-jisにする場合は省略不可。 　極端な話、このSAMPLEの場合は、この行全体を省略することも可能である。
<Photos>・・・・・・・・</Photos> 　ルートノードといい、一番親になる要素である。　Photosと記載しているが、この語は自分で自由につけて良い。 　これに挟まれて記述される要素は、子ノードと呼ばれる。
<picture a="*****" b="******" c="*****" d="******">$$$$$$$$$</picture> 　子ノードに関する記述で、SAMPLEではスライドに関する情報を記述する。 　a="**"・・・d="***"の部分は属性（attributes)と呼ばれ、SAMPLEでは、画像のファイル名、幅、高さを記述している。$$$$$$の部分は、説明文などの文字列によるデータである。　なお、FLASHがｘｍｌ ファイルを取り扱うときには、属性でデータを記述する方が効率的（早い）と言うことである（属性を使わずに子ノードを並べる記述法もとれる）。
FLASHへの読み込み（ロード）
photos_xml = new XML(); photos_xml.load("photodata.xml"); photos_xml.ignoreWhite = true; photos_xml.onLoad = SlideShow;	XMLオブジェクトのインスタンス（photos_xml）を作成 インスタンスに読み込むｘｍｌファイルの指定 空白のみのデータ（ノード）を無視 ロードした後に実施する関数を指定
ｘｍｌ ファイルデータの取り込み
ｘｍｌ ファイルをロードしてファイルに含まれるデータを、FLASHで使えるようにするには、FLASH側で読込先の関数を定義する必要がある。例えば、画像の幅はimageWidthという関数に格納すると定義し、ｘｍｌ ファイルの子ノードの属性の p_widthを格納するということになるので、 　imageWidth = 子ノード名.attributes.p_width; というスクリプトで取り込むことになる。 それでは、ｘｍｌ ファイルデータのパス指定はどのようになるかを上の例について以下に示す。 ルートノード（Photos）は　rootNode = photos_xml.firstChild; とする。　rootNodeは自分の好きな名前を定義する。 子ノード（picture）は　firstSlide = rootNode.firstChild; とすれば、最初の子ノードデータへのパス指定となる。 属性データは、image = firstSlide.attributes.image; とすれば、img/pic1.jpg が取り込まれる。 文字列データは、slideTitle = firstSlide.firstChild.nodeValue; とすれば、白峰三山が取り込まれる。 ２番目、３番目以降のデータの取り込みについては、本文にて解説するが、例えば、２番目の子ノードへのパスは、 secondSlide = firstSlide.nextSibling; とする。　すなわち、次の子ノードはnextSiblingで参照でき、同様に、一つ前の子ノードはpreviousSiblingで参照できる。　この例のように、スライドを順送りにする（データを順番に使う）場合には便利な呼び出し方である。　なお、データを配列としての読み込む方法もあり、こちらの方が扱いやすい場合もあるが、これについては他のサイトを参照されたい。 配列でデータ読み込み（追加　2008/4/29） このxmlデータの例で、配列として読み込むスクリプトは、 　薬師岳のような要素データは以下で参照できる（配列の0から始まるi番目のデータ） 　　rootNode.childNodes[i].firstChild.nodeValue 　　（ここで、最後のnodeValueは省略可） 　したがって、全データを取り組むには、 　　var title:Array = new Array(); 　　total = rootNode.childNodes.length; 　　for (i=0; i<total; i++) { 　　　　title[i] = rootNode.childNodes[i].firstChild; 　　} 　 　また、属性データ image は、 　　rootNode.childNodes[i].attributes.image 　これを使った例は、「ｘｍｌ データ呼び出し型ショッピングカート(買い物かご）」にあります。
HOME　　　お勉強総リスト