メラメラ燃える炎

(サンプル一覧を表示する)

メラメラ燃える炎を表示するサンプルです。
パーリンノイズと変位マップフィルターを使用しています。

トラのイラストは、似顔絵、イラスト、キャラクター、フリー素材などの紹介ブログ さんからお借りしました。
Flash の実行画面
メラメラ燃える炎

Flashプレーヤーが入っていないか、JavaScriptが無効になっているようです。

Get Adobe Flash player

メラメラ燃える炎

ソースコード

package 
{
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.display.GradientType;
	import flash.display.Graphics;
	import flash.display.Sprite;
	import flash.events.Event;
    import flash.filters.DisplacementMapFilter;
	import flash.filters.DisplacementMapFilterMode;
	import flash.geom.Matrix;
	import flash.geom.Point;
	
	/**
	 * メラメラ燃える炎のサンプル
	 * @author Hikipuro
	 */
	public class Main extends Sprite 
	{
		/**
		 * トラの画像 (埋め込みリソース)
		 */
		[Embed(source='../image/test001.jpg')]
		private var image1:Class;
		
		/**
		 * トラの画像 (表示用のオブジェクト)
		 */
		private var tigerBitmap:Bitmap;
		
		/**
		 * グラデーションの画像
		 * (炎のもとになる)
		 */
		private var gradientSprite:Sprite;
		
		/**
		 * パーリンノイズを入れる
		 */
		private var noise:BitmapData;
		
		/**
		 * 炎の画像を入れる
		 */
		private var fire:BitmapData;
		
		/**
		 * パーリンノイズのスクロール量を調整する配列
		 */
		private var scrollAmountArray:Array;
		
		/**
		 * 変位マップフィルター
		 */
		private var displacementMapFilter:DisplacementMapFilter;
			
		/**
		 * コンストラクタ
		 */
		public function Main():void 
		{
			if (stage) init();
			else addEventListener(Event.ADDED_TO_STAGE, init);
		}
		
		/**
		 * 初期化メソッド
		 * @param	e
		 */
		private function init(e:Event = null):void 
		{
			removeEventListener(Event.ADDED_TO_STAGE, init);
			// entry point
			
			// トラの画像を一番後ろに表示
			tigerBitmap = new image1;
			addChild(tigerBitmap);
			
			// グラデーションの画像を準備
			gradientSprite = new Sprite();
			
			// グラデーションのかかった四角形を描く
			var colors:Array = [0x000000, 0xff8000];
			var alphas:Array = [0.0, 1.0];
			var ratios:Array = [100, 255];
			var matrix:Matrix = new Matrix();
			matrix.createGradientBox(100, 100, Math.PI / 2, 0, 0);
			
			var g:Graphics = gradientSprite.graphics;
			
			g.lineStyle();
			g.beginGradientFill(GradientType.LINEAR, 
								colors,
								alphas,
								ratios,
								matrix);
			g.drawRect(0, 0, 100, 100);
			g.endFill();
			
			// パーリンノイズと炎の画像用のビットマップデータを初期化
			noise = new BitmapData(100, 100);
			fire = new BitmapData(100, 100);
			fire.floodFill(0, 0, 0x00000000);
			
			// 炎の画像を画面に表示するように登録する
			var fireBitmap:Bitmap;
			fireBitmap = new Bitmap(fire);
			fireBitmap.width = 320;
			fireBitmap.height = 240;
			addChild(fireBitmap);
			
			// スクロール量を調整する配列の初期化
			scrollAmountArray = new Array();
			scrollAmountArray.push(new Point(0, 0));
			
			// 変位マップフィルターの初期化
			displacementMapFilter = 
				new DisplacementMapFilter(noise, 
										  new Point(0, 0), 
										  1, 2, 5, 30, 
										  DisplacementMapFilterMode.IGNORE);
			
			// フレーム開始イベントの登録
			addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
		
		/**
		 * フレーム開始イベント
		 * @param	e
		 */
		private function onEnterFrame(e:Event):void 
		{
			// パーリンノイズのスクロール量を調整
			var vy:Number = 10;
			var vx:Number = 0;
			scrollAmountArray[0].x += vx;
			scrollAmountArray[0].y += vy;
			
			// パーリンノイズを発生させる
			noise.perlinNoise(20, 150, 
							  2, 2, 
							  true, false, 
							  7, false, 
							  scrollAmountArray);
			
			// グラデーションの画像を炎のビットマップデータにいったんそのまま転送
			fire.draw(gradientSprite, new Matrix(1, 0, 0, 1, 0, 0));
			
			// 炎の画像に変位マップフィルターを適用
			fire.applyFilter(fire, 
							 fire.rect, 
							 new Point(0, 0), 
							 displacementMapFilter);
			
		}
		
		
	}
	
}
		

参照

外部リンク