現場レベルのゲーム制作が、すべてここで学べます。
この記事はスレスパ風のデッキ構築系ローグライト要素を持つオリジナルJRPGを作る講座の第3回です。
前作のノンフィールドRPG講座で制作したゲーム「果て無きダンジョン」をアップデートしていきます。
前回はキャラクターのクラスをカードバトルに対応し、バトルシーンのUIを追加しました。
前回の記事：
第3回ではコマンドUIをカードUIに変更し、カードの使用処理を実装します。実際にデッキからカードが配られ、配られたカードを使用できるところまで作っていきましょう。
コマンドUIをカードUIに変更する
カードシステムに変更するため、コマンドUIをカードUIに変更します。このカードUIはプレハブ化して再利用できるようにします。カードとして配るためですね。
Hierarchyウィンドウの[Canvas]→[Button1]→[Icon]オブジェクトをクリックしてInspectorビューを表示します。
ImageコンポーネントのSource ImageにAsset Storeからインポートした[500FreeSkillIcons/Icons]の中から適当な画像をドラッグアンドドロップしておきます（アイコンの見た目を確認しておきます）。
カードのコストを表示するUI
Hierarchyウィンドウの[Canvas]→[Button1]オブジェクトを右クリックし、[UI(Canvas)]→[Image]をクリックします。
Imageオブジェクトの名前を「Cost」に変更してInspectorビューを表示し、下の画像のとおり変更します。
さらに、Costオブジェクトを右クリックし、[UI(Canvas)]→[Text – TextMeshPro]をクリックします。Inspectorビューを表示して、下の画像のとおり変更します。
これでカードのコストを表示するUIが追加されました（仮に数字をTextInputに入れた場合は下図のようになります）。
カードを操作するスクリプト
[Assets/Scripts]フォルダを選択して右クリックし、[Create]→[Scripting]→[MonoBehaviour Script]をクリックします。スクリプトファイルの名前を「CardController」とします。
CardController.cs
カード画像、威力、コスト、カードが使用済みかどうかをまず宣言します。
そしてカードの内容を表示するShowInfoメソッドを追加します。引数にはカードのIDとカードを使用するキャラクターの情報（UnitStatus）を渡します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
using TMPro; using UnityEngine; using UnityEngine.UI; public class CardController : MonoBehaviour { public Image cardIcon;// カードの画像 public TextMeshProUGUI powerText;// カードの威力 public TextMeshProUGUI costText;// カードのコスト public bool IsUsed = false;// カードが使用済みかどうか // カードの内容を表示する public void ShowInfo(string id, UnitStatus unitStatus) { if (IsUsed) { gameObject.SetActive(false);// 使用済みなら非表示にする return; } gameObject.SetActive(true);// 未使用なら表示する cardIcon.sprite = GameManager.Instance.CardData.GetSprite(id);// カードの画像を表示 // カードのIDに合わせて威力を表示する switch (id) { case "Attack":// 「攻撃」カードは攻撃力を表示 powerText.text = unitStatus.GetAttack().ToString(); break; case "Guard":// 「防御」カードは防御力を表示 powerText.text = unitStatus.GetDefense().ToString(); break; case "Recovery":// 「回復」カードは回復力を表示 powerText.text = unitStatus.GetRecovery().ToString(); break; } costText.text = GameManager.Instance.CardData.GetCost(id).ToString();// カードのコストを表示 } } |
威力の表示はswitch 文でカードIDごとに分岐しており、「攻撃」なら攻撃力、「防御」なら防御力、「回復」なら回復量と、カードの種類に合った数値がカードの効果量部分に表示されます。
IsUsed フラグが true のカードはオブジェクトごと非表示にすることで、使用済みカードを手札から見えなくする仕組みも備えています。
画像やコストの取得は GameManager のカードデータに一元管理されており、このクラス自身はあくまで「表示に専念する」ようにしています。
少し難しい言葉になるかもしれませんがプログラムの”責務”を分離する設計になっています（計算部分はUnitStatus.csに任せて得られたデータをカードに表示することに専念しています）。
CardControllerスクリプトをアタッチする
Hierarchyビューにある[Canvas]→[Button1]オブジェクトを選択してInspectorビューを表示します。
一番下にある[Add Component]をクリックし、検索バーにCardControllerと入力します。表示される一覧の中に「Card Controller」が表示されるのでクリックしてアタッチします。
カードのUIをスクリプトにアタッチする
Button1オブジェクトのInspectorビューに[cardIcon]、[powerText]、[costText]が表示されるので、Button1オブジェクトのUIをそれぞれアタッチします。
カードをプレハブにする
Button1オブジェクトは再利用できるようにプレハブにしておきます。
まずはHierarchyビューにあるButton1オブジェクトを右クリックし、[Rename]をクリックします。名前を編集できるようになるので名前を[Card]に変更します。
次にCardオブジェクトをプロジェクトウィンドウの[Assets/Prefabs]フォルダにドラッグアンドドロップしてプレハブにします。
カードUIを並べる
コマンドUIを全部カードUIに置き換えます。まずはHierarchyビューにある既存のコマンドUIである[Canvas]→[Button2]と[Canvas]→[Button3]を右クリックし、[Delete]をクリックして削除します。
まとめ
今回はコマンドUIをカードUIに刷新し、デッキから手札を配布する仕組みを実装しました。
カードにはSPコストが設定されており、タッチすると対応するスキルが発動してSPが消費されます。
また「ターン終了」ボタンを追加することで、プレイヤーが好きなタイミングでターンを終えられるようになりました。
これにより固定3ボタンのコマンドバトルから、手札管理とリソース消費を伴うカードバトルシステムへの移行が完成しています。
次回はゲームシステムを拡張するため、レリック・状態異常・イベントの3種類のマスターデータを作成します。それぞれScriptableObjectでデータベース化し、GameManagerから一元管理できる仕組みを整えます。
次の記事：
現場レベルのゲーム制作が、すべてここで学べます。
コメント