現場レベルのゲーム制作が、すべてここで学べます。
この記事はSlay the Spire風デッキ構築系ローグライト要素を持つオリジナルJRPGを作る講座の第6回です。前作講座のノンフィールドRPG講座で一度完成させたゲームをアップデートしていくので実際のゲーム制作に近い開発体験が可能です。
前回はダンジョンシーンのUIを変更し、直進するだけの移動から左右選択型のUIに変更しました。プログラムの変更はまだです。
前回の記事：
第6回では引き続きUIの変更を行っていきます。ダンジョンの移動で発生するカード取得イベントのUIを作成します。その後、実際にカードを取得する処理を作成します。
（バトル勝利orカード取得イベント発生）
→ 報酬カードが3枚表示される
→ プレイヤーがカードを1枚タッチして選択
→ 選択マークと説明文が表示される
→ 決定ボタンをタッチ
→ 選んだカードがデッキに追加される
↑この章ではこのようなカード取得処理の流れを作っていきます。
カード取得イベント用UIの作成
カード取得イベントで表示するUIを作成します。
Hierarchyビューで右クリックし、[UI(Canvas)]→[Canvas]をクリックします。
新しく作成された[Canvas]オブジェクトの名前を[RewardCard]に変更し、Inspectorビューを開いて下の画像のように変更します。
Sort Orderを1にしたので0のUIより手前に表示されます。カード報酬イベントは他UIよりも手前に表示されます。
背景（モーダル）の追加
次に[RewardCard]オブジェクトを右クリックして、[UI(Canvas)]→[Image]をクリックします。
新しく作成された[Image]オブジェクトの名前を[Modal]に変更し、Inspectorビューを開いて下の画像のように変更します。
カード取得イベントではまずこの背景Imageオブジェクトでゲーム画面を一度全て覆い隠します。
カード選択マークの追加
[Modal]オブジェクトを右クリックして、[UI(Canvas)]→[Image]をクリックします。
新しく作成された[Image]オブジェクトの名前を[Select1]に変更し、Inspectorビューを開いて下の画像のように変更します。
コピーができるので、同じ要領でもう1つコピーを作ります。
コピーした2つのオブジェクトのInspectorビューを表示して、下の画像のとおり変更します。
報酬カードを設定
次にProjectウィンドウの[Assets/Prefabs/Card]をHierarchyビューの[RewardCard]→[Modal]に3回ドラッグアンドドロップします。
まとめ
今回はカード取得UIを作成し、それぞれのUIの選択時処理を作成しました。
その後、後の章のイベントや戦闘後のカード報酬獲得処理に使うためのUIとしてプレハブにしました。
次回はイベント・カード・レリックの情報を表示する汎用ポップアップUIを作成してC#スクリプトで制御する仕組みを実装します
次の記事：
現場レベルのゲーム制作が、すべてここで学べます。
コメント