Flashとおやつの会

おやつを食べながらFlashとかを勉強しよう

Archive for the ‘未分類’ Category

BulkLoader

without comments

BulkLoaderをご存知ですか?
私は気になっていたものの、自作したクラスに執着していて使う機会がありませんでした。
Flashを制作していると、更新性や設計のし易さから外部の資源(テキストや画像)を読み込んでコンテンツを展開することがよくあります。
しかしながら、この流れを組むだけでもソースコードはそれなりの行数を占めてしまい、また書き方も人それぞれです。
そこで今回このBulkLoaderをご紹介する理由は2つあります。

まず1点は高機能でありながら、使う側は少ないコードで実現できるということです。
テキストソースを読み込む時は一般的にURLLoaderクラスを用います。
また外部イメージソースに対してはLoaderクラス、flvにはNetConnectionクラスやNetStreamクラスもしくはFLVPlaybackクラス・・・
これらを目的別にインポートしてインスタンスを生成し、各種挙動に応じたイベントを登録する訳ですが、
初心者の方にはそれだけで「今期」の「根気」が尽きてしまい、肝心のコンテンツ制作に使う根気がなくなってしまいます。

勿論これらはそれぞれ意味があって独立したクラスとして成り立っているのですが、
それらを統一したクラスにすることで、メインのクラスは驚くほどシンプルになります。
根気もまだ残っているハズです!←重要

2点目は「外部ファイル読み込み」という同じ目的に対して、「ソースを書く人によりバラバラな書き方になってしまわない」ので、誰がそのソースを見ても瞬時に理解できるということです。
これも非常に重要な要素です。
「誰が見ても」分かるというのは、当然自分が見ても分かるということだと思います。
私は特別記憶力が少ないことが自慢の草食男子ですが、自分で書いたソースも1週間後には赤の他人のソースな訳ですから。独自の俺TUEEEEEクラスなんて望んでいないんです。私は。
また、悲惨なことに本当に他人が制作したクラスを、「初期の開発者が逃げた」等の理由でやむなく解読しなければならない屈辱的条件が成立してしまった場合、インポートされているクラスの中に、見覚えのあるクラスがあると、想像以上にホッとする物です。多分。

つまり2点とも自分の為であり、万が一自分のオケツを拭いてくれる神の為でもある訳です。
以上の理由から今回BulkLoaderを紹介させていただきたく存じます。

普通にLoaderクラスを用いて画像を読み込む場合は以下の様なソースになるかと思われます。
これはたった1枚の画像であるからこそ、画像のURLもハードコーディングされており一見問題ないように見えます。がしかし!通常お客様は数十枚もしくは100枚を超える画像を更新性のある形で読み込む仕様をご提案されます。
そんな時、ソースコード内に全てのURLを記述することはまず有りえませんし、なによりLoaderクラスに対しても、それらの画像を全て読み込む様なロジックを設けなければなりません。

package {
    import flash.display.Sprite;
    import flash.display.Loader;
    import flash.events.Event;
    import flash.net.URLRequest;

    public class FlashTest extends Sprite {
        private var loader:Loader;
        private var urlRequest:URLRequest;

        public function FlashTest() {
            // write as3 code here..
            var url:String = 'http://works.mztm.jp/kobashi/sample/img/image0.jpg';
            urlRequest = new URLRequest(url);
            loader = new Loader();
            loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
            loader.load(urlRequest);
        }

        private function onComplete (e:Event):void {
            addChild(loader);
        }
    }
}

Loader – wonderfl build flash online

そこで満を持して登場するのが、複数のリクエストを管理する俺TUEEEEEクラス!
ではなく。万国共通?BulkLoaderクラスです。
Bulk(大量)という言葉からも分かるように、こういったケースで使うのが最も効果的です。
BulkLoaderクラスのパッケージはhttp://code.google.com/p/bulk-loader/からダウンロードできます!

