【プログラミング】入門of入門!ゲームプログラミングをイメージしてみよう!「if文編」②

ゲームとの思い出を持っている方も少なくないのではないでしょうか。
私もNintendo 64ゲームボーイに育てられました😋
マリオカートヨッシーアイランドマリオパーティー、ポケモン……。
特に好きだったのはスーパーマリオでした。
それぞれのステージの世界観がすばらしくて、タイトルをヒントにスターを獲得していく……。
タイトルの付け方が絶妙だし、出てくるキャラクターも本当にかわいい😳
知れば知るほどいろんな仕掛けがかくれていて、本当に何時間でも出来てしまう。
64本体が心配なほど熱くなるまで(なっても?😅)、やっていたのが懐かしいです。

www.nintendo.co.jp

misacharo.hatenablog.com

応用がイメージできないと学習のモチベーションが続かない

独学の場合も、スクールに通う場合も、最初は概念的な話になると思います。
「変数を宣言して、そこに値を代入して……」
「クラスというのは……」

練習で書いてみるプログラムも、
値を足し算したり、掛け算したり、音を鳴らしたり……といったものではないでしょうか。
インクレメント「x += 1」を習っても、ピンと来ないですよね🤯
このステップなくして応用にたどり着けることはないのですが、どういった役に立つのかが見えずに、不安になる方も多いのではないでしょうか。

プログラミングがゲームにつながるそのイメージだけでも描けたら、
さらにプログラミングへの興味が増すはずです。

それでは、前回の続き行ってみましょう!
※わかりやすさを優先すべく、実際のプログラミングとの乖離があります。

ゲームを考えよう!

入力を信号で受け取れる

今回は、キーボードの矢印キーを使いましょう。
キーをおすと、どのキーが押されたかを判定できるようになっています。
ゲームコントローラーも同じで、どのボタンが押されたか判定出来るようになっています。

if (右矢印が押された) then
右矢印がおされた場合に走らせたい命令
End if

これによって、割り当てたボタンによって異なった振る舞いを行わせることが出来ます。

今回は以下のようにキーを割り当てます。
右キー:右側に移動、
左キー:左側に移動、
上キー:ジャンプ

画面は座標で表現される

PC画面は二次元座標で表現されています。
1920×1080ピクセルのモニタであれば、ピクセル単位で座標を指定できます。
画像を提示するときに、座標を指定することができます。

ここからが本番

こんなゲームを考えてみましょう。
ユーザーは
丸のキャラクターを矢印キーで左右に動かせる。
左右に移動させながら、上キーを押すと○キャラクターはジャンプする。
壁を超えられたらクリア、タイミングが合わずに壁にぶつかるとゲームオーバー。

キャラクターの座標を(Mx、My)と定義する。
スタート地点の座標は(0, 0)です。
最初に画面上にキャラクターと壁を描画しておく。

f:id:zsdvabo1:20210424112746j:plain
最初の状態 ©みさちゃろ

右キー:右側に移動

if (右キーが押された) then
Mx += 10 #Mx の値を10ピクセル増やす
Picture.Maru = TRUE #まるキャラクターを新しい座標で呈示する
End if
f:id:zsdvabo1:20210424112758j:plain
x座標の値を10ピクセル増やす=10ピクセル右側にずれる ©みさちゃろ

左キー:左側に移動、

if (左キーが押された) then
Mx -= 10 #Mx の値を10ピクセル増やす
Picture.Maru = TRUE #まるキャラクターを新しい座標で呈示する
End if


上キー:ジャンプ

if (左キーが押された) then
My += 10 #My の値を10ピクセル増やす
Picture.Maru = TRUE #まるキャラクターを新しい座標で呈示する
End if
f:id:zsdvabo1:20210424112805j:plain
y座標に10ピクセル足す=上に10あがる ©みさちゃろ

まとめ

キーの入力を信号で検出できる
その信号によってif文により条件を分岐できる
画面は2次元座標で表現される

画像を呈示する命令はそういったものがあるんだなくらいにおもっていてください。

ゲームとの連続性を感じてもらえましたか😳
次回は壁にぶつかったとき、うまく壁を超えたときのプログラムを見てみましょう😋
それでは次の記事で。