RPG戦闘シーンのScratchプログラミング解説の第5回目です。
前回の続きで操作するプレイヤーを選択した後、攻撃をするか・魔法を使うか・アイテムを使うかなどのコマンドを選択するプログラムについてです。
コマンド選択の方法は、メニュー方式ではなくてアイコン選択方式になります。
この記事では、ロールプレイングゲーム(RPG)の戦闘シーンにおいてプレイヤーが使うコマンドを選択する方法について紹介します。
なお、このプログラムで使用する画像や音声は、これまでの記事でもたびたび紹介している『無料で使えるスーパーパワーアセットパック(CC0)』にRPGの戦闘シーン向けの素材があるので、それを使用しています。
完成品
この章の内容をご自身のScratch環境に反映すれば、同じ動きを再現することができます。
完成した動き(この記事のゴール)
操作するプレイヤーを選択したあと、左下に2行3列で計6個あるコマンドアイコンのところに制御が移動します。
選択されていない状態のコマンドアイコンは紺色で表していて、選択されると黄色に表示が変わります。コマンドアイコンを選択した状態でスペースキーを押すとコマンドが確定して、制御がコマンドアイコンから離れるので再び紺色に変わります。
下の図のアニメーションは、3体のプレイヤーをそれぞれ選んだときのパターンを1つのアニメーションに結合して表示しています。
コマンドアイコンだけだと、その絵が何のコマンドを表しているか分かりにくいのでコマンド名称を文字で同時に表示するプログラムを用意していますが、それについては次回説明する予定です。
完成した動き(最終形態)
最終形のイメージをつかんでもらうために、すべてのプログラムを結合して実装した最終形態のアニメーションの序盤部分を載せておきます。GIF画像なので音声は聞こえませんが、実際にプレイするとBGMが流れます。
使用したスプライト
スプライトは「初期設定」「背景」「ステータスバー」「warrior2」「Wizard」「bowman」「giant」「mushroom」「mimic」「フェイス」「HPMP文字」「HP数字」「P_MPゲージ枠」「P_MPゲージ」「コマンドアイコン」「E_HPゲージ枠」「E_HPゲージ」「Pマーカー」の18個です(前回と同じ)。
アクションゲーム用の背景・キャラクター・アイテム等の画像や音声は、パブリックドメインである「スーパーパワーアセットパック(CC0)のrpg-battle-system」を使っています。
以前の記事で説明済みのスプライトは、過去記事へのリンクを表示しています。
【初期設定のスプライト】
「初期設定」スプライトはプログラム専用なのでコスチュームはありません。
【背景のスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【ステータスバーのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【warrior2のスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【Wizardのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【bowmanのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【giantのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【mushroomのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【mimicのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【フェイスのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【HPMP文字のスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【HP数字のスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【P_MPゲージ枠のスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【P_MPゲージのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【コマンドアイコンのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【E_HPゲージ枠のスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン 敵キャラクターのHPゲージを表示する(Tips)
【E_HPゲージのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン 敵キャラクターのHPゲージを表示する(Tips)
【Pマーカーのスプライト】
こちらの記事を参照してください↓↓↓(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン プレイヤーを選択するカーソルの表示方法と動かし方(Tips)
完成したスクリプト
完成したスクリプトの全体です。
以前の記事で説明済みのスクリプトは、過去記事へのリンクを表示しています。
【初期設定のスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【背景のスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【ステータスバーのスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン キャラクター配置とアニメーション(Tips)
【warrior2のスクリプト】
今回は解説のテーマではないので省略します。
【Wizardのスクリプト】
今回は解説のテーマではないので省略します。
【bowmanのスクリプト】
今回は解説のテーマではないので省略します。
【giantのスクリプト】
今回は解説のテーマではないので省略します。
【mushroomのスクリプト】
今回は解説のテーマではないので省略します。
【mimicのスクリプト】
今回は解説のテーマではないので省略します。
【フェイスのスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【HPMP文字のスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【HP数字のスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【P_MPゲージ枠のスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【P_MPゲージのスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
【コマンドアイコンのスクリプト】
以前の内容で前半部分は完成しています。下記リンク先のスクリプトと下の図のスクリプトを合わせることで全体が完成します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン ステータスバーにキャラクターアイコン・HP/MPとコマンドアイコン配置する(Tips)
- i:このスプライトのみ
- k:このスプライトのみ
- m:このスプライトのみ
- n:このスプライトのみ
- クローン番号:このスプライトのみ
- コマンド文字:すべてのスプライト用
- warrior2のMP:すべてのスプライト用
- WizardのMP:すべてのスプライト用
- bowmanのMP:すべてのスプライト用
- コマンド種類:すべてのスプライト用
- プレイヤー種類:すべてのスプライト用
- Pキャラとコマンド:すべてのスプライト用
- warrior2有効コマンド:すべてのスプライト用
- Wizard有効コマンド:すべてのスプライト用
- bowman有効コマンド:すべてのスプライト用
【E_HPゲージ枠のスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン 敵キャラクターのHPゲージを表示する(Tips)
【E_HPゲージのスクリプト】
以前の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン 敵キャラクターのHPゲージを表示する(Tips)
【Pマーカーのスクリプト】
前回の内容で完成しているので省略します。(※リンクをクリックすると対象の箇所まで飛びます)
【Scratch 3.0】RPG戦闘シーン プレイヤーを選択するカーソルの表示方法と動かし方(Tips)
スクリプトの作り方
ここからはプログラムを作っていく中でポイントとなる部分を説明します。
ポイント①:左右の矢印キーでコマンドアイコンを選択しているように見せかける
左回りについては右回りと同じロジックでは方向が逆なだけなので、右回りについてのみ説明します。
「右回り」定義ブロックの中の説明からですが、「右向き矢印キー」を押すと変数「i」が1ずつ増えます。変数「i」の最大値は「コマンド種類」リストの長さなので、その長さを超えたら「1」に戻すようにします。
次に「コマンド選択~」定義ブロックをキャラクターごとにつくって並べていますが、この部分はキャラクターごとに使えるコマンドを変えている部分です。詳しくはポイント②で説明します。
この時に設定された変数「i」の値を要素番号として「コマンド種類」リストの中から値を取り出して、「コマンド文字」変数にセットします。
上の「右回り」定義ブロック内で設定された変数「i」の値と「クローン番号」変数の値を比べて一致した場合に「画像効果をなくす」ブロックを実行します。このブロックが実行されると元のコスチューム画像の状態、つまり黄色く光っているような画像になってあたかもそのコマンドが選択されているように見えます。逆に一致していない残りの5個のコマンドアイコン画像は濃い青色のまま(未選択状態)です。
なお、以前の記事で説明済みですが、下の図のように「クローン番号」変数にはクローンごとに「1~6」の別々の値を持たせた状態になっています。
「コマンド文字を送る」メッセージを受け取ってから動くスクリプトについては次の記事で紹介します。
ポイント②:キャラクターによって選べるコマンドを変える
ポイント①で登場した変数「i」は、「コマンド種類」リスト・「warrior2有効コマンド」リスト・「Wizard有効コマンド」リスト・「bowman有効コマンド」リストの要素番号を指定するのにも使用します。
前提として、これらのリストには下図に示したような値が入っていることを理解しておく必要があります。
「コマンド種類」リストは6種類すべてのコマンド名が入っています。一方、赤枠で囲ったキャラクター別の「~有効コマンド」リストにはそのキャラクターが使用可能なコマンドのみ名前が入っています。空欄になっている個所はそのキャラクターが使用できないコマンドであることを表しています。
つまり、たとえばキャラクターが「warrior2」なら「attack, defence, escape, item」の4種類のコマンドは使用できますが、「attack2, magic」コマンドは使用できないという意味になります。
「warrior2」の場合(「コマンド選択warrior2」定義ブロック)でいうと、「warrior2有効コマンド」リストの2番目と3番目は空白なので「i=4(defence)」まで1ずつ増えたら定義ブロックの処理が終わって次の処理に移ることになります。
また、「Wizard」と「bowman」には要素番号3番に「magic」が使用可能になっていますが、これはMP(マジックポイント)が「100(最大)」のときだけ使用できるので、100未満の時は変数「i」を1増やしてコマンドが選べないようにしています。
ほかのキャラクターでも定義ブロックの基本構造は全く同じなので省略します。
ポイント③:コマンドを決めたらリストに登録する
コマンドアイコンを決めたら「スペースキー」を押します。
すると「コマンド登録」定義ブロックに処理が移り、それが終わったら「コマンドアイコン」のすべてのクローンの「色の効果を100にする」ブロックで濃い青色に戻します。
次に「このスクリプトを止める」ブロックで、このスクリプトを停止します。
途中の「コマンド登録」定義ブロックの処理を見ていきます。
まずは変数「n」を「1~コマンド種類リストの長さ」まで1ずつ増やしていきます。この変数「n」を使って「i」の値と「クローン番号」の値と一致しているか調べて、もし一致していたら「(コマンド種類のn番目)を(Pキャラとコマンド)リストに追加」します。
なぜこのような面倒なことをしているかというと、単純に「もし(クローン番号=i)なら」とすると、6回(=コマンド種類の長さ)繰り返されるので「Pキャラとコマンド」リストに同じ内容が6つ連続で追加されるのを避けるためです。
「Pキャラとコマンド」リストに選択したコマンド名を登録した後、そのコマンド名が「attack, attack2, magic」のいずれかの場合は、これらは攻撃系のコマンドのため、次に攻撃対象のキャラクターを選択する処理に移る必要があります。そのために「Eマーカーを送る」ブロックでメッセージを送って制御を別のスプライトに移すようにしています。
逆に、攻撃系のコマンド以外の場合はコマンドの登録は終了になるので、すべてのプレイヤーのコマンド登録が済んだかどうかをチェックするために「コマンド登録チェックを送って待つ」メッセージを送ります。この部分は下のポイント④で説明します。
ポイント④:すべてのキャラクターがコマンドを選んだかどうかチェックする
下の図の「コマンド登録チェックを受け取ったとき」ブロックは、メッセージを受け取ったら動き出すスクリプトです。このスクリプトは、他のスプライトから呼び出される場合もあります。
スクリプトが実行されるとまず、コマンドを実行するプレイヤーの名前・コマンドの種類・攻撃する対象の敵キャラクターの名前などが登録されている「Pキャラとコマンド」リストの中に、その時に生きているすべてのプレイヤーのコマンド登録が完了しているかどうかを調べます。
もし3体のプレイヤーがすべて生きていれば、変数「m」の値は「3」になり、1体しか生きていなければ「m」の値は「1」とカウントされます。
すべてのプレイヤーのコマンド登録が済んでいると、「プレイヤーターンを送る」ブロックを実行して、このスプライトのスクリプトを停止します。
一方で、まだコマンド登録が済んでいない状態だと「Pマーカーを送る」ブロックを実行して、プレイヤー選択に遷移します(こちらの記事で説明済み)。
ここまでのポイントを押さえれば、ロールプレイングゲーム(RPG)の戦闘シーンにおいてプレイヤーが使うコマンドを選択するスクリプトを完成させることができると思います。
失敗しやすいポイント
———
応用編
———
まとめ
今回の記事で説明した『ロールプレイングゲーム(RPG)の戦闘シーンにおいてプレイヤーが使うコマンドを選択するためのプログラミング』のポイントをまとめます。
- ポイント①:左右の矢印キーでコマンドアイコンを選択しているように見せかける(画像効果)
- ポイント②:キャラクターによって選べるコマンドを変える(リストで管理)
- ポイント③:コマンドを決めたらリストに登録する
- ポイント④:すべてのキャラクターがコマンドを選んだかどうかチェックする
第5回目の今回は、プレイヤーを選んだあとのコマンドを選択する部分のプログラムについて説明しました。
一般的には、「たたかう・道具・逃げる」などのメニューを表示してそれを選ぶ形が多いかもしれませんが、たまたまちょうど良い画像が用意されていたのでアイコン形式にしてみました。
メニュー形式に変更する場合、見た目を変更するだけなのでプログラムの基本的な構造はほとんど流用することがきると思います。
今回説明したプログラムあたりから、「メッセージを送る」ブロックを使って次に動かすスプライトに制御を渡すようなシーンが多くなってくると思います。
これも色んな場面で応用のできる1つのテクニックですので理解しておくとよいと思います。
どうでしたか?上手く再現できたでしょうか?
他にも役に立つTips(ティップス)記事をたくさん書いてますので、ぜひ見てみてください。(記事のタイトルに「Tips」と書いていたり「Tips」タグを貼ってあります)