２Ｄタワーディフェンス　発展１５

　以下の内容で実装を進めていきます。

発展１５　ークリアポイント機能の実装ー

２１．Canvas_Overlay ゲームオブジェクトを作成し、ポストプロセッシングの影響を受けない UI 用のゲームオブジェクト群を配置する
２２．キャラ契約用のクリアポイントを追加し、ステージ選択シーンに表示する機能と、バトルクリア時に加算する機能を実装する

　新しい学習内容は、以下の通りです。

　・複数の Canvas ゲームオブジェクトの使い分け方

２１．Canvas_Overlay ゲームオブジェクトを作成し、ポストプロセッシングの影響を受けない UI 用のゲームオブジェクト群を配置する

１．設計

　ステージ選択シーンにて実装する内容の設計を行います。

　現在、ステージ選択シーンのヒエラルキーには Canvas_Camera(WorldMap) ゲームオブジェクトがあります。
こちらはポストプロセッシングの影響を受けられるように、Canvas コンポーネントの Render Mode を Camera にしています。
そのため、常に最前面に表示されるという方式ではなく、あくまでもカメラを通じて UI 以外のゲームオブジェクトと同様にカメラが UI のゲームオブジェクトを描画しています。

　今回は今までも利用していた常に最前面にカメラの影響下なく表示する UI のゲームオブジェクト群を作成して配置を行いたいため、
新しく Canvas ゲームオブジェクトを作成し、そちらの RenderMode は Overlay にすることで、カメラを利用せずに、常にゲーム画面の最前面に表示されるゲームオブジェクトとして UI を作成していきます。

　今回は次の実装に向けて、大きく分けて２つの機能の UI を作成します。

　１つは、キャラを契約するためのクリアポイントを表示するゲームオブジェクト群です。
クリアポイントとは、バトルをクリアした際に褒賞として獲得できるボーナスポイントです。バトルをクリアするたびに加算されますので、
溜まったクリアポイントを消費して、ユーザーが任意の味方キャラと契約することが出来ます。
　今後は、この契約したキャラのみをバトルで利用できるようにする機能を実装しますので、その際に使います。

　もう１つは、このキャラを契約するためのポップアップを開くためのボタンのゲームオブジェクト群です。
ステージ選択シーンにてこのボタンを押すことで、ユーザーはいつでも味方キャラを契約することができる設計にします。

　参考用の画像を掲載しておきます。機能的に問題がなければ、この通りでなくて構いません。自由に作成してみてください。

＜必要な UI①＞

　・クリアポイント(キャラ契約用のポイント)を表示するための Text コンポーネントがアタッチされているゲームオブジェクト
　・上記のポイントのラベル表示(常に TotalClearPoint: と表示)するための Text コンポーネントがアタッチされているゲームオブジェクト
　・上記２つのゲームオブジェクトの背景用の画像を表示するための Image コンポーネントがアタッチされているゲームオブジェクト
　・(必要であれば)これら３つを管理するためのフォルダ役のゲームオブジェクト
　　　　　(製作していく順番としては、下のゲームオブジェクトから作っていくといいでしょう。フォルダ => 背景画像 => ラベル => クリアポイント表示)

＜必要な UI②＞

　・キャラを契約するためのポップアップを開くための Image コンポーネントと Button コンポーネントがアタッチされているゲームオブジェクト
　　　　　(子オブジェクトの Text コンポーネントがアタッチされているゲームオブジェクトは不要)
　・上記のボタンのラベル表示(常に Engage のように表示)するための Text コンポーネントがアタッチされているゲームオブジェクト
　・(必要であれば)これら２つを管理するためのフォルダ役のゲームオブジェクト
　　　　　(製作していく順番としては、下のゲームオブジェクトから作っていくといいでしょう。フォルダ => ラベル => ボタンとボタンの画像)

＜完成時のヒエラルキー画像＞

＜Scene ビュー画像＞

＜Game ビュー画像＞

２．Canvas_Overlay ゲームオブジェクトを作成し、設定を行う

