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

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

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

Processing 入門

14.ブロック崩しを作ろう

 

前回の「みどりを救え」ゲーム、理解できましたか?

このページからは新しいゲームの説明になります。
一度、説明した内容は少しずつ簡略化していくので
分からない部分が出てきたら、前のページに戻るのもいいかもしれません。

 

 

どんなゲーム?

今回の題材は「ブロック崩し」です。
ビデオゲームが流行るキッカケになった古くからあるゲームです。

 

ブロック崩しの作り方

 

ルールはシンプルで、画面下部にあるラケット(バー)で玉を打ち返し
画面上部のブロックを消していく遊びです。

学習方法は、プログラムを入力し実行しながら動作を確認していきましょう。
いろいろと試してみたい人は、プログラムをそのまま入力する学習用と
改造して試す実験用の2つにファイルを分けて作ることをおすすめします。

 

 

題材について

「ブロック崩し」を初心者向けの入門サイトでよく見かけます。
当サイトも初心者向けなのですが・・・
「ブロック崩し」を真面目に作ろうとすると、なかなかの制作レベルが必要になります。
はっきり言って初心者向けではありません。
しかし、ゲームとしての魅力があり知名度も高いので取り上げました。

 

初心者向けの題材とするために、ざっくりとした仕様にしています。
細かいところは目をつぶりました
いつかプログラマーとしてのレベルが上がったとき、もう一度「ブロック崩し」に
挑戦してみて下さい。
さまざまな問題点が見えてくると思います。

 

 

新規のファイルを保存しよう

Processing を起動して次のプログラムを入力します。
ここからはじめます。

 

新規のファイルを作成する

 

 

ここでプログラムの保存をします。
メニューの「ファイル」をクリック、そして「名前を付けて保存」をクリックします。

 

ファイルを保存

 

保存するファイル名は好きな名前でかまいません。
ここでは blockout01 としました。
後ろに番号を付けたのは、作業途中に番号を変えて保存するためです。
「変更したらプログラムが動かなくなった。原因が分からない」
なんてことになっても、ちょっと前のファイルが保存してあれば
またそこから始めればいいのです。

 

 

プログラムの流れを作ろう

ゲーム作るとき、プログラムの流れを意識しながら進めると
なにかと都合がいいです。
さらに制作パターンを作ることで、バグ(不具合)の少ないプログラムが
作れるようになります。

今回は初期化と各画面の関数をはじめに作ります。

 

プログラムの流れを前もって作る

 

これで変数 gseq の値を変えるだけで、画面を簡単に切り替えられるように
なりました。

19行目、gseq の初期化をしています。
gseq のように関数の外で宣言をすると、すべての関数で利用できるようになります。
このようなものをグローバル変数といいます。

ゲームに関連したグローバル変数は gameInit () の中で
初期化をする習慣を付けましょう。

 

 

HSB カラーモードを使おう

これまでカラーモードの設定はしませんでした。
デフォルトでは RGB モード(R:赤 G:緑 B:青)となっているため
それに従った方法で色を設定していました。

HSB モード(H:色相 S:彩度 B:明度)では色を直感的に扱いやすくなります。
ブロック崩しのようなカラーなども簡単に設定できます。

 

HSBカラーモードだと使いやすい

 

 

カラーモードを次のように設定します。
設定は 6 行目でしています。
gameTitle () の中に、カラーを見るためのサンプルを用意しました。
実行して確認したら消しましょう。

 

HSB カラーモードに変更

 

設定方法です。
colorMode ( HSB, 100, 100, 100 )
これは HSB の値をそれぞれ 100 段階で設定するという指定です。
色相(H)だけ 20 段階にしたいのであれば
colorMode ( HSB, 20, 100, 100 )
とすればOKです。

 

 

実行してみましょう。
色相を変化させただけで、きれいな色が表示されますね。

 

HSB モードのサンプル

 

 

自機の表示と移動

ゲーム部分を作り始めます。
まずは自機(プレイヤー)からです。
ここは前回のゲーム「みどりを救え」とほぼ同じなので、くわしい説明を省きます。

 

自機の表示と移動

 

27行目、gseq に1を代入しています。
gameTitle () から gamePlay () へ処理が流れるようにしています。

36行目、HSB カラーモードで指定しています。
ここだけが前回と違いますね。

 

 

実行してみましょう。
マウスカーソルと同期して左右に動けばOKです。

 

マウスカーソルで自機を左右に操作する