GRAM | Build Inter-Communication through Designing

ってトコまでやっとこさ来れました。

-
http://www.brooklyn.jp/progression/
-

画像出て来て、ロゴ出てくるだけですが。。。
ちなみに、画像は、夏に海行った時に「あ、トリだ！」って
一瞬でパッて撮ったヤツなので、何の意味もないです。

ちなみに、画像の読み込み処理を Index.as の _onInit() 内で処理していたら、
サーバに上げて、htmlで見た時にロゴの表示まで行かなかった。
ってことで、処理を丸ごと IndexScene.as 内の _onLoad() に移したらサクッと行けた。
むむー、なんぞや。。。

今のトコの IndexScene.as はこんな感じデス。

public var bgLoader:CastImageLoader;
public var logo:CastSpriteLogo;

public function IndexScene() {
}

protected override function _onLoad():void {
	// 実行したいコマンドを登録します。

	bgLoader = new CastImageLoader();
	bgLoader.id = "bgLoader";
	bgLoader.alpha = 0;
	bgLoader.ratio = true;

	bgLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, monitorLoading);
	bgLoader.addEventListener(CastEvent.CAST_LOAD_COMPLETE, function():void {
		progression.container.addChild(bgLoader);
		onCompleteLoad();
		bgLoader.removeEventListener(CastEvent.CAST_LOAD_COMPLETE, arguments.callee);
	});

	addCommand(
		function():void {
			bgLoader.load(new URLRequest("contents/images/sky.jpg"))
		}
	);
}

private function onCompleteLoad():void {
	bgLoader.contentLoaderInfo.removeEventListener(ProgressEvent.PROGRESS, monitorLoading);

	logo = new CastSpriteLogo();
	logo.id = "logo";

	progression.container.stage.addEventListener( Event.RESIZE, onResizeHandler );
	resizeStageLayout();

	var slist:SerialList = new SerialList();
	slist.addCommand(
		new DoTweener( bgLoader, {alpha:1, time:3, transition:"easeOutQuart"} ),
		new AddChild( progression.container, logo )
	);
	slist.execute();
}

private function monitorLoading(e:ProgressEvent):void {

	trace("LOADING : " + Math.floor(e.bytesLoaded / e.bytesTotal * 100));

};

private function onResizeHandler(e:Event):void {

	resizeStageLayout();

};

private function resizeStageLayout():void {
	var sWidth:Number = progression.container.stage.stageWidth;
	var sHeight:Number = progression.container.stage.stageHeight;
	var ratio:Number = progression.container.width / progression.container.height;

	// 背景の設定
	bgLoader.width = sWidth;
	bgLoader.height = sWidth / ratio;

	if(bgLoader.height < sHeight) {
		bgLoader.height = sHeight;
		bgLoader.width = sHeight * ratio;
	}

	// ロゴの設定
	logo.x = 40;
	logo.y = (sHeight / 3);
};

っで、題名の自分のクラスを読み込んで処理している
CastSpriteLogo.as が ↓

import project.effect.DisplacementEffect;

// 大元は template にある MyCastSprite クラスです
public class CastSpriteLogo extends CastSprite {

	public var logo:SiteLogo;	// Library でこのクラス名にリンケージ指定してあるヤツ
	public var effect:DisplacementEffect;

	public function CastSpriteLogo( initObject:Object = null ) {
		super( initObject );

		logo = new SiteLogo();
		logo.alpha = 0;
		addChild( logo );

		effect = new DisplacementEffect( logo );
	}

	protected override function _onCastAdded():void {
		// 実行したいコマンドを登録します。
		effect.start();
		effect.addEventListener(DisplacementEffect.EFFECT, onReturnHandler);

		addCommand(
			// 任意のコマンドを記述してください。
		);
	}

	private function onReturnHandler(e:Event):void {

		effect.removeEventListener(DisplacementEffect.EFFECT, onReturnHandler);
		trace("====  onReturnHandler() called  ====");

	};

	protected override function _onCastRemoved():void {
		// 実行したいコマンドを登録します。
		addCommand(
			// 任意のコマンドを記述してください。
		);
	};

};

それから、グラグラしたエフェクト処理してるクラスが ↓

package project.effect {

	import flash.display.Sprite;
	import flash.display.MovieClip;
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.filters.DisplacementMapFilter;
	import flash.events.Event;
	import flash.geom.Point;

	public class DisplacementEffect extends Sprite {

		public static const EFFECT:String = "";

		private var w:Number;
		private var h:Number;
		private var octaves:Number;
		private var offset:Array;
		private var speed:Array;
		private var rseed:Number;

		private var image:MovieClip;
		private var bmd:BitmapData;
		private var mappoint:Point;

		private var scalex:Number;
		private var scaley:Number;

		public function DisplacementEffect(target:MovieClip):void {

			initProperty(target);

		};

		private function initProperty(target:MovieClip):void {

			w = 800;
			h = 100;
			octaves = 1;
			offset = [];
			speed = [];
			rseed = Math.floor(Math.random() * 10000);

			image = target;
			bmd = new BitmapData(w, h, false, 0xFF000000);
			mappoint = new Point((image.width - w)/2, (image.height - h)/2);

			scalex = 80;
			scaley = 0;

			this.setNoiseAmount();

		};

		private function setNoiseAmount():void {

			for(var i:int=0; i= 1) scalex *= 0.965;

			bmd.perlinNoise(w/10, h/10, octaves, rseed, false, true, 1, true, offset);
			var dmf:DisplacementMapFilter = new DisplacementMapFilter(bmd, mappoint, 1, 1, scalex, scaley);
			image.filters = [dmf];

			if(image.alpha < 1) {
				image.alpha += 0.0095;
			} else {
				removeEventListener(Event.ENTER_FRAME, applyEffect);
				bmd.dispose();
				dispatchEvent(new Event(EFFECT));
			}

		};
	};
};

これは、ロゴのエフェクト専用にササッ作って使い回し出来るヤツじゃないので、
他で使う場合は、 property や処理の部分を色々いじって下さい。

---
追記 : 08.11.07 - 17:01

bgLoader.addEventListener(CastEvent.CAST_LOAD_COMPLETE, function():void {}) 内に
removeEventListener 処理を書いてなかったので、それを追記。
あぶなし、あぶなし。。。