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

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

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

Processing 入門

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

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

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

 

 

どんなゲーム?

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

 

ブロック崩しゲーム

 

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

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

 

 

題材について

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

 

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

 

 

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

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

 

プログラムを作り始める

 

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

名前を付けて保存を選ぶ

 

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

 

 

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

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

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

 

プログラムの流れを作っておく

 

これで変数 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です。

 

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

色相を変化させて円を並べる

 

 

自機の表示と移動

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

 

自機の移動処理

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

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

 

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

マウスで自機を左右に動かす

 

次回に続きます。
ところで、ときどき保存を行いましょう。