|
|---|
iOS 5.1に実装された「DeviceOrientation Event」APIと、ゲームライブラリー「enchant.js」を使ったスマートフォン用ゲームを前回に続き作ります。今回は、前回のスカッシュゲームをベースにブロック崩しを仕上げていきましょう。
ブロックの描画
ブロック崩しの基本的な原理はスカッシュと同じですが、ブロック崩しではボールで崩していく大量のブロックが必要です。enchant.jsはオブジェクト指向なのでブロッククラスを作っても処理できますが、今回は配列にブロックの情報を入れて処理する、昔ながらの方法を採用します（クラスを使ったサンプルは最後のページにURLを記載してありますので参考にしてみてください）。
ブロックの合計数を入れる変数「count」、ブロックの情報を入れる配列「block」を用意します。ブロックをすべて消すと再度ブロックを表示してゲームを続行するため、消したブロックの数を入れる変数「total」も用意しました。
// ブロックの総数を入れるカウンタ変数
var count = 0;
// ブロックを格納する配列
var block = new Array();
// 消したブロックの総数を入れる変数
var total = 0;
ブロックはゲーム開始時だけでなくすべて消し終わったときにも描画するので、関数として用意しましょう。関数drawBlock()ではブロックはスプライト（関連記事）として作成し、for命令を使ってX, Y座標に沿って規則正しく並べていきます。
function drawBlock(){
count = 0; // ブロックの総数を示すカウンタを0にする
// ボールの設定を縦横の数だけ繰り返し生成
for(var y=0; y<5; y++){
for(var x=0; x<7; x++){
block[count] = new Sprite(24, 12);
block[count].image = game.assets["images/block.png"];
block[count].x = x * 32+12; // X座標
block[count].y = y * 18 + 30; // Y座標
game.rootScene.addChild(block[count]);
count = count + 1; // ブロックの総数を示すカウンタを増やす
}
}
total = count; // 消すブロックの総数を変数に入れる
}
