ADD CHILD = AS3 » MovieClip

ムービークリップを徐々に加速させる[3-7]

admin — Tue, 05 Jan 2010 08:57:39 +0000

カスタムクラスで読み込んだムービークリップに加速度をつけて移動させる

『Math.random() を使ってランダムに色を変える方法』で利用したBall.asを今回も使ってステージにボールを配置します。
X軸はステージの1/5の位置に配置し、Y軸をステージの真ん中に配置させます。（サイズ50と青色を指定）

//Ball.asを読み込み
var ball:Ball = new Ball(50, 0x0000ff);
addChild(ball);
ball.x = stage.stageWidth / 5;
ball.y = stage.stageHeight / 2;

これでステージにボールが表示されるようになったと思いますので、次にボールを動かすスクリプトを書きます。
今までやってきたムービークリップの動かし方にさらに加速度のプログラムを足します。

//イベントリスナー
ball.addEventListener(Event.ENTER_FRAME, loop);

function loop(event:Event):void{
	ball.x += 1;
}

上記が従来ムービークリップのX軸に1を足して動かす方法ですが、下記は1の変わりに変数（vx)を用いてX軸の数値に置き換え、さらに加速変数（ax)をフレームが読み込まれる度に足して変数vxの数値を増やしていく感じになります。

//イベントリスナー
ball.addEventListener(Event.ENTER_FRAME, loop);

function loop(event:Event):void{
	vx += ax;
	ball.x += vx;
}

こうすることにより、ボールがどんどん加速しているように見えます。
今回は加速度を1に設定しましたが、数値を変えれば加速度を調整できます。
この加速度は色々な場面でも使うことができるので、徐々に何かをしたい時になどに使うと便利です。

//Ball.asを読み込み
var ball:Ball = new Ball(50, 0x0000ff);
//インスタンスプロパティー
var vx:Number = 0; //初期値
var ax:Number = 1; //加速度

addChild(ball);
ball.x = stage.stageWidth / 5;
ball.y = stage.stageHeight / 2;
//イベントリスナー
ball.addEventListener(Event.ENTER_FRAME, loop);

function loop(event:Event):void{
	vx += ax;
	ball.x += vx;
}

カスタムクラスで読み込んだムービークリップに加速度をつけて移動させる

ボールがなくなってたらもう一度更新して下さい。

TransitionManagerクラスを使ってトランジションさせる[3-6]

admin — Wed, 02 Dec 2009 02:18:33 +0000

ステージに配置したムービークリップにTransitionManagerクラスを使ってトランジション効果をつける

[1-8]でフェードインさせるアクションスクリプトとよく似た感じになりますが、TransitionManagerクラスを使用すればもっと違う表現の効果をあたえることができます。

タイムライン上にあるアクションスクリプトに、まずTweenクラスとeasingクラスをインポートさせ、使えるようにします。
（[3-4]同様）

//クラスのインポート
import fl.transitions.*;
import fl.transitions.easing.*;

[3-3]でカクスタムクラスを使ってステージ上にムービークリップを配置しているアクションスクリプトのBallをimgに変更してステージに表示させます。
（[1-8]同様にステージにimg_mcのムービークリップを用意している前提です）

// imgクラスからインスタンスを作る
var img:img_mc = new img_mc();
addChild(img);
img.x = stage.stageWidth / 2;
img.y = stage.stageHeight / 2;

表示させるムービークリップにトランジション効果を指定します。

//トランジション効果
TransitionManager.start(img,{
						type:Blinds, //トランジションタイプ
						direction:Transition.IN,  //transition効果の方向
						duration:1,  //動作時間
						easing:None.easeNone, //イージング設定
						numStrips:10,
						dimension:0
						});

addChildで画像が読み込まれると同時に、トランジション効果が始動する感じになります。

//クラスのインポート
import fl.transitions.*;
import fl.transitions.easing.*;

// imgクラスからインスタンスを作る
var img:img_mc = new img_mc();
addChild(img);
img.x = stage.stageWidth / 2;
img.y = stage.stageHeight / 2;

//トランジション効果
TransitionManager.start(img,{
						type:Blinds,
						direction:Transition.IN,
						duration:1,
						easing:None.easeNone,
						numStrips:10,
						dimension:0
						});

