AS3備忘録: XML読み込み~BulkLoaderで一括ロード
この記事は賞味期限切れです。(更新から1年が経過しています)
XMLでリストを読み込み、画像をロードする…
というのはFlashコンテンツを作る上でかなり頻出する処理ですが、
それを簡易化する「BulkLoader」が広く知られています。
今日はXML読み込みからBulkLoaderによる一括ロードまでを
軽く備忘録しておきます。
bulk-loader – Project Hosting on Google Code
BulkLoaderは、複雑なローディング処理をより簡単に行う為に書かれたAS3ライブラリです。
早速、手順を追って書いてみるとします。
1. ライブラリをインポートするなど
import br.com.stimuli.loading.*;
保存場所に注意。
private var imagelist:XMLList;
URLのリストを格納しておく用の変数を準備しておきます。
2. XMLをロードする
XMLのロードはBulkLoaderを使わずにシンプルに書きます。
var ul:URLLoader = new URLLoader;
ul.addEventListener(Event.COMPLETE, onXmlLoaded);
ul.load( new URLRequest("list.xml") );
読み込むXMLはこんなのにしておきます。
実際はもうちょっと複雑な物になると思われますが…
<?xml version="1.0" charset="utf-8" ?>
<data>
<items>
<item id="1">images/a.png</item>
<item id="2">images/b.png</item>
<item id="3">images/c.png</item>
</items>
</data>
3. 読み込んだXMLを処理する
private function onXmlLoaded(e:Event):void {
var data:XML = new XML(e.target.data);
imagelist = new XMLList( data.items.item );
var bloader = new BulkLoader("imageloader");
var item:*;
for each( item in imagelist) {
bloader.add( item.toString() );
}
bloader.addEventListener(BulkProgressEvent.COMPLETE, onImagesLoaded);
bloader.addEventListener(BulkProgressEvent.PROGRESS, onImageProgress);
bloader.addEventListener(BulkLoader.ERROR, onImageError);
bloader.start();
}
BulkLoaderのコンストラクタには、ユニークな名前をつけてあげます。
(ここではimageloader)
var bloader = new BulkLoader("imageloader");
itemにはURL文字列が格納されたXMLオブジェクトが入っているので、
toString() でStringに変えてあげましょう。
URLをBulkLoader.addにつっこむと、BulkLoaderの読み込みリストに追加されます。
bloader.add( item.toString() );
イベントは、completeとprogressが登録できます。
APIドキュメントのイベントには記述されていませんが、errorイベントも受け取る事もできます。
BulkLoader.startで読み込み処理が開始されます。
URLLoader.loadみたいなもの。
4. イベントハンドラ
progressイベント
private function onImageProgress(e:Event):void {
trace( Math.floor((e.target.percentLoaded * 100)) + "%" );
}
BulkLoader.parcentLoaded で全体の読み込み率を取得できます。
BulkLoader.bytesTotal, bytesLoadedもあるのでこちらも活用できますね。
errorイベント
private function onImageError(e:Event):void {
trace(e.target.getFailedItems());
}
読み込みエラーが発生した時に呼ばれます。
BulkLoader.getFailedItemsでエラーの出たアイテムの情報が取得できます。
5. 完了時の処理
private function onImagesLoaded(e:Event):void {
var item:*;
var bmp:DisplayObject;
var margin:int = 10;
var point:Point = new Point( margin, margin );
for each( item in imagelist ) {
bmp = addChild( e.target.getBitmap(item.toString() ) );
bmp.x = point.x;
bmp.y = point.y;
point.x += bmp.width + margin;
}
}
10ピクセルの余白ごとにぺたぺたと横に画像を連ねるだけの簡単な処理をしています。
ポイントは、BulkLoader.getBitmap()。
bmp = addChild( e.target.getBitmap(item.toString() ) );
このメソッドに登録時につっこんだURLを入れると、
そのURLの画像をBitmapオブジェクトで引っ張ってきてくれます。なんて便利な。
他の形式で受け取りたい場合は、色々と用意されています。
getMovieClip, getSound, getSprite, getText,
getXML, getBitmapData, getContent, getBinary
などなどなど。
汎用的なgetなんていうメソッドもあります。
読み込んだファイルに応じて最適なものを使えば良いですね。
より詳しくは公式のドキュメントをご覧ください。
Wiki Pages – bulk-loader – Project Hosting on Google Code
本当は自分で似たようなのを書いてたんですが、
あまりにもこっちが便利なので愛用することに。
書く前に検索すればよいのですが、勉強になるので結果オーライです。
コメント