　ヒエラルキーの空いている場所で右クリックをしてメニューを開き、UI => Canvas を選択し、新しい Canvas ゲームオブジェクトを作成します。
名前を Canvas_Overlay に変更し、RenderMode が異なることが判別できるようにしておきます。

　通常の UI 用のゲームオブジェクトは、すべてのこの Canvas_Overlay ゲームオブジェクトの子オブジェクトとして作成します。

インスペクター画像

　Canvas コンポーネントの設定は不要です。
この部分が Canvas_Camera(WorldMap) ゲームオブジェクトとの一番の違いになりますので、初期設定である Screen Space - Overlay のままにしておいてください。

　CanvasScaler コンポーネントの設定を修正し、Game ビューの解像度と合わせてください。
こちらは逆に、すでに作成済の Canvas_Camera(WorldMap) ゲームオブジェクトの CanvasScaler コンポーネントの設定と同じで構いませんので、そちらを参考にするとよいでしょう。

Scene ビュー画像とヒエラルキー画像

２２．キャラ契約用のクリアポイントを追加し、ステージ選択シーンに表示する機能と、バトルクリア時に加算する機能を実装する

１．設計

　クリアポイントをゲーム内に実装し、運用するための準備を行います。

　クリアポイントの仕様とサイクルとしては次のようなものに検討しています。
クリアポイントという名称は自由に変更してください。

＜クリアポイントと契約によるサイクル＞

　１．GameData クラスで int 型の totalClearPoint 変数としてクリアポイントの管理を行う。色々なクラスからアクセスしやすいため
　　　合わせて、契約した味方キャラの情報を管理するための engageCharaNosList 変数も追加しておく

　２．ゲーム開始時の  totalClearPoint 変数の値は 0

　３，バトルシーンをクリアすると、クリアの褒賞として、各 StageData クラスに登録されている clearPoint 変数の値分を  totalClearPoint 変数に加算する

　４．ステージ選択シーンには味方キャラと契約するためのボタンがあり、それを押すと契約用ポップアップが開く
　　　味方キャラのデータ(CharaData クラス)に契約料として engagePoint 変数を新しく設定し、これがキャラと契約する際に必要なクリアポイントになる

　５．totalClearPoint 変数の値を engagePoint 変数の値分だけ減算することにより、その味方キャラと契約することができる
　　　このタイミングで GameData クラスの engageCharaNosList 変数に情報が登録されて、ユーザーがどのキャラと契約済かを管理することができる状態にする

　６．【３】～【５】を繰り返してサイクルとする。契約できる味方キャラを増やしていくことで、配置できる味方キャラが増えてゲームの戦略性が高まる

　この設計をしっかりと念頭に置きまして、実装のための設計を具体的に考えてみてください。

　サイクルとして一連の処理の流れがイメージできているか、できていないかにより、ロジックを組む際の難易度や条件が変わります。
なるべく時間をかけて精査を行い、スムースな処理の流れを考えて設計を作っていきましょう。

　この部分がしっかりしているほど、新しく必要になるスクリプトや、すでにあるスクリプトへの修正箇所が明確になります。

２．GameData スクリプトを修正し、クリアポイントや、契約したキャラを登録するための変数などを追加する

GameData.cs

<= クリックすると開きます

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class GameData : MonoBehaviour
{
    public static GameData instance;

    [Header("コスト用の通貨")]
    public int currency;

    [Header("カレンシーの最大値")]
    public int maxCurrency;

    [Header("加算までの待機時間")]
    public int currencyIntervalTime;

    [Header("加算値")]
    public int addCurrencyPoint;

    public int maxCharaPlacementCount;　　 // 配置できるキャラの上限数

    [Header("デバッグモードの切り替え")]
    public bool isDebug;　　　　　　　　　// true の場合、デバッグモードとする

    public int defenseBaseDurability; 

    public int stageNo;


////*  変数の宣言を３つ追加  *////


    public int totalClearPoint;　　　　　　　　　　　　　　　　　　// バトルクリア時にもらえるポイント。消費してキャラと契約できる

    [Header("契約して所持しているキャラの番号")]
    public List<int> engageCharaNosList = new List<int>();

    [Header("表示するステージの番号")]
    public List<int> clearedStageNosList = new List<int>();


////*  ここまで  *////


    void Awake() {
        if (instance == null) {
            instance = this;
            DontDestroyOnLoad(gameObject);
        } else {
            Destroy(gameObject);
        }
    }
}