asファイルに関しては[3-3]と同じになりますので、省略します。
動作が終わっている場合は再読み込みして下さい。

ステージに配置したムービークリップにTransitionManagerクラスを使ってトランジション効果をつける

トランジションの種類

トランジションタイプ	説明
Blinds	ブラインドカーテンみたいに回転します。
Fade	フェードインまたはフェードアウトします。
Fly	定した方向からムービークリップをスライドインします。
Iris	マスクを利用して表示させる
Photo	カメラのフラッシュに用に一瞬光ります。
PixelDissolve	チェッカーボードのようなモザイク処理をします。
Rotate	回転します。
Squeeze	水平または垂直に拡大/縮小します。
Wipe	マスクを利用して表示させる。
Zoom	拡大/縮小しながら表示します。

Tweenクラスでムービークリップをトゥイーンさせる[3-4]

admin — Thu, 29 Oct 2009 01:20:53 +0000

ステージに配置したムービークリップにTweenクラスを使ってトゥイーンさせる

[3-3]でステージに配置したムービークリップにトゥイーンモーションを指定してます。

タイムライン上にあるアクションスクリプトに、まずTweenクラスとeasingクラスをインポートさせ、使えるようにします。

//クラスのインポート
import fl.transitions.Tween;
import fl.transitions.easing.*;

Tweenクラスに関しては、もっと奥が深いので今回は取り合えず簡単に使えるやり方にします。
詳しくはもっと勉強してからと言うことで…

[3-3]でカクスタムクラスを使ってステージ上にムービークリップを配置してますので、さらにTweenクラス用のアクションスクリプトを追記します。

// モーション設定
var mcTween:Tween;
mcTween = new Tween(my_mc, "y", Bounce.easeOut, 0, (stage.stageHeight - my_mc.height/2), 5, true);

変数mcTweenをTweenクラスを指定して宣言し、new演算子でTweenクラスでトゥイーンさせる処理を書きます。
順番としては
①トゥイーンさせるインスタンス名
②変化させたいプロパティ
③アニメーションの種類
④開始値
⑤終了値
⑥継続時間
⑦継続時間の単位
になります。
アニメーションの種類に関しては、あとでまとめます。

今回はムービークリップのY軸にイージング終了時にバンドさせる処理としてます。
カスタムクラスでステージ配置されたムービークリップは初期表示位置x軸はステージ幅の1/10で表示されるが、Y軸に関してはトゥイーンで0からステージの高さ（ステージいっぱい）に移動して、終了時にバウンドするせる感じになります。

//クラスのインポート
import fl.transitions.Tween;
import fl.transitions.easing.*;

// Ballクラスからインスタンスを作る
var my_mc:Ball = new Ball();
addChild(my_mc);
my_mc.x = stage.stageWidth / 10;

// モーション設定
var mcTween:Tween;
mcTween = new Tween(my_mc, "y", Bounce.easeOut, 0, (stage.stageHeight - my_mc.height/2), 5, true);

asファイルに関しては[3-3]と同じになりますので、省略します。

Tweenクラスでムービークリップをトゥイーンさせる

アニメーションの種類

イージングクラス	説明
Back	開始値や終了値をいったん超えて戻るアニメーション
Bounce	バウンドするアニメーション
Elastic	開始時や終了時に慣性の働くようなアニメーション
Regular	加速・減速をするアニメーション
Strong	加速・減速をするアニメーション。Regularよりも動きが極端
None	等速のトゥイーンアニメーション

イージンの種類

イージングメソッド	説明
easeIn	最初にイージング効果
easeOut	最後にイージング効果
easeInOut	両方にイージング効果

カスタムクラスでステージにムービークリップを配置[3-3]

admin — Tue, 20 Oct 2009 07:11:19 +0000

カスタムクラスを使ってステージにムービークリップを配置

いままでは、タイムライン上（flaファイル）に直接アクションスクリプトを記述してきましたが、今回はasファイル（カスタムクラス）を使って外部からアクションスクリプトを書いていきます。

カスタムクラスを使って外部からアクションスクリプトを書く場合には、いくつかルールがあります。
パッケージ名、クラス名、インスタンスの変数、コンストラクタの定義、メソッドの定義を条件に応じて記述しなくてはなりません。

