LoaderList クラスを使った画像一括読み込み

2010年3月3日 13:36 progression — littlepad

Progression4 で追加された LoaderList クラスが素晴らしすぎます!
一括で画像をプリロードする場合、今までは GroupLoader をよく利用していましたが、
LoaderList を使うと、JPG などの他に SWF、SOUND などもまとめて読み込むことができます。

以下、外部 XML に登録された外部画像を読み込むサンプルです。

読み込む XML はこんな感じ。

<?xml version="1.0" encoding="utf-8" ?>
<contents>
<content>
<title>画像1</title>
<image>images/content1.jpg</image>
</content>
<content>
<title>画像2</title>
<image>images/content2.jpg</image>
</content>
<content>
<title>画像3</title>
<image>images/content3.jpg</image>
</content>
</contents>

今回は IndexScene の atSceneLoad 内でXMLを読み込んでいます。
ここでは XML を元にシーンを作成し、読み込んだ画像も initObject として渡しています。

override protected function atSceneLoad():void {
	addCommand(
		// XML 読み込み
		new LoadURL( new URLRequest("contents.xml") ),
		function():void {
			var xml:XML = new XML(this.latestData);
			
			// 複数ファイル読み込みする LoaderList
			var loaderList:LoaderList = new LoaderList();
			
			// XML のデータから LoaderList を作成
			for (var i:uint = 0; i < _sceneTotal; i++) {
				loaderList.addCommand(
					new LoadBitmapData( new URLRequest(xml.content[i].image), 
					{
						cacheAsResource: true, 
						context: new LoaderContext(true),
						resGroup:"image", 
						resId:"image" + i
					})
				);
			}
			
			// 読み込み開始
			loaderList.onStart = function():void {
				trace( "読み込み開始" );
			}
			// 読み込み中
			loaderList.onProgress = function():void {
				trace( this.percent,"%" );
			}
			// 読み込み完了
			loaderList.onComplete = function():void{
				trace( "読み込み終了" );
				
				for ( var j:uint = 0; j < xml.children().length(); j++ ) {
					// content の数だけシーン作成
					var imageBmp:Bitmap = new Bitmap(getResourceById("image" + j).data);
					
					var content:ContentScene = new ContentScene( "content" + j,
					{ 
						title: xml.content[j].title,
						image: imageBmp		// 読み込み画像(Bitmap)
					});
					
					addScene(content);
				}
				
				// 最初のシーンへ移動
				var com:Goto = new Goto( new SceneId("/index/content0") );
				com.execute();
			};
			
			// 読み込み開始
			loaderList.execute();
		}
	);
}

読み込んだ画像は getResourceById を使って id でアクセス出来ます。

ちなみにSWF を読み込むときはこんな感じで。

var lo:Loader = new Loader();
loaderList.addCommand(
	new LoadSWF( new URLRequest(xml.content[i].swf), lo, {
		cacheAsResource:true, 
		context:new LoaderContext(false),
		resGroup:"swf", 
		resId:"swf" + i
	} )
);

読み込んだデータへのアクセスは画像と同様に id 指定で。

var lo:Loader;
lo = getResourceById("swf" + j).data;

コメントはまだありません

No comments yet.

TrackBack URL

Leave a comment

about

ハンドルネーム:littlepad
都内で WEB 制作(デザイン, html/css, Flash, MT, WordPress etc)をしているBOØWY研究家

category:

search:


archives:

GO TO PAGETOP