　スクリプトを修正したらセーブを行います。

　GameData ゲームオブジェクトを確認し、どのような情報が増えているかを確認しておきましょう。

インスペクター画像

３．StageSelectManager スクリプトを修正して、ゲーム画面に契約用のポイントの表示・更新を行う機能の実装に挑戦する

　ゲーム画面に契約用のポイントを表示するゲームオブジェクトは作成済ですので、次は、このクリアポイントの表示用ゲームオブジェクトに
GameData クラスに先ほど追加した totalClearPoint 変数を表示し、更新するための処理の実装に挑戦してみてください。

　この totalClearPoint 変数の値はキャラと契約すると、その時点で消費されます。
そのため、画面に一度クリアポイントを表示するだけではなくて、値に変更があった場合には更新を行えるように機能を設計する必要があります。

４．ゲームを実行して動作を確認する

　ゲーム開始前に、GameData ゲームオブジェクトの totalClearPoint 変数の値を 0 以外の値に設定しておきます。

　ステージ選択シーンからゲームを開始してください。
ゲーム画面に表示されている totalClearPoint 変数を表示する部分が totalClearPoint 変数の値が反映されて表示されれば制御成功です。　

＜実装動画＞

動画ファイルへのリンク

　それでは次に、totalClearPoint 変数をゲーム内で加算する処理を実装します。

５．GameManager を修正する

　この手順の最後として、バトルをクリアした報酬として、totalClearPoint 変数を加算する処理を実装します。
それ以外の TODO 部分の処理についても一緒に実装していますので、まだ未実装の部分があれば参考にしてください。

　もしも TODO 部分の処理が未実装である場合、その部分はコメントアウトしてください。
ただし、コルーチンメソッド内で yield return の処理が１つも記述されていないとエラーが表示されます。
その場合、一度、戻り値を void にするか、コルーチンメソッド内に yield return null; の命令文を追加することで回避出来ます。

　今回の実装で GameManager クラスは完成です。
最初から読み直してみて、処理が読み解けない場所がないかを確認しておきましょう。

　なお、すでに自分で考えて実装が済んでいる処理については、修正を行う必要はありません。
その場合には復習の教材として、このような記述の方法もあるという形で利用してください。