//パッケージ名
package {
	//インポートするクラス
	import flash.display.MovieClip;
	import flash.events.Event;
	//クラス定義
	public class asファイル名と同じ {
		//変数の宣言
		//コンストラクタの定義
		//メソッド定義
	}
}

パッケージ名とは、クラスが属するパッケージを示します。
パッケージ名を省略すると、デフォルトパッケージと見なされます。その場合はasファイルはflaファイルと同じ階層に置かなくてはなりません。

クラス名とは、クラスの名前ですが、アクションスクリプトでは、このクラス名とasファイル名が同じにする必要があります。

インスタンスの変数とは、クラスで使う変数となりますが、外部のクラスから変数にプロパティとしてアクセスするには、publicを指定しなくてなりません。

コンストラクタの定義とは、実行させたいプログラムを動かす為の定義となります。
これもインスタンスの変数と同様にpublicが必要になります。

メソッドの定義とは、簡単に言うと実行するプウログラム本体になります。

flaファイルのステージ配置したいムービークリップをライブラリーに用意して、リンケージ名を付けます。（今回はBallにしました）
さらにasファイルにアクションスクリプトを書いていきます。

package {
	// インポート
	import flash.display.MovieClip;
	import flash.events.Event;

	public class Ball extends MovieClip {
		// 変数の宣言
		public var myXspeed:Number = 5; // X軸方向の速度
		public var myCicle:Number = 10;  //ボールの回転

		// コンストラクタの定義
		public function Ball() {
			this.addEventListener(Event.ENTER_FRAME, enterF);
		}

		// メソッドの定義（ボールを動かす関数）
		private function enterF(event:Event):void {
			this.x += myXspeed;
			this.rotation += myCicle;
			if(this.x < 50 || this.x > 500){
				myXspeed *= -1;
				myCicle *= -1;
			}
		}
	}
}

今回は同じ階層にasファイルを置くため、パッケージ名は付けてません。
クラス名を先程リンケージで付けた名前のBallとし、保存するファイル名もBall.asにします。

次にflaファイルにBall.asを読み込まして、ムービークリップをステージに配置する為に、タイムラインにアクションスクリプトを書きます。

// Ballクラスからインスタンスを作る
var ball_mc:Ball = new Ball();
addChild(ball_mc);
ball_mc.x = stage.stageWidth / 2;
ball_mc.y = stage.stageHeight / 2;

ball_mc.xとball_mc.yで初期表示位置を指定しています。

ムービークリップの動きは[1-5]同じになりますが、アクションスクリプトは外部から読み込んだ状態になっています。

カクタムクラスを使ってステージにムービークリップを配置

クラス参照でステージにムービークリップを配置[3-2]

admin — Tue, 13 Oct 2009 04:06:16 +0000

クラス（リンケージ）参照でランダムにムービークリップを呼び出す

あらかじめライブラリーに表示させたいムービークリップを用意し、プロパティーでリンケージのクラス名に順番を付けて用意します。（例：img_mc1）

用意できたら、ムービークリップの順番を配列に置き換えます。

//配列
var myImg:Array = new Array();
myImg[0] = "img_mc1"
myImg[1] = "img_mc2"
myImg[2] = "img_mc3"

次にランダムで表示させる為のプログラムを用意します。
ランダムで表示させる為には、変数NoにMath.randomを使って、配列の数をランダムに置き換えまる感じになります。

var No = Math.floor(Math.random()* myImg.length);

さらに、ランダムで置き換えられた変数Noを使って、ステージ上にムービークリップを表示させます。

var class_str:String = myImg[No];
var myClass:Class = Class(getDefinitionByName(class_str));
var img:MovieClip = new myClass();
addChild(img);

ランダムで変数Noを決めて、その変数Noの該当する配列の文字列を、getDefinitionByNameでクラス定義しムービークリップとして変数imgに置き換えaddchildでステージ表示させるカラクリになります。

//配列
var myImg:Array = new Array();
myImg[0] = "img_mc1"
myImg[1] = "img_mc2"
myImg[2] = "img_mc3"

