プログラミングとイラストレーション » Flash Pro CC, Starlingを使ってたくさんの画像を表示する
プログラミングとイラストレーション > Flash > Flash Pro CC, Starlingを使ってたくさんの画像を表示する

Flash Pro CC, Starlingを使ってたくさんの画像を表示する

Flash Pro CC, Starlingを使ってたくさんの画像を表示する

Flash Pro CC, Starlingを使ってたくさんの画像を表示する : デモ

Flash Pro CC, Starlingを使ってたくさんの画像を表示する : ZIPファイル(133kb)

1.Main.fla

1. Flashコンテンツのパフォーマンスをグラフ化するstatsをダウンロードします。

statsサイト(外部サイト):http://github.com/mrdoob/Hi-ReS-Stats

2. Flash Professional CC にダウンロードしたstatsファイルを以下のように、Flashメニューから設定します。

Flash – 環境設定 – コンパイラー – ソースパス で、Hi-ReS-Stats-master/src を設定します。

3. Starlingファイルをダウンロードします。

Starlingサイト(外部サイト):http://gamua.com/starling/

4. Flash Professional CC にダウンロードしたstarlingファイルを以下のように、Flashメニューから設定します。

Flash – 環境設定 – コンパイラー – ソースパス で、starling/src を設定します。

Flash – 環境設定 – コンパイラー – ライブラリパス で、starling/bin を設定します。

5. プロパティのクラスに「StartUp」を記述します。

6. ライブラリに画像を読み込む。

上部メニューから「ファイル – 読み込み – ライブラリに読み込み」で、ライブラリに表示する画像を読み込みます。

読み込んだライブラリの画像をクリックし、「ビットマッププロパティ」を表示します。

「ビットマッププロパティ」の「ActionScript」のタブをクリックし、「ActionScript用書き出し」をチェック。

クラス名は、最初の一文字目は大文字にし、任意に決めます。

ビットマッププロパティの設定

2.StartUp.as

プログラム言語は、ActionScript3.0です。

package
{
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import starling.core.Starling;
	import net.hires.debug.Stats;
	
	public class StartUp extends Sprite
	{
		private var mStarling:Starling;
		
		public function StartUp()
		{
			//fps計測用クラス
			addChild(new Stats());
			
			stage.align = StageAlign.TOP_LEFT;
			stage.scaleMode = StageScaleMode.NO_SCALE;
			
			//starlingインスタンスの作成
			mStarling = new Starling(ImagesView, stage);//ボーイの画像をたくさん描画。テキストも表示
			
			//アンチエイリアスの設定 0:アンチなし、2:最小限のアンチエイリアス、4:高品質、6:最高品質
			mStarling.antiAliasing = 2;
			
			//スタート
			mStarling.start();
		}
	}
}

3.ImagesView.as

package
{
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	
	import starling.display.Image;
	import starling.display.Sprite;
	import starling.events.Event;
	import starling.text.TextField;
	import starling.textures.Texture;
	import starling.utils.deg2rad;
	
	public class ImagesView extends Sprite
	{
		private var boysVector:Vector.<Image> = new Vector.<Image>(NUM_BOYS, true);
		private const NUM_BOYS:uint = 20;
		
		//Flash Builderを使う場合の読み込み
		//[Embed(source = "sausage.png")]
		//private static const Sausage:Class;
		
		public function ImagesView()
		{
			var text:TextField = new TextField(100, 200, "ああああ", "Vernada", 15, 0x000000);
			text.x = 100;
			text.y = 30;
			addChild(text);
			addEventListener(Event.ADDED_TO_STAGE, onAdded);
		}
		
		private function onAdded(e:Event):void
		{
			//Flash IDEのライブラリ画像を使う場合
			var boyBitmapData:BitmapData = new Boy(0, 0);
			var boyBitmap:Bitmap = new Bitmap(boyBitmapData);
			
			//Flash Builderで読み込んだ画像を使う場合
			//var sausageBitmap:Bitmap = new Sausage();
			
			//Imageオブジェクトに渡すTextureオブジェクトを作る
			var texture:Texture = Texture.fromBitmap(boyBitmap);
			for(var i:int = 0; i < NUM_BOYS; i++)
			{
				//テクスチャを使ってImageをつくる
				//var image:Image = new Image(texture);
				var image:CustomImage = new CustomImage(texture);
				//ランダムなアルファ、位置、回転
				image.alpha = Math.random();
				//ランダムな初期位置を決める
				image.x = Math.random() * stage.stageWidth;
				image.y = Math.random() * stage.stageHeight;
				image.rotation = deg2rad(Math.random() * 360);
				//表示
				addChild(image);
				//あとで使えるように参照を保持
				boysVector[i] = image;
			}
		}
	}
}

4.CustumImage.as

package
{
	import starling.textures.Texture;
	import starling.display.Image;

	public class CustomImage extends Image
	{
		public var destX:Number = 0;
		public var destY:Number = 0;
		
		public function CustomImage(texture:Texture)
		{
			super(texture);
		}
	}
}

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

コメントフィード

トラックバック URL : http://www.htmlcode.jp/flash-pro-cc-starling%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e3%81%9f%e3%81%8f%e3%81%95%e3%82%93%e3%81%ae%e7%94%bb%e5%83%8f%e3%82%92%e8%a1%a8%e7%a4%ba%e3%81%99%e3%82%8b/trackback/