Mach3.laBlog

AS3備忘録: XML読み込み~BulkLoaderで一括ロード

XMLでリストを読み込み、画像をロードする…
というのはFlashコンテンツを作る上でかなり頻出する処理ですが、
それを簡易化する「BulkLoader」が広く知られています。

BulkLoader

今日はXML読み込みからBulkLoaderによる一括ロードまでを
軽く備忘録しておきます。

bulk-loader – Project Hosting on Google Code

BulkLoader

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() );

イベントは、completeprogressが登録できます。
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

本当は自分で似たようなのを書いてたんですが、
あまりにもこっちが便利なので愛用することに。
書く前に検索すればよいのですが、勉強になるので結果オーライです。

続きを読む

Wikipediaがお手軽になるChrome拡張機能 「Wikipedia Companion」

Wikipedia Companion – ミニwikiのブラウザ

ツールバーのアイコンをクリックすれば簡単にWikipediaで検索できちゃう、
便利なChromeのエクステンション。

続きを読む

入力補助ソフトウェア「Texter」

「いつもお世話になっております」
「以上、ご確認よろしくお願い申し上げます。」

と、日々幾度となく使用する定型文をもっと楽に入力したい。
そんな時に便利そうなツール「Texter」(for Windows)を使ってみました。

続きを読む

美しい!素晴らしい作品が並ぶ「Nikon Next」

Nikon Next

世界中のアーティストによる美麗な作品を展示する、
NikonによるWebギャラリーです。これは美しい!

続きを読む

綺麗にデザインされたコーデッド・キーボード

エルゴノミクスなマウス? いえ、キーボードも入ってます。 : ギズモード・ジャパン

そろそろフルキーボード以外のインターフェイスも…
と思わせてしまう素敵なデザインのコーデッド・キーボード。
使いこなすにはかなり訓練が必要そうではありますが、
片手で何でも入力出来るとなると活躍の場も結構あるのではないでしょうか?

脳インターフェイスの実用化はまだですかね。
(これこそ訓練が必要か)

続きを読む

ISシリーズ公式Webのローディングアイコンを拝見して

DoCoMo、Softbankにつづき、auからもAndroid機が発表され、
予想を覆したその容姿にネット上でも色々な声が飛び交う中、
皆様はいかがお過ごしでしょうか。

私はというと、アクセス過多の為ローディング画面をしばらく眺める事となりましたが、
そこで感じた違和感についてログっておきます。

続きを読む

AS3備忘録: XMLをロードする

人は忘れていく生き物。
必要になる度に細部を忘れていたりしてリファレンス見たりしちゃうので、
この際ログっておきます。AS3でのXMLロード。

続きを読む

サイマル放送をiPhoneで 「コミュニティFM for iPhone(i-コミュラジ)」

radiko.jpの誕生でおおいに盛り上がってきているラジオ業界ですが、
iPhoneでサイマル放送を聞けるアプリが発売されていました。

続きを読む

愛してやまないChromeエクステンションども

先日突如としてChromeの設定が全部吹っ飛んだのをきっかけに、
改めて拡張機能を精査してみました。
次全部吹っ飛んだ時(!?)に備えて、
お気に入りの拡張機能を備忘録も兼ねてご紹介してみます。

続きを読む

Photoshop CS5の新機能「Content-Aware Fill」がすごそうだ

先日CS5の発表予告がされましたが、
Photoshop CS5の新機能「Content-Aware Fill」のデモ動画がYouTubeで公開されています。
ちょっとすごいですよ、これ。

続きを読む