//変数
var No = Math.floor(Math.random()* myImg.length);
var class_str:String = myImg[No];
var myClass:Class = Class(getDefinitionByName(class_str));
var img:MovieClip = new myClass();
addChild(img);
img.x = stage.stageWidth / 2;
img.y = stage.stageHeight / 2;

ステージの中心に表示させる為にstage.stageWidth / 2とstage.stageHeight / 2で表示位置を指定してます。

クラス（リンケージ）参照でランダムにムービークリップを呼び出す

クラス参照でステージにムービークリップを配置[3-1]

admin — Wed, 07 Oct 2009 06:25:39 +0000

クラス（リンケージ）参照でムービークリップを動かす

あらかじめライブラリーに表示させたいムービークリップを用意し、プロパティーでリンケージのクラス名を付けます。（例：ball_mc）

new演算子を使ってムービークリップballに置き換え、addChildを使ってステージにムービークリップを配置します。

//ステージに配置
var ball:MovieClip = new ball_mc();
addChild(ball);
ball.x = stage.stageWidth / 2;
ball.y = stage.stageHeight / 2;

初期表示位置（スタート位置）をステージの真ん中に設定しました。

[1-5]で使用した反復運動するアクションスクリプトを使いムービークリップを動かします。

//ステージに配置
var ball:MovieClip = new ball_mc();
addChild(ball);
ball.x = stage.stageWidth / 2;
ball.y = stage.stageHeight / 2;

var speedx:Number = 5;  //スピード
var cicle:Number = 10;  //回転
var mcWidth:Number = ball.width / 2;  //インスタンスの幅
var stageL:Number = 0 + mcWidth;  //幅の最小値
var stageR:Number = stage.stageWidth - mcWidth;  //幅の最大値

ball.addEventListener(Event.ENTER_FRAME,movieBall);  //イベントリスナー登録

//ballのプログラム関数
function movieBall(event:Event):void {
	ball.x += speedx;
	ball.rotation += cicle;
	if (ball.x < stageL || ball.x > stageR) {
		speedx *= -1;
		cicle *= -1;
	}
}

クラス（リンケージ）参照でムービークリップを動かす

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

admin — Thu, 01 Oct 2009 07:44:31 +0000

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

ムービークリップのボタンに飛び先となる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);
		}
	}
}

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

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

admin — Tue, 29 Sep 2009 08:43:54 +0000

ボタンごとにマウスオーバー（オンマウス）のムービークリップを指定する – for編

[2-5]で使用したムービークリップのボタンとイメージムービークリップを連動さるアクションスクリプトをもっと簡略化した条件分岐（今回はfor）でプログラム処理をします。

マウスオーバー、マウスアウトした時の処理を[2-5]ではswitchを使って条件分岐をしていましたが、今回はforを使って条件分岐を行います。
forを使うことで、アクションスクリプトの簡略化にもつながります。

//マウスオーバー
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 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);
    	}
	}
}

オンマウス、マウスアウトした時に走るイベントリスナーをforを使ってループさせます。

まず、forで変数iの条件を設定し、ボタンのムービークリップ（btn_mc）を条件が終わるまで+1づつ足していく処理なので、btn_mc1～btn_mc3までを示しすことになります。さらに変数btnはターゲットになっているボタンのムービークリップとなるので、”btn_mc”+iの条件と同じ時、つまりはbtn_mc1～btn_mc3でのイベントリスナーが走ります。
リスナー関数も同様に、”img_mc”+iとなっているのでimg_mc1～img_mc3がインスタンス名になります。

続いてプログラムリスナー関数の条件分岐もforに変更します。

//アルファプログラム関数
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 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);
}

アルファプログラム関数（オンマウス時に走るイベントリスナー）
上記アクションスクリプト同様にforで変数iの条件を設定します。
さらに変数imgNoを宣言し、”img_mc”+iでループさせることで、img_mc1～img_mc3までを変数imgNoに置き換えますので、すべてのimg_mcの透明度が0になり非表示になります。
しかしターゲットになっているムービークリップをimgに置き換えて透明度を1していますにで、ターゲットになっているムービークリップだけが表示となるカラクリです。

リセットプログラム関数（マウスアウト時に走るイベントリスナー）では、簡潔にターゲットになっているムービークリップの透明度が1、つまり表示になったらリスナー関数の登録の削除を行うカラクリです。

