ブラウザに合わせて中心で背景画像を拡大/縮小するクラス
2007年12月31日 月曜日
今回、使ったActionScriptのクラス。BgImage。いまいちいい名前が浮かばなかった。でも、以前作ったUtilitiesクラスと組み合わせてかなり便利です。というか、これがなかったら。。。
とりあえず画面いっぱいに画像を拡大します。はみ出します。
関数estimateでfillInを実行するとこちらははみ出しません。
とりあえず必要に応じて変更してください。もっとシンプルな書き方がありと思いますが、時間の関係でこのまま行ってしまいました。
使い方は
var BGI:BgImage = new BgImage(); BGI.setBG(sample , Stage);
って感じです。とりあえずStageにしか効きません。
以下、ソース。
class BgImage extends MovieClip
{
public var objArray:Array;
public var winObjGroup:Object;
public var targetMC:MovieClip;
public var stageMC:MovieClip;
public var stageMCWidth:Number;//Stage
public var stageMCHeight:Number;//Stage;
static public var stageMCRate:Number;
static public var targetRate:Number;
public function BgImage()
{
Stage.align = "TL";
Stage.scaleMode = "noscale";
winObjGroup = new Object();
}
public function setBG(TGT:MovieClip , BG):Void
{
//初回のリサイズとリスナー設定
stageMC = BG;
targetMC = TGT;
targetRate = targetMC._width / targetMC._height;
estimate();
var winObj:Object = new Object();
winObjGroup[targetMC] = winObj;
Stage.addListener(this);
}
public function estimate()
{
fillOut();
//fillIn();
}
public function onResize()
{
estimate();
}
public function updatestageMC()
{
estimate();
}
//計算(画像はみ出す : fillOut)
public function fillOut()
{
stageMCWidth = stageMC.width;//背景の幅、高さ取得
stageMCHeight = stageMC.height;
stageMCRate = stageMCWidth/stageMCHeight;//stageMCの各比率
if(targetRate > stageMCRate)
{
//targetMCの比率の方が横長
targetMC._width = stageMCHeight*targetRate;
targetMC._height = stageMCHeight;
centering();
break;
}
else if(targetRate < stageMCRate)
{
//targetMCの比率の方が縦長
targetMC._width = stageMCWidth;
targetMC._height = stageMCWidth/targetRate;
centering();
break;
}
else if(targetRate == stageMCRate)
{
//背景との比率が同じ
targetMC._width = stageMCWidth;
targetMC._height = stageMCHeight;
centering();
break;
}
}
//計算(画像すべて治まる : fillIn)
function fillIn()
{
stageMCWidth = stageMC.width;//背景の幅、高さ取得
stageMCHeight = stageMC.height;
stageMCRate = stageMCWidth/stageMCHeight;//stageMCの各比率
if(targetRate > stageMCRate)
{
//targetMCの比率の方が横長
targetMC._width = stageMCWidth;
targetMC._height = stageMCWidth/targetRate;
centering();
break;
}
else if(targetRate < stageMCRate)
{
//targetMCの比率の方が縦長
targetMC._width = stageMCHeight*targetRate;
targetMC._height = stageMCHeight;
centering();
break;
}
else if(targetRate == stageMCRate)
{
//背景との比率が同じ
targetMC._width = stageMCWidth;
targetMC._height = stageMCHeight;
centering();
break;
}
}
function centering()
{
targetMC._x = (stageMCWidth-targetMC._width)/2;
targetMC._y = (stageMCHeight-targetMC._height)/2;
}
}
ソースダウンロード:BgImage.as.zip
正月はActionAcript 3.0を勉強します。来年もどうぞよろしく!
投稿者:daisuke カテゴリー:Flash,ActionScript

