トトガノート

All about TOTOGA

スマホ

前回に引き続きMaia1.pde(「3の倍数をクリックするゲーム」)のアンドロイド化に取り組んでいます。

Gravity4Android.pdeの要領で書き換え、娘たちのタブレットですんなり動きました。

setup()で、
size(displayWidth, displayHeight, P2D);
を実行すると、width=1280, height=736 が代入されました。

screenScale = min(width / (float)baseWidth, height / (float)baseHeight);
は、1.533333…になります。

ただ、ベルトコンベアの座標とか、テキストの表示とか、いまひとつシックリ来ないので、もう少し調べる必要があります。

マウスの座標変換は、isHitMouse()を、
int touchX = int(mouseX / screenScale);
int touchY = int(mouseY / screenScale);

return ( touchX > unitX && touchX < unitX + unitW && touchY > unitY && touchY < unitY + unitH );

と書き換えることで、問題なく実現できました。



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

Maia0.pde(「3の倍数をクリックするゲーム」)をアンドロイド対応に書き換えてみることにしました。

Gravity4Android.pdeを参考にしようとしましたが、スケーリングがやはりややこしい…。

今回は、
int baseWidth = 640; // 基準となる横画面サイズ
int baseHeight = 480; // 基準となる縦画面サイズ
として、

setup()で、
size(baseWidth, baseHeight);
を実行すると、widthとheightという変数はどこでも定義してないのですが、勝手にwidth=640, height=480 が代入されるようです。

screenScale = min(width / (float)baseWidth, height / (float)baseHeight);
は、当然1になります。



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

Atlas0.pdeのプログラムを改造して、「3の倍数をクリックするゲーム」(Maia0.pde)を作ってみました。Atlasをもとにしたので、その娘Maiaの名前を借用しました。

・まず、変数unitType、UNIT_DEACTIVE_PERは不要なので、コメント化。

・ユニットに表示される数値のための変数unitValuを新設。

・「ベルトコンベアー描画」の後に、タイトル"Multiple of 3"をtext()で描画。

・mousePressed()で、クリックしたのが3の倍数かどうかを判定。

・resetUnit()で、unitValuの値を乱数発生。

・drawUnit()で、unitValuの値を描画。

実行してみると…


《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p248からの「ベルトコンベアのゲーム」(Atlas10.pde)についてプログラムを見てみます。

Atlas9.pdeからの変更点は…本書の中の説明で十分かと思いますが、自分なりにメモっておきます。

・得点が大きいほどレベル(難易度)を上げる変更は、Unit.pdeのstepUnits()

・ドラッグ後に思っていた場所と違う位置にユニットが配置されることを少なくする変更は、
Grid.pdeのgetFreeGridMousePos()
Atlas10.pdeのmouseDragged()とmouseReleased()


実行してみると…


《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p243からの「ベルトコンベアのゲーム」(Atlas9.pde)についてプログラムを見てみます。

今回はロゴ・タイトル画面を表示するための変更です。UnitとGridの変更はありません。

Atlas8.pdeからの変更点は…

・各種変数の追加
final int MODE_LOGO = 0; // モード:ロゴ画面
final int MODE_TITLE = 1; // モード:タイトル画面
final int MODE_GAME = 2; // モード:ゲーム画面
int mode = MODE_LOGO; // 現在のモード
int modeFrames = 0; // 現在のモードの経過フレーム数
PImage logoImg; // ロゴ画像

・setup()でロゴの画像読み込み
logoImg = loadImage("devlogo.png");

・draw()では…

現在のモードの経過フレーム数をカウントアップして
modeFrames++;

ロゴやタイトル画面を表示します。
if(drawLogo()) return;
if(drawTitle()) return;

drawLogo()、drawTitle()、changeMode()等は、自分のロゴを作ってから改めて吟味しましょう。

実行してみると…



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p237からの「ベルトコンベアのゲーム」(Atlas8.pde)についてプログラムを見てみます。

今回は音を鳴らすための変更です。

Atlas7.pdeからの変更点は…

・import ddf.minim.*; 新設

・サウンド関係の宣言
Minim minim;
AudioPlayer bgm;
AudioSample seMouse, seLink, seRemove;

・setup()で新設
// サウンド読み込み
minim = new Minim(this);
bgm = minim.loadFile("bgm.mp3", 2048);
seMouse = minim.loadSample("move.wav", 1024);
seLink = minim.loadSample("link.wav", 1024);
seRemove = minim.loadSample("remove.wav", 1024);

・resetStage()で新設
bgm.play(); // BGMを再生
bgm.loop(); // 曲が終わっても最初から繰り返すように指定

・drawResult()で
bgm.pause(); // BGMを停止


Grid.pdeからの変更点は…

・drawGridLinks()において
int prevN = unit.getLinkCount();を新設して
// 繋がった瞬間のSEを再生
if(n > prevN) seLink.trigger();

実行してみると…



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p230からの「ベルトコンベアのゲーム」(Atlas7.pde)についてプログラムを見てみます。

自然の素材をそのまま生かした「数寄屋デザイン」への変更です。

Atlas6.pdeからの変更点は…

・PImage bgImage; 新設

・setup()で新設
// 画像読み込み
loadUnitImages();
bgImage = loadImage("bg.png");