//ループを使い
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].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);
}

ボタンごとにマウスオーバー（オンマウス）のムービークリップを指定する – for

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

admin — Thu, 17 Sep 2009 08:34:07 +0000

ボタンごとにマウスオーバー（オンマウス）のムービークリップを指定する – switch編

複数のムービークリップのボタンと複数のイメージムービークリップを連動させ、条件分岐（今回はswitch）でプログラム処理を変えます。
複数のボタンの登録は[2-2]で使用したfor文を使い、ボタンとなるムービークリップのアクションスクリプトを書きます。
さらにステージ上にマウスオーバー時に動かすムービークリップを用意します。
今回は[1-8]で使用したムービークリップを使い、そのムービークリップの色違いを複数用意しステージに配置してインスタンス名を付けます。（今回はimg_mc1.img_mc2にしました）
インスタンス名を付ける時に[2-2]のようにインスタンス名の最後に1からの数字を付けます。

マウスオーバー時の処理とマウスアウト時の処理を変更していきます。
[2-2]で使用したアクションスクリプトのマウスオーバーとマウスアウトのプログラムにイメージムービークリップを表示させるプログラムを追加します。

//マウスオーバー
function Over(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 0.7;
	switch(btn){
		//1
		case btn_mc1:
		//マウスオーバーされたらイベントリスナー登録
		img_mc1.addEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
		//2
		case btn_mc2:
		//マウスオーバーされたらイベントリスナー登録
		img_mc2.addEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
	}
}
//マウスアウト
function Out(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 1;
	switch(btn){
		//1
		case btn_mc1:
		img_mc1.addEventListener(Event.ENTER_FRAME,zero);
		break;
		//2
		case btn_mc2:
		img_mc2.addEventListener(Event.ENTER_FRAME,zero);
		break;
	}
}

event.targetをbtnに置き換え、そのbtnをswitch文でcaseに該当するイベントリスナーを走らせる感じになります。
この時にcaseなのでbreakを入れないと次の処理までしてしまいますので注意して下さい。

次にマウスオーバーした時とマウスアウトした時に動くプログラム関数（リスナー関数）のプログラムを書きます。
今回はプログラム関数でもswitchを使いターゲット別にムービークリップの処理を変えています。
例えば、img_mc1のイベントリスナーが登録されたら、imgAlphaが走りだし、img_mc1を表示させ、img_mc2を非表示にし、さらにイベントリスナーの登録解除させます。
マウスアウト時も同様です。

//アルファプログラム関数
function imgAlpha(event:Event){
	//ムービークリップのチェック
	var img:MovieClip = event.target as MovieClip;
	switch(img){
		//1
		case img_mc1:
		img_mc1.alpha = 1;
		img_mc2.alpha = 0;
		img.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
		//2
		case img_mc2:
		img_mc1.alpha = 0;
		img_mc2.alpha = 1;
		img.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
	}
}
//リセットプログラム関数
function zero(event:Event):void{
	var img = event.target;
	switch(img){
		//1
		case img_mc1:
		img_mc1.alpha = 1;
		img_mc1.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		img_mc1.removeEventListener(Event.ENTER_FRAME,zero);
		break;
		//2
		case img_mc2:
		img_mc2.alpha = 1;
		img_mc2.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		img_mc2.removeEventListener(Event.ENTER_FRAME,zero);
		break;
	}
}

どのムービークリップのボタンがマウスオーバーやマウスアウトになり、どのイベントリスナーを動かすのかを条件分岐（switch）させて該当するケースでプログラムが動き出すカラクリです。

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

	//ボタンモード
	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;
	switch(btn){
		//1
		case btn_mc1:
		//マウスオーバーされたらイベントリスナー登録
		img_mc1.addEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
		//2
		case btn_mc2:
		//マウスオーバーされたらイベントリスナー登録
		img_mc2.addEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
	}
}
//アルファプログラム関数
function imgAlpha(event:Event){
	//ムービークリップのチェック
	var img:MovieClip = event.target as MovieClip;
	trace(event.target.name);
	switch(img){
		//1
		case img_mc1:
		img_mc1.alpha = 1;
		img_mc2.alpha = 0;
		img.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
		//2
		case img_mc2:
		img_mc1.alpha = 0;
		img_mc2.alpha = 1;
		img.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		break;
	}
}

