ムービークリップの生成と消滅

作品制作プロジェクト

• この授業の後半では, 各自が計画を立てて一つのアプリケーションを制作します. とりあえず夢を語ってみましょう.
• 最終回には, PowerPointなどを使って作品のプレゼンテーションを行います.
• 12月の補講期間には, 自由参加で4コマ分の補講を行います. この時間内には, アプリケーション制作について相談できます.

物体の出現・消滅

例えばブロックが現れたり, 消えたりということを実現しましょう. とりあえず, 出現・消滅させることのできる単位は MovieClipオブジェクトです. とりあえず2つの可能性があります.

1. MovieClipオブジェクトが画面上に存在したまま, _alpha,_visibleなどの属性を操作して, 可視化, 不可視化する
2. attachMovieClip, removeMovieClipメソッドを使って, MovieClipオブジェクトを, 画面(というか親のMovieClipオブジェクトと)接続・切り離しする

物体の出現・消滅の方針1

生成消滅する物体が少ない(同種のものが1個しかないような場合)には前者の方法のほうが簡単でしょう.

// 物体が消滅するサンプル
var ball:MovieClip = this.createEmptyMovieClip("ball",this.getNextHighestDepth());
ball.lineStyle(40,0x0000ff, 100, true, "none", "round","mitter",1);
ball.moveTo(-1,0);
ball.lineTo(+1,0);
ball._x=100;
ball._y=200;

var b1x:Number=0;
var b1y:Number=0;
var b1w:Number=120;
var b1h:Number=10;
var b2x:Number=120;
var b2y:Number=0;
var b2w:Number=120;
var b2h:Number=10;

var block1:MovieClip = this.createEmptyMovieClip("block1",this.getNextHighestDepth());
block1.lineStyle(4,0xff0000, 100, true, "none", "round","mitter",1);
drawRect(block1,b1x,b1y,b1w,b1h);

var block2:MovieClip = this.createEmptyMovieClip("block2",this.getNextHighestDepth());
block2.lineStyle(4,0x00ff00, 100, true, "none", "round","mitter",1);
drawRect(block2,b2x,b2y,b2w,b2h);

function drawRect(mc:MovieClip, px:Number, py:Number, w:Number, h:Number):MovieClip{
	mc.moveTo(px,py);
	mc.lineTo(px,py+h);
	mc.lineTo(px+w,py+h);
	mc.lineTo(px+w,py);
	mc.lineTo(px,py);
	return mc;
}

ball.onEnterFrame=function(){
	if(this._x>=b1x && this._x<b1x+b1w && this._y<b1y+b1h){
		block1._visible=false;
	}
	if(this._x>=b2x && this._x<b2x+b2w && this._y<b2y+b2w){
		block2._visible=false;
	}	
	
}

物体の出現・消滅の方針2

2つの点で方針1と違います.

1. 配列を使った. これで個数が多くても変数nを増やすだけですむ. 方針1のような_visibleの利用と配列を組み合わせることもできる.
2. 出現するときにattachMovieClip, removeMovieClipを使った. このほうが, あとで使いやすい.

// 大量のオブジェクトが発生/消滅するサンプル
// 2010-11-11 hig3

var n:Number=30; // bullet の最大数
var vy:Number=-3; // y方向の速度

// MovieClip を格納する配列. 使っていない要素は false
var bullet:Array=new Array(n);

for(var i:Number=0;i<n;i++){
	bullet[i]=false;
}

//(x,y)に新しいbulletを置け
function create(x:Number, y:Number){
	for(var i:Number=0;i<n;i++){
		if(!bullet[i]){
			bullet[i]=this.createEmptyMovieClip("bullet"+i,this.getNextHighestDepth()); // 背景

			// 短い線を原点近くに描く
			bullet[i].lineStyle(1, 0x0000ff, 100, true, "none", "round", "miter", 1);
			bullet[i].moveTo(-1,0);
			bullet[i].lineTo(1,0);	
			
			
			bullet[i]._x=x;
			bullet[i]._y=y;
			
			break;	// for 文の外に出る
		} else {
			// 次の i を試す. n未満のところになかったらあきらめる
		}
	}
}

// i番目のbulletを消せ
function eliminate(i:Number){
	bullet[i].removeMovieClip();
	bullet[i]=false;
}

// 動きの指定. 個々のオブジェクトの動きをまとめて書いている.
this.onEnterFrame=function(){
	for(var i:Number=0;i<n;i++){
		if(bullet[i]){
			bullet[i]._y+=vy;
			if(bullet[i]._y<0){
				eliminate(i);
			}
		}
	}
};

// thisクラスにキーを押された場合に対応する関数を定義
this.onKeyDown = function(){

if (Key.getCode() == 49 ){// 数字キー1　
		create(100,200);
    } 
//    trace("Key Code: "+Key.getCode()); // トレース画面への出力
};

// thisクラスをイベントリスナーとして登録する.
Key.addListener(this);

もう1個, 例です. 書き方の流儀がちょっと違っちゃってるところあるね〜

var mcmax:Number=100;

var mclist:Array=new Array();

for(var i:Number=0;i<mcmax;i++){
	mclist[i]=attachMovie("ball","ball"+i,this.getNextHighestDepth());
	mclist[i]._x=Math.random()*240;
	mclist[i]._y=Math.random()*240;
	mclist[i]._alpha=Math.random()*100;
}


var count:Number=0;
onEnterFrame = function(){
	if(count<100){
		mclist[count].removeMovieClip();
		count++;
	}
};

課題

• 方針2にしたがって, スカッシュ(ブロック崩し零号機?)を改造して, ラケットから弾丸(ボール?)が何個も発射できるようにしよう(向きや速度は?). 何かの条件で弾丸が消えるようにしよう.
• それじゃスカッシュやブロック崩しじゃない, という文句に対して言い訳を考えよう.
• [発展]弾丸と何かがぶつかったときに, 何かのほうも消えるようにしてみよう. こちらには方針1を使ってみてもいいかも.