Home > lesson2 > ボタンに連動してムービークリップの表示を変える[2-7]

ボタンに連動してムービークリップの表示を変える[2-7]

配列を利用して複数のボタンにリンクを付けてる

ムービークリップのボタンに飛び先となるURLを指定するのに配列を利用します。
配列にあらかじめ飛び先となるURLを格納して、添字を利用してループ処理を行うような感じになります。

//配列
var url:Array = new Array();
url[1] = "http://www.yahoo.co.jp";
url[2] = "http://www.google.co.jp";
url[3] = "http://www.addchild.net";

ここでは添字を1から始めてますが、本来なら配列は0からはじまることが定められてます。
しかしムービークリップのインスタンス名の数字と合わせる為に、このような手法を取っています。

配列の準備が出来れば、マウスダウンした時の処理をループさせます。

for(var i:int = 1; i < 4; i++){
	if(btn == this["btn_mc"+i]){
		var link:URLRequest = new URLRequest(url[i]);
		var target:String = "_self";
		navigateToURL(link,target);
	}
}

switchを利用することも出来ますが、今回はforを使ってプログラム処理を簡略化しています。
下記はswitchのプログラムです。

switch(btn){
	//1
	case btn_mc1:
	var google:URLRequest = new URLRequest("http://www.google.co.jp");
    var target:String = "_self";
	navigateToURL(google,target);
	break;
	//2
	case btn_mc2:
	var yahoo:URLRequest = new URLRequest("http://www.yahoo.co.jp");
    var target:String = "_self";
	navigateToURL(yahoo,target);
	//3
	case btn_mc3:
	var addchild:URLRequest = new URLRequest("http://www.addchild.net");
    var target:String = "_self";
	navigateToURL(addchild,target);
}

素人感覚でみるとswitchの方が理解しやすいかもしれませんが、プログラムを簡略させる為にforを使いました。

これで飛び先となるURLの指定は完了しましたので、[2-6]で使用したアクションスクリプトにマウスダウンの処理を付け加えます。

//ループを使う
for(var i:int = 1; i < 4; i++){
	//イベントリスナー登録
	this["btn_mc"+i].addEventListener(MouseEvent.MOUSE_OVER,Over);
	this["btn_mc"+i].addEventListener(MouseEvent.MOUSE_OUT,Out);
	this["btn_mc"+i].addEventListener(MouseEvent.MOUSE_DOWN,Down);

	//ボタンモード
	this["btn_mc"+i].buttonMode = true;
	//イメージムービークリップを非表示
	this["img_mc"+i].alpha = 0;
}
//初期状態
img_mc1.alpha = 1;

//マウスオーバー
function Over(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 0.7;
	//条件に合わしてイベントリスナー登録
	for(var i:int = 1; i < 4; i++){
    	if(btn == this["btn_mc"+i]){
        	this["img_mc"+i].addEventListener(Event.ENTER_FRAME,imgAlpha);
    	}
	}
}
//アルファプログラム関数
function imgAlpha(event:Event){
	//ムービークリップのチェック
	var img:MovieClip = event.target as MovieClip;
	for(var i:int = 1; i < 4; i++){
		var imgNo:MovieClip = this["img_mc"+i] as MovieClip;
		imgNo.alpha = 0;
		img.alpha = 1;
		img.removeEventListener(Event.ENTER_FRAME,imgAlpha);
	}
}

//マウスアウト
function Out(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 1;
	//条件に合わしてイベントリスナー登録
	for(var i:int = 1; i < 4; i++){
    	if(btn == this["btn_mc"+i]){
        	this["img_mc"+i].addEventListener(Event.ENTER_FRAME,zero);
    	}
	}
}
//リセットプログラム関数
function zero(event:Event):void{
	var img:MovieClip = event.target as MovieClip;
	img.alpha = 1;
	img.removeEventListener(Event.ENTER_FRAME,imgAlpha);
	img.removeEventListener(Event.ENTER_FRAME,zero);
}

//マウスダウン
function Down(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	//配列
	var url:Array = new Array();
	url[1] = "http://www.yahoo.co.jp";
	url[2] = "http://www.google.co.jp";
	url[3] = "http://www.addchild.net";

	for(var i:int = 1; i < 4; i++){
		if(btn == this["btn_mc"+i]){
			var link:URLRequest = new URLRequest(url[i]);
			var target:String = "_self";
			navigateToURL(link,target);
		}
	}
}
配列を利用して複数のボタンにリンクを付けてる

Comments:0

Comment Form
Remember personal info

Trackbacks:0

Trackback URL for this entry
http://www.addchild.net/as3-beginner/ls2/284.html/trackback
Listed below are links to weblogs that reference
ボタンに連動してムービークリップの表示を変える[2-7] from ADD CHILD = AS3

Home > lesson2 > ボタンに連動してムービークリップの表示を変える[2-7]

Feeds
Meta

Return to page top