//マウスアウト
function Out(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 1;
	switch(btn){
		//1
		case btn_mc1:
		img_mc1.addEventListener(Event.ENTER_FRAME,zero);
		break;
		//2
		case btn_mc2:
		img_mc2.addEventListener(Event.ENTER_FRAME,zero);
		break;
	}
}
function zero(event:Event):void{
	var img = event.target;
	switch(img){
		//1
		case img_mc1:
		img_mc1.alpha = 1;
		img_mc1.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		img_mc1.removeEventListener(Event.ENTER_FRAME,zero);
		break;
		//2
		case img_mc2:
		img_mc2.alpha = 1;
		img_mc2.removeEventListener(Event.ENTER_FRAME,imgAlpha);
		img_mc2.removeEventListener(Event.ENTER_FRAME,zero);
		break;
	}
}

ボタンごとにマウスオーバー（オンマウス）のムービークリップを指定する – switch

ムービークリップをボタンとして使う[2-4]

admin — Sun, 13 Sep 2009 08:10:49 +0000

複数のムービークリップのボタン別にリンクを付ける

[2-3]で使用したアクションスクリプトでは、複数のムービークリップに対して一つのリンク先を付けてましが、今回は押されたムービークリップのボタンごとに、別々のリンク先を用意して、条件分岐でリンク先を変更させます。

[2-3]で使用したアクションスクリプトのクリック時、またはマウスダウン時のリスナー関数に条件分岐のプログラムを追加します。
今回使う条件分岐はswitchで、ターゲットのムービークリップごとに振り分けて、別々のリンク先を指定するような感じなります。

//押されたムービークリップで条件分岐
	switch(btn){
		//1
		case btn_mc1:
		var google:URLRequest = new URLRequest("http://www.google.co.jp");
		navigateToURL(google);
		break;
		//2
		case btn_mc2:
		var yahoo:URLRequest = new URLRequest("http://www.yahoo.co.jp");
		navigateToURL(yahoo);
	}

クリック時もしくはマウスダウン時のムービークリップのイベントターゲットがbtn_mc1のやbtn_mc2か、どのケースに該当するか判定させています。
イベントターゲットを変数btnに置き換え、そのbtnのターゲットがそのケースに当てはまるかを条件分岐しています。

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

	//ボタンモード
	this["btn_mc"+i].buttonMode = true;
}
//マウスオーバー
function Over(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 0.7;
}
//マウスアウト
function Out(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
	btn.alpha = 1;
}
//マウスダウン
function Down(event:Event):void{
	var btn = event.target;  //ターゲットを置き換える
    var target:String = "_self";

	//押されたムービークリップで条件分岐
	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);
	}
}

複数のムービークリップのボタンに条件分岐でリンクを付ける

ADD CHILD = AS3 » MovieClip

ムービークリップを徐々に加速させる[3-7]

カスタムクラスで読み込んだムービークリップに加速度をつけて移動させる

関連する投稿

TransitionManagerクラスを使ってトランジションさせる[3-6]

ステージに配置したムービークリップにTransitionManagerクラスを使ってトランジション効果をつける

トランジションの種類

関連する投稿

Tweenクラスでムービークリップをトゥイーンさせる[3-4]

ステージに配置したムービークリップにTweenクラスを使ってトゥイーンさせる

アニメーションの種類

イージンの種類

関連する投稿

カスタムクラスでステージにムービークリップを配置[3-3]

カスタムクラスを使ってステージにムービークリップを配置

関連する投稿

クラス参照でステージにムービークリップを配置[3-2]

クラス（リンケージ）参照でランダムにムービークリップを呼び出す

関連する投稿

クラス参照でステージにムービークリップを配置[3-1]

クラス（リンケージ）参照でムービークリップを動かす

関連する投稿

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

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

関連する投稿

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

ボタンごとにマウスオーバー（オンマウス）のムービークリップを指定する – for編

関連する投稿

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

ボタンごとにマウスオーバー（オンマウス）のムービークリップを指定する – switch編

関連する投稿

ムービークリップをボタンとして使う[2-4]

複数のムービークリップのボタン別にリンクを付ける

関連する投稿