GameManager.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class GameManager : MonoBehaviour
{
    [SerializeField]
    private EnemyGenerator enemyGenerator;

    [SerializeField]
    private CharaGenerator charaGenerator;

    public bool isEnemyGenerate;

    public int generateIntervalTime;

    public int generateEnemyCount;

    public int maxEnemyCount;

    /// <summary>
    /// ゲームの状態
    /// </summary>
    public enum GameState {
        Preparate,       // ゲーム開始前の準備中
        Play,            // ゲームプレイ中
        Stop,            // ゲーム内の処理の一時停止中
        GameUp           // ゲーム終了(ゲームオーバー、クリア両方)
    }

    public GameState currentGameState;    // 現在の GameState の状態。上記の GameState の列挙子が１つだけ代入されるので、他の GameState と競合しない

    [SerializeField]
    private List<EnemyController> enemiesList = new List<EnemyController>();　　　//　敵の情報を一元化して管理するための変数。EnemyController 型で扱う

    private int destroyEnemyCount;                //  敵を破壊した数のカウント用

    public UIManager uiManager;

    [SerializeField]
    private List<CharaController> charasList = new List<CharaController>();　　　 // 配置したキャラの情報を一元化して管理するための変数。CharaController 型で扱う

    [SerializeField]
    private DefenseBase defenseBase;          // 生成した防衛拠点の情報を代入するための変数

    [SerializeField]　　　　　　　　　　　　　// デバッグのために SerializeField 属性を利用してインスペクターで確認できるようにしている
    private MapInfo currentMapInfo;　　　　　 // 生成したステージのゲームオブジェクト(MapInfo クラスのアタッチされている MainMap ゲームオブジェクト)を代入するための変数

    [SerializeField]
    private DefenseBase defenseBasePrefab;　　// 防衛拠点のプレファブをアサインするための変数

    [SerializeField]
    private StageData currentStageData;


////*  Start メソッドの戻り値を変更(☆①)、Start メソッド内の TODO ２箇所(☆②～③)を実装  *////


    IEnumerator Start() {　　//　<=　☆①　戻り値を void から IEnumerator に変更

        // ゲームの進行状態を準備中に設定
        SetGameState(GameState.Preparate);


////*  ☆②　ここから TODO を実装①  *////


        // ゲームデータを初期化
        RefreshGameData()


////*  ここまで  *////


        // ステージの設定 + ステージごとの PathData を設定
        SetUpStageData();

        // キャラ配置用ポップアップの生成と設定
        StartCoroutine(charaGenerator.SetUpCharaGenerator(this));

        // 拠点の設定
        defenseBase.SetUpDefenseBase(this, currentStageData.defenseBaseDurability, uiManager);


////*  ☆③　ここから TODO を実装②  *////


        // オープニング演出再生(自分で用意しているメソッドがあればそちらを使いましょう)
        //yield return StartCoroutine(uiManager.Opening());


////*  ここまで  *////


        isEnemyGenerate = true;

        // ゲームの進行状態をプレイ中に変更
        SetGameState(GameState.Play);

        // 敵の生成準備開始
        StartCoroutine(enemyGenerator.PreparateEnemyGenerate(this, currentStageData));

        // カレンシーの自動獲得処理の開始
        StartCoroutine(TimeToCurrency());
   }

    /// <summary>
    /// 敵の情報を List に追加
    /// </summary>
    /// <param name="enemy"></param>
    public void AddEnemyList(EnemyController enemy) {

        enemiesList.Add(enemy);

　　　　// 敵の生成数をカウントアップ
        generateEnemyCount++;
    }

    /// <summary>
    /// 敵の生成を停止するか判定
    /// </summary>
    public void JudgeGenerateEnemysEnd() {
        if (generateEnemyCount >= maxEnemyCount) {
            isEnemyGenerate = false;
        }
    }

    /// <summary>
    /// GameState の変更
    /// </summary>
    /// <param name="nextGameState"></param>
    public void SetGameState(GameState nextGameState) {
        currentGameState = nextGameState;
    }

    /// <summary>
    /// すべての敵の移動を一時停止
    /// </summary>
    public void PauseEnemies() {
        for (int i = 0; i < enemiesList.Count; i++) {
            enemiesList[i].PauseMove();
        }
    }

    /// <summary>
    /// すべての敵の移動を再開
    /// </summary>
    public void ResumeEnemies() {
        for (int i = 0; i < enemiesList.Count; i++) {
            enemiesList[i].ResumeMove();
        }
    }

    /// <summary>
    /// 敵の情報を List から削除
    /// </summary>
    /// <param name="removeEnemy"></param>
    public void RemoveEnemyList(EnemyController removeEnemy) {
        enemiesList.Remove(removeEnemy);
    }

    /// <summary>
    /// 破壊した敵の数をカウント(このメソッドを外部のクラスから実行してもらう)
    /// </summary>
    public void CountUpDestoryEnemyCount(EnemyController enemyController) {

        // List から破壊された敵の情報を削除
        RemoveEnemyList(enemyController);

　　　　// 敵を破壊した数を加算
        destroyEnemyCount++;

        Debug.Log("破壊した敵の数 : " + destroyEnemyCount);

        // ゲームクリア判定
        JudgeGameClear();
    }


    /// <summary>
    /// ゲームクリア判定
    /// </summary>
    public void JudgeGameClear() {
        // 生成数を超えているか
        if (destroyEnemyCount >= maxEnemyCount) {

            Debug.Log("ゲームクリア");
           

////*　ここから TODO を実装  *////


            // ゲームクリアの処理を追加
            StartCoroutine(GameClearAndResult());


////*  ここまで  *////


        }
    }

    /// <summary>
    /// 時間の経過に応じてカレンシーを加算
    /// </summary>
    /// <returns></returns>
    public IEnumerator TimeToCurrency() {

        int timer = 0;

        // ゲームプレイ中のみ加算
        while (currentGameState == GameState.Play) {
            timer++;

            // 規定の時間が経過し、カレンシーが最大値でなければ
            if (timer > GameData.instance.currencyIntervalTime && GameData.instance.currency < GameData.instance.maxCurrency) {
                timer = 0;

                // 最大値以下になるようにカレンシーを加算
                GameData.instance.currency = Mathf.Clamp(GameData.instance.currency += GameData.instance.addCurrencyPoint, 0, GameData.instance.maxCurrency);

　　　　　　　　// カレンシーの画面表示を更新
                uiManager.UpdateDisplayCurrency();
            }

            yield return null;
        }
    }

    /// <summary>
    /// 選択したキャラの情報を List に追加
    /// </summary>
    public void AddCharasList(CharaController chara) {
        charasList.Add(chara);
    }

    /// <summary>
    /// 選択したキャラを破棄し、情報を List から削除
    /// </summary>
    /// <param name="chara"></param>
    public void RemoveCharasList(CharaController chara) {
        Destroy(chara.gameObject);
        charasList.Remove(chara);
    }

    /// <summary>
    /// 現在の配置しているキャラの数の取得
    /// </summary>
    /// <returns></returns>
    public int GetPlacementCharaCount() {
        return charasList.Count;
    }

    /// <summary>
    /// 配置解除を選択するポップアップ作成の準備(CharaController から呼び出される)
    /// </summary>
    /// <param name="chara"></param>
    public void PreparateCreateReturnCharaPopUp(CharaController chara) {

        // ゲームの進行状態をゲーム停止に変更
        SetGameState(GameState.Stop);

        // すべての敵の移動を一時停止
        PauseEnemies();

        // 配置解除を選択するポップアップを作成
        uiManager.CreateReturnCharaPopUp(chara, this);
    }

    /// <summary>
    /// 選択したキャラの配置解除の確認(ReturnSelectCharaPopUp から呼び出される)
    /// </summary>
    /// <param name="isReturnChara"></param>
    /// <param name="chara"></param>
    public void JudgeReturnChara(bool isReturnChara, CharaController chara) {

        // キャラの配置を解除する場合
        if (isReturnChara) {

            // 選択したキャラを破棄し、情報を List から削除
            RemoveCharasList(chara);
        }

        //  ゲームの進行状態をプレイ中に変更して、ゲーム再開
        SetGameState(GameState.Play);

        // すべての敵の移動を再開
        ResumeEnemies();

        // カレンシーの加算処理を再開
        StartCoroutine(TimeToCurrency());
    }

    /// <summary>
    /// ステージデータの設定
    /// </summary>
    private void SetUpStageData() {

        // GameData の stageNo から StageData を取得
        currentStageData = DataBaseManager.instance.stageDataSO.stageDatasList[GameData.instance.stageNo];

        // 各情報を StageData クラスを参照して設定
        generateIntervalTime = currentStageData.generateIntervalTime;
        maxEnemyCount = currentStageData.mapInfo.appearEnemyInfos.Length;

        // ステージ用のマップと防衛拠点の生成
        currentMapInfo = Instantiate(currentStageData.mapInfo);
        defenseBase = Instantiate(defenseBasePrefab, currentMapInfo.GetDefenseBaseTran());

        // PathDatas の移動経路情報を StageData クラスを参照して設定
        PathData[] pathDatas = new PathData[currentStageData.mapInfo.appearEnemyInfos.Length];
        for (int i = 0; i < currentStageData.mapInfo.appearEnemyInfos.Length; i++) {
            pathDatas[i] = currentStageData.mapInfo.appearEnemyInfos[i].enemyPathData;
        }

        // 移動経路の情報を引数で渡して、EnemyGenerator クラスの設定を行う
        enemyGenerator.SetUpPathDatas(pathDatas);

　　　　// TODO 他にもあれば追加

    }


////*  ここからメソッドを４つ追加  *////


    /// <summary>
    /// ゲームクリアと報酬処理
    /// </summary>
    private IEnumerator GameClearAndResult() {

        // ゲーム終了
        GameUpToCommon();

        // TODO ゲームクリア演出(文字)
        //yield return StartCoroutine(uiManager.CreateGameClearSet());

        // TODO ロゴで演出
        //yield return StartCoroutine(uiManager.GameClear());

        // クリアボーナスの獲得
        GameData.instance.totalClearPoint += currentStageData.clearPoint;

　　　　// 次のステージの番号を設定
        GameData.instance.stageNo++;   //  <=　この部分は、currentStageData.stageNo ++ でも構いません。その場合、下の条件式を修正してください。

        // 次のステージが未クリアである場合
        if (!GameData.instance.clearedStageNosList.Contains(GameData.instance.stageNo)) {

            // 次のステージを登録してステージシーンで表示できるようにする(=> すでに List に登録してある場合には重複して登録しない)
            GameData.instance.clearedStageNosList.Add(GameData.instance.stageNo);
        }

        // シーン遷移
        SceneStateManager.instance.PreparateNextScene(SceneType.Main);
    }

    /// <summary>
    /// ゲーム終了時の共通処理
    /// </summary>
    private void GameUpToCommon() {

        // ゲームの進行状態をゲーム終了に変更
        SetGameState(GameState.GameUp);

        // キャラ配置用のポップアップが開いている場合には破棄
        charaGenerator.InactivatePlacementCharaSelectPopUp();

        // TODO ゲーム終了時に、ゲームクリアとゲームオーバーの共通する処理を追加

    }

    /// <summary>
    /// ゲームオーバー処理
    /// </summary>
    public IEnumerator GameOver() {

        // ゲーム終了処理
        GameUpToCommon();

        // TODO ゲームオーバー表示
        //uiManager.CreateGameOverSet();

        // TODO ゲームオーバー時の処理を追加

        yield return new WaitForSeconds(3.0f);

        // シーン遷移
        SceneStateManager.instance.PreparateNextScene(SceneType.Main);
    }

    /// <summary>
    /// ゲームデータを初期化
    /// </summary>
    private void RefreshGameData() {

        // TODO デバッグ用の処理やバトル開始時に初期化したい処理を記述する

    }


////*  ここまで  *////


}