・draw()で新設
// 背景
background(0);
image(bgImage, 0, 0, width, height);

・drawGame()で
グリッド背景描画が削除。

Unit.pdeからの変更点は…

・ユニットが動く速度の変更
final float UNIT_SPEED = 5.0f;

・ユニットクラスが使用する画像を読み込むの新設
loadUnitImages()

・draw()において
「移動中は一定間隔で脈動する演出」の追加
「ユニット本体描画」
if(getLinkCount()>1) {
image(unitLinkedImages[type], 0, 0, w, h);
} else {
image(unitNormalImages[type], 0, 0, w, h);
}
popMatrix();
番号描画は削除。

実行してみると…



かなり、完成度の高いゲームのように見えるのですが、プログラムを比較してみると内容はほとんど変わっていません。

素晴らしい…。

《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p200からの「ベルトコンベアのゲーム」(Atlas6.pde)についてプログラムを見てきました。前回はdraw()の中のdrawGame()の中のdrawGridLinks()の中のcountLinkedUnit()を見てみました。

drawGridLinks()が終わると、drawGameInfo()が実行されますが、時間と得点の描画ということで特別な内容は無いようです。

drawGame()が終わると、drawResult()が実行されますが、これも結果表示で特別な内容は無いようです。

ということで、Atlas6.pdeの調査も今回で終わろうと思いますが、最後にデバッグ用の関数が用意されているので、これを実行させてみましょう。

draw()の中のdrawGame()の中にdrawGridInfo()がコメント文になっています。「//」を消して有効にすると、以下のように表示が変わります。私の腕も上がりました(笑)



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p200からの「ベルトコンベアのゲーム」(Atlas6.pde)についてプログラムを見てきましたが、今回はdraw()の中のdrawGame()の中のdrawGridLinks()の中のcountLinkedUnit()を見てみます。

この関数の働きは「// 繋がっているユニットの数を再帰的に数える」となっています。つまり、countLinkedUnit()の中にcountLinkedUnit()があります。引数の isFirst を、drawGridLinks()の直下の場合はtrue、countLinkedUnit()の下で実行されている場合はfalseにすることで、機能を切り換えています。

最初のif文の条件であるisInGrid(gx, gy)は、「gx>=0 && gx=0 && gy
drawGridLinks()下で実行されている場合は
for(int iy=0; iy
ですから、countLinkedUnit()の下で実行された場合だけ、このif文が効いてくることになりそうです。

次のif文は、drawGridLinks()の直下で実行されている場合だけgridFlags[iy][ix]を全てfalseにします。linkUnitsは、drawGridLinks()の中で定義されたローカルなArrayListで、初めての時だけクリアされます。

「// 調査中フラグがあるグリッド」や「// 停止したユニットがないグリッド」の場合は、計数しないでreturnします。

「// 同じ種類もしくは万能タイプのとき」は「// 調査中フラグを有効」にして、「// つながっているユニットとしてリストに追加」します。つまり、linkUnitsの要素の一つとして、このユニット(grid[gy][gx]のユニット)を追加します。

「// 万能タイプの場合は」万能でないタイプに「タイプを確定」します。

上下左右の「// 繋がっている数を再帰的に数え」ます。

drawGridLinks()の直下で実行されている場合だけ、上下左右の計数結果をunit.linkTop、unit.linkBottom、unit.linkLeft、unit.linkRightに代入します。

最後に「// 繋がっている数を」returnで「返す」ことになります。



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

p200からの「ベルトコンベアのゲーム」(Atlas6.pde)についてプログラムを見てきましたが、今回はdraw()の中のdrawGame()の中のdrawGridLinks()を見てみます。

この関数の働きは「// グリッドを調査して繋がりを判定、描画」となっています。

ローカルな ArrayList linkUnits を定義しています。それと、繋がりを計数する変数 linkCount も。

二重のforループで、表示されているユニット全てについて処理していきます。

まず、対象とするgrid[][]をローカルなUnitのunitに代入。繋がっている数を調べます。

countLinkedUnit()は繋がっているユニットの数を数える関数のようですが、再帰処理を含んでおり、Atlas6のメインディッシュなので、解析は後にとっておきます。

countLinkedUnit()による計数結果nが、UNIT_LINK_NUM(この数に達するとUnitは消滅する)に達していて、このUnitのlifeFramesが負のとき、「// 繋がっているユニットを一定フレームで消滅させる」処理を行っています。

for(Unit u : linkUnits)は、ArrayListであるlinkUnitsの要素となっているUnit全てについて処理を行うという意味のようです。それぞれのUnitのメンバー関数setLifeFrames(60)を実行します。具体的には、u.lifeFramesに60を代入するだけの処理です。

消滅処理のfor文を抜けて、if(unit!=null) 文を抜けて、繋がりがある場合には unit.drawLinks()で繋がりを描画します。重複しないように右と下の繋がりだけ描画するようになっています。

二重のforループを抜けて、ボーナスとかスコアに関する処理をしています。



《インデックス》

◆◆◆参考文献「遊んで作るスマホゲームプログラミング for Android
◆◆◆公文生ならゲームで遊ぶな!ゲームを作れ!
◆◆◆公文式小林教室◆山形県東根市◆◆◆
このエントリーをはてなブックマークに追加 mixiチェック

↑このページのトップヘ