package{
    import br.com.stimuli.loading.BulkLoader;
    import br.com.stimuli.loading.BulkProgressEvent;
	import br.com.stimuli.loading.loadingtypes.LoadingItem;
    import flash.events.*;
    import flash.display.*;

    public class Main extends MovieClip{
        public var loader:BulkLoader;

        public function Main () : void {
			loader = new BulkLoader('bulkLoader');
			loader.add('http://works.mztm.jp/kobashi/sample/img/image0.jpg', {id:'image0', type:BulkLoader.TYPE_IMAGE, preventCache:true});
			loader.add('http://works.mztm.jp/kobashi/sample/img/image1.jpg', {id:'image1', type:BulkLoader.TYPE_IMAGE, maxTries:5});
			loader.add('http://works.mztm.jp/kobashi/sample/img/image2.jpg', {id:'image2', type:BulkLoader.TYPE_IMAGE, weight:100 / 4});
			loader.add('http://works.mztm.jp/kobashi/sample/img/image3.jpg', {id:'image3', type:BulkLoader.TYPE_IMAGE, priority:100});
            loader.addEventListener(Event.COMPLETE, onAllLoaded);
            loader.addEventListener(ProgressEvent.PROGRESS, onAllProgress);
            loader.start();
        }

        public function onAllProgress (e:BulkProgressEvent):void {
            trace('onAllProgress');
        }

        public function onAllLoaded (e:Event):void {
            trace('onAllLoaded');
            var sp:Sprite;
            for each (var item:LoadingItem in loader.items) {
				trace(item.id);
				trace(item.type);
				switch (item.type) {
					case 'image' :
						sp = new Sprite();
						sp.addChild(loader.getBitmap(item.id));
						sp.addEventListener(MouseEvent.MOUSE_DOWN, function (e:MouseEvent):void {
							var sp:Sprite = e.target as Sprite;
							addChild(sp);
							sp.startDrag();
						});
						sp.addEventListener(MouseEvent.MOUSE_UP, function (e:MouseEvent):void {
							var sp:Sprite = e.target as Sprite;
							addChild(sp);
							sp.stopDrag();
						});
						addChild(sp);
						break;
				}
            }
			//addChildAt(loader.getBitmap('http://works.mztm.jp/kobashi/sample/img/image0.jpg'), 0);
        }
    }
}

Get Adobe Flash player

以下はBulkLoaderクラスの派生クラスであるLazyXMLLoaderのサンプルです。
Lazyとはだらだら、ぐだぐだ、ごろごろとすることらしいですが。
私は「ゆとり」Loaderと呼んでいます。
それは以下を見ていただくことで実感されるでしょう。

外部のxmlに特定のルールでノードを記述します。

<?xml version="1.0" encoding="utf-8"?>
<data>

	<files>
		<file>
			<id>img0</id>
			<type>image</type>
			<url>http://works.mztm.jp/kobashi/sample/image/image0.jpg</url>
		</file>
		<file>
			<id>img1</id>
			<type>image</type>
			<url>http://works.mztm.jp/kobashi/sample/image/image1.jpg</url>
		</file>
		<file>
			<id>img2</id>
			<type>image</type>
			<url>http://works.mztm.jp/kobashi/sample/image/image2.jpg</url>
		</file>
		<file>
			<id>img3</id>
			<type>image</type>
			<url>http://works.mztm.jp/kobashi/sample/image/image3.jpg</url>
		</file>
		<file>
			<id>img4</id>
			<type>image</type>
			<url>http://works.mztm.jp/kobashi/sample/image/image4.jpg</url>
		</file>
	</files>

</data>

ゆとりを実装したソースです。

