初心者のためのゲームプログラミング入門

プログラミングとゲームの杜

初心者のためのプログラミング入門 & ゲームプログラムの作り方入門

Small Basic 入門

26.ふらふらUFOゲームを作ろう

 

今回から新しいゲームを作ります。
左右の壁に当たらないように、UFOを操作するゲームです。
これまでに作ったゲームとは違うテクニックを使います。
当然、いままでのプログラミングスキルも必要です。
分からないことが出てきたら、前のページを読み直すのもいいでしょう。

 

 

ふらふらUFOゲームとは

今回のゲームはキーボードで操作します。
左右のカーソルキーで UFO を左右に動かします。
ゲームオーバーからリトライするときはスペースキーを使います。

マウス操作でもよかったのですが、色々なスキルを身に付けてもらいたいのでキー入力の操作にしました。

 

ゲーム中とゲームオーバー時の画面です。

ふらふらUFOゲームのプレイ中画面 ふらふらUFOゲームのゲームオーバー

左右の壁にぶつからないように、左右のカーソルキーで UFO を操作します。
それだけのシンプルなゲームです。

30年以上前、パソコンがマイコンと呼ばれていた時代によく見かけたゲームです。
当時はスクロールという技(?)で作られてましたが
違う方法で再現したいと思います。

 

 

背景を表示しよう

それではプログラミングを始めます。
まずはウィンドウの設定をします。

ウィンドウの設定

9行目、背景色を設定しています。
色の設定方法はいくつかあります。
(参照:グラフィックス機能を使ってみよう
自分にとってやり易い方法をおぼえましょう。

 

次に谷の部分を作ります。
これは明るい色の四角を並べることで、谷のように見せます。
なぜこのような方法なのかはあとで説明します。

四角を並べて谷のようにする

 

プログラムを次のように変更します。

四角を並べて表示する

13-19行、幅や高さ、色を指定して 24 枚の四角を登録します。
25-28行、四角を表示する座標をセットしています。
27行目、変数 i に四角の高さを掛けることで、縦に並べています。
34-36行、24 枚の四角を設定した座標に表示しています。

前回の「メテオゲームを作ろう」を思い出してください。
プログラムの形としてはほぼ同じです。
隕石が四角になっただけです。

 

 

背景を動かそう

並べた四角を動かしいて、背景がスクロールしているように見せます。
四角を縦に並べた理由はこのためです。
方法は単純で、1つ下の四角の座標を1つ上の四角の座標に入れます。この作業を順番にしていきます。
これだけで、一番下の四角を左右に動かしたとき、スクロールしているように見えます。

四角を動かしてスクロールのように見せる

 

プログラムを次のように変更します。

スクロールしているようなプログラム

34行目、ここにあった谷の表示処理をサブルーチン化しました。
1つの処理が長くなるときには、この方が見やすいですね。

44行目、変数 rnd の中に -10, 0, +10 のどれかを代入します。
つまり、左へ動かす、動かさない、右へ動かすの三択となります。
46-51行目、ウィンドウの枠から四角がはみ出ないように制限しています。

55-57行目、1つ下の座標を1つ上に移動しています。
変数 i の 23 番目を除いているのは、1番下の四角だからです。

 

実行すると、下から上へスクロールしているように見えると思います。

 

 

背景を大きく動かす

実行してみると壁の凸凹が細かく、大きな変化がありません。
細かな凸凹ではなく、左右に大きく動かそうと思います。

谷を大きく動かす

 

方法としては単純で、乱数の発生回数を減らすだけです。

乱数の発生回数を減らす

変数 vcnt を使って5回に1回、乱数を発生させるようにしました。
46行目の数値を変えることで、乱数の発生タイミングを調整できます。

 

 

はみ出し制限に注意

実行中の処理をじっと見ていると、あれ?って思うことありませんか。
谷の四角が画面の端にくると、まっすぐな状態が多いということに。

原因ははみ出し制限にあります。(色のある行です)

四角の画面はみ出しチェック

51行目、画面の左側 10 より少ないとき、四角の座標を 10 にしています。
乱数が連続して左だったとしても、四角が画面外へ出ないようにです。
54行目も同じく、右側の画面外へ出ないようにしています。

そのため画面の両端に四角があるとき、まっすぐな状態が発生し易いです。

 

これを回避するためにプログラムを変更します。

端の時、乱数の向きを変える

はみ出し制限に引っ掛かったとき、乱数の符号を逆にします。(53,58行目)
これで四角の移動方向が変わります。
変数 vcnt = 0 としているのは、すぐに rnd が変わらないようにするためです。

実行すると次のようになります。

画面の端で向きが変わる