as3_ステージサイズに背景画像を合わせる

fitstage
↑クリックでサンプル開きます。

背景画像を開いているウィンドウ(ステージ)に合わせてぴったりのサイズで表示する場合の処理です。サンプルを開いたら、ウィンドウサイズをいろいろ変更してみてください。
開いている、ウィンドウの縦横比が画像の比率同じとは限らないので、以下のように、横を基準として残りをはみ出すか、縦を基準として残りをはみ出すか、の2通りで画像のスケーリングをする必要があります。

例 背景画像 640×420ピクセルの場合
f1
STAGE(青枠)が横長のときは、Widthを基準にスケール
f2

STAGE(青枠)が縦長のときは、Heightを基準にスケール
f3

それと、ウィンドウを凄く小さくしたときに、同じように画像が小さくなってもいいんですが、通常は最低でも見せたいサイズを決めておいて、それ以下にならないようにすます。
STAGE(青枠)が最低見せたいサイズより小さくなった場合
f4

以上の条件をAS3で書くと以下のような感じになります。

//MIN_WIDTHには最低表示したい横幅
//MIN_HEIGHTには最低表示したい縦幅
// img_yx は元画像の height / widthをした比率
// img_xy は元画像の width / heightをした比率を入れておきます

//ステージの縦横比と、読み込んだ写真の比率を比べる。
			if(stage.stageHeight / stage.stageWidth < img_yx){	
			//横を基準にする場合
				if( stage.stageWidth>MIN_WIDTH){	//最低保証サイズより多きければ横幅基準でスケール
					img.width = stage.stageWidth;
					img.height = stage.stageWidth *  img_yx;
				}else{	//最低保証サイズより小さい場合は最低保証サイズでスケール。
					img.width = MIN_WIDTH;
					img.height = MIN_WIDTH *  img_yx;
				}
			//縦を基準にする場合
			}else{																			
				if( stage.stageHeight> MIN_HEIGHT ){	//最低保証サイズより多きければ縦幅基準でスケール
					img.width = stage.stageHeight *  img_xy;
					img.height = stage.stageHeight;
				}else{//最低保証サイズより小さい場合は最低保証サイズでスケール。
					img.width =MIN_HEIGHT * img_xy;
					img.height = MIN_HEIGHT;
				}
			}

スケールをするときに、基準点をステージの左上にしておくと良いです。
プログラムの始まりのほうで以下の指定をしておきます。

stage.align =StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;

ちなみに、ステージを変更された時に実行されるイベントとしてEvent.RESIZEというのがあるので、そのイベントaddEventListnerして登録したfunctionの中にリサイズの処理を書いておきましょう!

stage.addEventListener(Event.RESIZE, resizefunc);

function resizefunc(event:Event){
	//ステージリサイズの時の処理
}



Adobe Flash CS4 詳細!ActionScript3.0入門ノート[完全改訂版](CD-ROM付)

Post a comment.