package{
    import br.com.stimuli.loading.lazyloaders.LazyXMLLoader;
    import br.com.stimuli.loading.lazyloaders.LazyBulkLoader;
    import br.com.stimuli.loading.*;
    import br.com.stimuli.loading.loadingtypes.*;
    import br.com.stimuli.loading.BulkProgressEvent;
    import flash.events.*;
    import flash.display.*;

    public class Main extends MovieClip{
        public var lazy : LazyXMLLoader;

        public function Main () : void {
            var url:String = 'http://works.mztm.jp/kobashi/sample/xml/conf.xml';
            lazy  = new LazyXMLLoader(url, 'theLazyLoader');
            lazy.addEventListener(LazyBulkLoader.LAZY_COMPLETE, onXmlLoaded)
            lazy.addEventListener(Event.COMPLETE, onAllLoaded);
            lazy.addEventListener(ProgressEvent.PROGRESS, onAllProgress);
            lazy.start();
        }

        public function onXmlLoaded (e:Event):void {
            trace('onXmlLoaded');
        }

        public function onAllProgress (e:BulkProgressEvent):void {
            trace('onAllProgress');
        }

        public function onAllLoaded (e:Event):void {
            trace('onAllLoaded');
            var sp:Sprite;
            for each (var item : LoadingItem in lazy.items) {
				trace(item.id);
				trace(item.type);
				switch (item.type) {
					case 'image' :
						sp = new Sprite();
						sp.addChild(lazy.getBitmap(item.id));
						sp.addEventListener(MouseEvent.MOUSE_DOWN, function (e:MouseEvent):void {
							var sp:Sprite = e.target as Sprite;
							addChild(sp);
							sp.startDrag();
						});
						sp.addEventListener(MouseEvent.MOUSE_UP, function (e:MouseEvent):void {
							var sp:Sprite = e.target as Sprite;
							addChild(sp);
							sp.stopDrag();
						});
						addChild(sp);
						break;
				}
            }
        }
    }
}

Get Adobe Flash player

Written by go

8月 20th, 2010 at 4:05 pm

8/20(金)Flashとおやつのゼミやります

without comments

大学のゼミのような形式で、多少あやふやでもいいから自分なりに調べて発表する会。おかしいところがあったらみんなでコメントして軌道修正していけば、発表者も参加者もみんなが勉強になるはず!

Read the rest of this entry »

Written by 梅原

8月 2nd, 2010 at 11:54 pm

Posted in 未分類

やることメモ

without comments

今回はAS3.0にターゲットを絞っているので、今まで(Flash中心)とちょっと違うので整理しないと。
そんなメモ用エントリ。

環境準備

コンパイル環境を整えることが必須だけど、実際そろえられない人もいるだろうから、その人向けの情報を整理。どうしてもダメならwonderflへ。

クラスの仕組み

メソッド、プロパティ、static,public,private,set,get

クラス妖怪論

Object=心

DisplayObject=魂?(座標を持つ)

InteractiveObject=霊?(呼びかけられる)

DisplayObjectContainer=妖精?(肉体をもつ一歩前)

Sprite=頭だけ(目玉親父)

MovieClip=体もある

「as3 class diagram」で検索

ライブラリ

BetweenAS3

package{
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import org.libspark.betweenas3.BetweenAS3;
	import org.libspark.betweenas3.easing.*;
	import org.libspark.betweenas3.tweens.ITween;

	public class Main extends Sprite{
	    private var _maru1:Sprite;

		public function Main(){

		   _maru1 = new Sprite();
		   _maru1.graphics.beginFill(0x006666,0.7);
		   _maru1.graphics.drawCircle(0,0,26);
		   _maru1.graphics.endFill();
		   _maru1.x = 150;
		   _maru1.y = 150;
		   this.addChild(_maru1);

		   stage.addEventListener(MouseEvent.CLICK, onClick);
		}
		private function onClick(event:MouseEvent):void {
			trace("click!");

			var dx:Number = Math.random() * stage.stageWidth;
			var dy:Number = Math.random() * stage.stageHeight;

			var t:ITween;
			t = BetweenAS3.tween(_maru1, { x:dx, y:dy }, null, 1, Quint.easeOut);
			t.play();
		}
	}
}

Written by 梅原

4月 14th, 2010 at 12:20 am

Posted in 未分類