　スクリプトを修正したらセーブをします。

６．StageDataSO スクリプタブル・オブジェクトの設定を確認する

　Datas フォルダ内にある StageDataSO スクリプタブル・オブジェクトを選択して、各ステージのデータに ClearPoint 変数の値が設定されているかを確認します。
ステージをクリアすると、この値が GameData クラスの totalClearPoint 変数に加算されます。0 のままだと加算処理が実行されたかわかりませんので、念のため、調べておいてください。
　
　ClearPoint 変数の値自体は後でバランス調整を行いますので、まずは 0 以外の数値になっていれば問題ありません。

インスペクター画像

７．ゲームを実行して動作する

　ゲームを開始して、バトルをクリアしてください。
クリアしたステージのデータに設定されている ClearPoint 変数の値が GameData クラスの totalClearPoint 変数に加算されれば制御成功です。

　バトル後、ステージ選択シーンに戻った際にも、現在の GameData クラスの totalClearPoint 変数に表示が更新されれば制御成功です。

　どちらも問題ないかを確認しておいてください。

　以上でこの手順は終了です。

　次は　発展１６　ー契約時のエフェクト機能の実装－　です。

このページを編集するこのページを元に新規ページを作成

印刷する

コメント（0）

２Ｄタワーディフェンス　発展１５ - i-school 先頭へ

コメントをかく

名前	ユーザIDを使用しないで書き込む	ユーザーIDを使う	ログインする
画像コード	画像に記載されている文字を下のフォームに入力してください。
備考	「http://」を含む投稿は禁止されています。
本文
利用規約をご確認のうえご記入下さい

i-school