シューティングゲームでは、自機キャラクターの攻撃が敵に当たったときや敵の攻撃を受けたときに双方のキャラクターに何らかのアクション（イベント）が発生します。
プログラム上でこのようなイベントを検知する方法を当たり判定と言います。
今回は、当たり判定を利用して自機キャラクターの体力ゲージを表現します。自機キャラクターが敵から攻撃を受けるとゲージが減っていき、ゲージが無くなるとゲームオーバーになります。
この記事を読んでいただくと、シューティングゲームで自機キャラクターの体力ゲージの作り方が分かるようになります。
なお、この記事で使用しているスプライト（キャラクター・背景・オブジェクト・音声など）はすべてパブリックドメインの無料の素材をダウンロードして使用しています。
シューティングゲームとは、戦闘機・宇宙船・ロボットなどを操作して、レーザー・ミサイル・銃などの武器を用いて敵を射撃（シューティング）しながら進んでいくゲームの総称（国内での略称は「STG」）。画面上に大量の弾丸が飛び交うものは「弾幕シューティング」と呼ぶ。
スクリプトの作り方
完成した動き
自機キャラクターの真下に体力ゲージを表示しています。
自機キャラクターが敵の弾に当たると体力ゲージが少しずつ減少し、体力ゲージが無くなると消滅します。また、自機キャラクターが敵の機体にぶつかると体力ゲージが0になって消滅します。
当たり判定のプログラムや体力ゲージ以外のプログラムの説明はこちらの記事で紹介済みです。
完成したスクリプト
使用したスプライトと完成したスクリプトの全体です。
この章の内容をご自身のScratch環境に反映すれば、同じ動きを再現することができます。
【スプライト】
スプライトは「背景」「自機」「弾丸」「爆発」「敵機２」「敵の弾２」「体力ゲージ枠」「体力ゲージ」の8つです。
シューティングゲーム用の背景・キャラクター・アイテム等の画像や音声は、パブリックドメインである「スーパーパワーアセットパック（CC0）のspace-shooter」を使っています。
【背景のスクリプト】
背景のスクリプトはありません。大きさを160％に拡大して使用しています。
【自機のスクリプト】
自機スプライトのプログラムは、こちらの記事の内容を流用して一部のブロック（「体力ゲージの長さ」変数や「メッセージを送る」ブロック）を追加してつくっています。
【弾丸のスクリプト】
自機キャラクターの弾丸スプライトのプログラムは、こちらの記事内容のほぼほぼコピーなのでここでは省略します。↓↓↓
【Scratch 3.0】シューティングゲーム 当たり判定の方法（敵にダメージを与えた場合①）（Tips）
【爆発のスクリプト】
爆発スプライトのプログラムは、こちらの記事内容のコピーなのでここでは省略します。↓↓↓
【Scratch 3.0】シューティングゲーム 当たり判定の方法（敵にダメージを与えた場合①）（Tips）
【敵機２のスクリプト】
敵機２スプライトのプログラムは、下の2つの記事の内容を合体させてつくっています。↓↓↓
【Scratch 3.0】シューティングゲーム 敵の攻撃をつくる方法②（Tips）
【Scratch 3.0】シューティングゲーム 当たり判定の方法（敵にダメージを与えた場合①）（Tips）
- 敵の弾2x：すべてのスプライト用
- 敵の弾2y：すべてのスプライト用
- 敵の弾2d：すべてのスプライト用
- 変数：このスプライトのみ
【敵の弾２のスクリプト】
敵の弾２スプライトのプログラムは、こちらの記事内容のコピーなのでここでは省略します。↓↓↓
【Scratch 3.0】シューティングゲーム 敵の攻撃をつくる方法②（Tips）
【体力ゲージ枠のスクリプト】
体力ゲージ枠は、常に自機スプライトにくっついて動くように座標を設定しています。
ゲームオーバーになったら隠します。
- 幅：このスプライトのみ
- 高さ：このスプライトのみ
【体力ゲージのスクリプト】
体力ゲージも自機スプライトにくっついて動くように座標を設定しますが、体力ゲージ枠と違って長さが変化します。
あらかじめ、長さが異なるコスチュームを必要な分だけ用意しておきます。長さの数値とコスチューム名を一致させてあります。
体力ゲージの長さが変化しても位置がズレないように座標を計算して設定する必要があります。
体力ゲージもゲームオーバーになったら隠します。
- 体力ゲージの長さ：すべてのスプライト用
スクリプトの説明
プログラムを作っていく中でポイントとなる部分を説明します。（背景・弾丸・爆発・敵機２・敵の弾２スプライトの説明は省略しますので、詳細は上に記載したリンク先の記事を参照ください）
ポイント①：体力ゲージと枠のコスチュームを用意する
体力ゲージ枠には、スーパーパワーアセットパックの「Space Shooter」に用意されている「health-bar.png」ファイルを使用します。
これはもともと98×32ピクセルのサイズで作られていますが、横を引き延ばして120×32ピクセルにサイズを拡張します。
これは体力バーが100のときにちょうど収まるサイズになっています。
※スプライトの中心と図形の中心は一致させます。
体力ゲージには、スーパーパワーアセットパックの「Space Shooter」に用意されている「health-bar-fill.png」ファイルを使用します。
もともとのサイズは80×18ですが、高さは変えずに横のサイズを0～100まで10ずつ変えたコスチュームを計11種類用意します。
※下の図のコスチューム名=0の画像サイズが1×1になっていますが、実際は何も描いていません。絵柄が何もないときは仕様で1×1のサイズとなるようです。
※スプライトの中心と図形の中心は一致させます。
ポイント②：体力ゲージと枠を自機スプライトと一緒に動くようにする
体力ゲージと体力ゲージ枠、それと自機スプライトが同時に同じように動かします。
体力ゲージ枠はコスチュームの変更はないので、X座標・Y座標をずっと自機スプライトと一致させます。ただし、自機スプライトの少し下に置いておきたいので「Y座標－30」としています。
【体力ゲージ枠のスクリプト】
体力ゲージはコスチュームを変更しながら体力ゲージ枠スプライトの左端にくっつきながら動くので、横軸（X座標）の計算が必要になります（以下の式）。
$$自機のx座標-((100-体力ゲージの長さ)\div5$$
厳密には2で割れば良いはずですが、体力ゲージ枠の枠の太さを考慮する必要があるようで動かしてみながら微調整したら5で割るとちょうど良い感じになりました。なのでここは各自調整が必要かと思います。
【体力ゲージのスクリプト】
ポイント③：敵の攻撃を受けたら・敵にぶつかったら体力ゲージを減らす
敵の弾に触れたら「体力ゲージの長さ」変数の値を10減らします。たとえば、変数の値が100から90になると、ポイント②で説明したように体力ゲージのコスチュームも100から90に変更になってゲージが短くなります。
同じように敵の機体に触れたら一発アウトなので、「体力ゲージの長さ」変数の値を0にして「ゲームオーバーメッセージ」を送ります。
メッセージを受け取ったら自機・体力ゲージ枠・体力ゲージのスプライトは隠れます。
【自機のスクリプト】
ここまでのポイントを押さえてスクリプトを組むことが出来たら、シューティングゲームで自機キャラクターの体力ゲージを表現するプログラムの完成です！
失敗しやすいポイント
体力ゲージのスクリプトで説明したX座標の計算式を理論値である2で割ってみるとどうなるかやってみました。
$$自機のx座標-((100-体力ゲージの長さ)\div2$$
ゲージが枠からどんどんはみ出していきます。このようになるので動かしながら数字を調整した方が良さそうです。
応用編
体力ゲージを回復させるアイテムを導入してみました。アイテムをゲットすると体力ゲージが10だけ回復します。
まとめ
さいごに、今回の記事で説明した『シューティングゲームで自機キャラクターの体力ゲージを表現するスクリプトの作り方』のポイントをまとめます。
- ポイント①：体力ゲージと枠のコスチュームを用意する（ゲージは長さを変化させる数だけコスチュームをつくる）
- ポイント②：体力ゲージと枠を自機スプライトと一緒に動くようにする（ゲージのX座標の計算が必要）
- ポイント③：敵の攻撃を受けたら・敵にぶつかったら体力ゲージを減らす
ネットで調べてみると、ゲージ枠はスプライトでゲージはペンカテゴリーのブロックをつかった体力ゲージのサンプルはわりと見つかるのですが、ペンで描いた図形だとステージに描いてしまうのでスプライトを被せられないのが大きな欠点です。
今回紹介したようにどちらもスプライトを使った方法であれば、このような欠点をカバーできるのでたいへん有益です。
どうでしたか？上手く再現できたでしょうか？
他にも役に立つTips（ティップス）記事をたくさん書いてますので、ぜひ見てみてください。（記事のタイトルに「Tips」と書いていたり「Tips」タグを貼ってあります）
