２Ｄタップシューティングゲーム　拡張４

　前回に引き続き、キャラモデルの演出を追加します。
この手順ではキャラモデルの各アクションに対してのアニメーションの制御を実装します。

＜実装動画　バレット生成(攻撃)時＞

動画ファイルへのリンク

＜実装動画　被ダメージ時＞

動画ファイルへのリンク

＜実装動画　ゲームオーバー時＞

動画ファイルへのリンク

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

拡張４　－キャラモデルのアニメーションの追加－

　７．キャラモデルのアニメーションを設定する
　８．キャラモデルのアニメーションを管理するスクリプトを作成し、アニメーションが遷移する処理を呼び出したいスクリプト内に適宜な部分に追加する

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

　・Any State を利用したステートの遷移処理の実装例
　・Animator.ResetTrigger メソッド

７．キャラモデルのアニメーションを設定する

１．設計

　各アクションに対しての制御は Animator の機能を利用し、Animator のパラメータを利用して制御を行っています。

　アニメーションの遷移処理はスクリプトを通じて制御することができますが、そのためには事前に、Animator ビューにおいて、
アニメーションのステートを登録し、パラメータを作成して、各ステート間の遷移条件を設定しなければなりません。

　ステート間の遷移については Any State を利用します。この機能を利用することで煩雑になりがちなステート間の遷移処理を簡潔にまとめることが可能です。

２．Animator ビューにてアニメーションの設定を行う

　Little_Cat_Girl ゲームオブジェクトの子オブジェクトである Little_Cat_GirlRig ゲームオブジェクトを確認してください。
Animator コンポーネントがアタッチされていると思います。

　Animator コンポーネントの Controller プロパティ欄にはデフォルト情報として、Little_Cat_GirlRig コントローラーがアサインされてますので、
こちらのコントローラーを編集して設定を行います。この情報が Animator ビューに表示されます。

Little_Cat_GirlRig ゲームオブジェクト　インスペクター画像

　Animator ビュータブを押して Animatorビューを表示してください。
Animatorビュータブがない場合には、Unity Editor の左上のメニューより、Window => Animation => Animator で表示することが出来ます。

　ヒエラルキーの Little_Cat_GirlRig ゲームオブジェクトを選択することで、Animatorビューにコントローラーの情報が表示されます。
最初からすべての AnimationClip がステートとして登録されていますので、下記の画像のようにトランジションを設定してください。
この画像にないステートは今回は利用しませんので、削除してもいいですし、Animator ビューの端側にまとめておいても構いません。

Animator ビューの設定

　
　Entry のトランジションを Idle になるようにして、他のトランジションへの遷移を止めておきます。
また、AnyState を活用しますので、AnyState を起点として各ステートへの遷移を作成してください。

　AnyState では、現在のステートがどこであるかは問わず、新しい遷移の条件が実行された時点で AnyState から遷移が実行されます。
そのため、各ステート間を逐一トランジションでつなぐ必要が亡くなります。

　つづいてパラメータを作成します。Trigger 型の attack と hit、bool 型の down の３つを用意してください。
各パラメータの右側にあるアイコンの形でパラメータの型を判断できます。(○は Trigger型、□は Bool 型です。)

パラメータ画像

　パラメータを作成したら、トランジションにパラメータを設定してスクリプトから制御を行えるようにします。

　各ステートに対して、トランジションと遷移条件を設定します。
各設定については、下記のインスペクター画像をまとめておきますので参考にしてください。

AnyState => attack

インスペクター画像

attack => Exit

AnyState => get_hit

インスペクター画像

get_hit => Exit

AnyState => die

インスペクター画像

die => Exit

　以上で設定は完了です。どのトランジションがどの条件で遷移するかを確認しておいてください。

８．キャラモデルのアニメーションを管理するスクリプトを作成し、アニメーションが遷移する処理を呼び出したいスクリプト内に適宜な部分に追加する

１．設計

　どのスクリプトにどのような処理を追加すればよいか、ロジックを含めて考えてみましょう。
処理のゴール地点とスタート地点、繋がりをどのように構築すればよいか、など、今までの処理の実装例を思い出してみてください。

２．CharaAnimationController スクリプトを作成する

　Animator コンポーネントを利用して、Animator ビューにて設定を行ったステート間の遷移を実装します。
ロジックとしては、ステート単位で実行用のメソッドを用意せずに、Animator の実行命令を記述したメソッドを用意しておいて、
引数で受け取った情報を利用して汎用的に遷移が行える設計にしています。

　例えば、attack のパラメータの情報を引数で受け取った場合には attack のアニメーションを再生し、
hit のパラメータの情報を引数で受け取った場合には、同じメソッドではありますが、今度は hit のアニメーションを再生するような設計になっています。

　今回のケースでは、パラメータの情報については、static 修飾子付きの string 変数で宣言して値としてパラメータの文字列を代入しておくことで、
外部のスクリプトで引数としてパラメータの値を指定する際に、その都度文字列を入力するのではなく、これらの変数を利用します。

　文字列を直接スクリプト内に入力するとエラーを生みやすいので、可能であれば出来るだけ、enum や、string 型の変数を利用して値を代入しておくことで問題を未然に回避出来ます。
特に文字列はコンパイル時のエラーにひっかからないため、見つけにくいという問題もあります。(変数は書き間違えるとエラーが出ますが、文字列は出ません。)

　なるべく問題が発生しにくい処理の設計や記述を心がけることで、処理全体も見やすくなりますし、記述の精度が上がります。

CharaAnimationController.cs

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

using UnityEngine;

public class CharaAnimationController : MonoBehaviour
{
    [SerializeField]
    private Animator animPlayer;

    public static string attackParameter = "attack";
    public static string downParameter = "down";
    public static string hitParameter = "hit";

    /// <summary>
    /// アニメーションの制御
    /// </summary>
    /// <param name="playAnimationParameter"></param>
    public void PlayAnimation(string playAnimationParameter) {

        if (playAnimationParameter == downParameter) {
            animPlayer.ResetTrigger(attackParameter);
            animPlayer.ResetTrigger(hitParameter);
            animPlayer.SetBool(downParameter, true);
        } else {
            animPlayer.ResetTrigger(attackParameter);
            animPlayer.SetTrigger(playAnimationParameter);
        }
    }
}

　スクリプトを作成したらセーブします。

３．＜Animator.ResetTrigger メソッド＞

　引数に指定した Trigger 型のパラメータで実行されているステートの処理をリセットして停止するメソッドです。

  animPlayer.ResetTrigger(attackParameter);
  animPlayer.SetTrigger(playAnimationParameter);

　今回のケースでは、attackParameter 変数内で指定している文字列("attack")の情報で動いている Trigger 型のステートを停止します。
そのため、Trigger 型の attack のパラメータを利用して制御されている attack ステートの処理が停止されます。

　そののちに、SetTrigger メソッドで新しいアニメーションが実行されるようになっています。

参考サイト

Unity公式スクリプトリファレンス
Animator.ResetTrigger
https://docs.unity3d.com/ja/current/ScriptReferenc...

４．Little_Cat_Girl ゲームオブジェクトに CharaAnimationController スクリプトをアタッチして設定を行う

　ヒエラルキーにある Little_Cat_Girl ゲームオブジェクトに、作成した CharaAnimationController スクリプトをドラッグアンドドロップしてアタッチしてください。
インスペクターを確認してアタッチが正常に行われているかをチェックした上で、animPlayer 変数に必要な情報をアサインします。

　スクリプトより操作を行いたい Animator コンポーネントをアサインすることになりますので、Little_Cat_GirlRig ゲームオブジェクトをドラッグアンドドロップしてアサインしてください。
自動的に、Animator コンポーネントの情報がアサインされます。これでこのコンポーネントを操作する準備が整いました。

Little_Cat_Girl ゲームオブジェクト　インスペクター画像

　以上で設定は完了です。

５．PlayerController スクリプトを修正する

PlayerController.cs

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

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

public class PlayerController : MonoBehaviour
{
    [SerializeField]
    private Bullet bulletPrefab;　　　     // Bullet ゲームオブジェクトの Bullet スクリプトの情報を登録するための変数。今までと同じプレファブをインスペクターよりアサインして登録する


////*  ここから変数を追加  *////


    [SerializeField]
    private CharaAnimationController charaAnim;　　// CharaAnimationController の情報を登録するための変数。インスペクターよりアサインして登録する


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


    private GameManager gameManager;


    void Update() {

        // ゲーム終了の状態になっているなら
        if (gameManager.isGameUp) {　　// ! が先頭についていないので、gameManager.isGameUp == true と同じ条件式

            // ここで処理を終了する　=>　画面のタップの処理が動作しなくなる
            return;
        }

        // 準備が整ってないなら
        if (!gameManager.isSetUpEnd) {
            return;
        }

        // マウスの左クリックをしたら
        if (Input.GetMouseButtonDown(0)) {

            // 画面をタップ(クリック)した位置をカメラのスクリーン座標の情報を通じてワールド座標に変換
            Vector3 tapPos = Camera.main.ScreenToWorldPoint(Input.mousePosition);



////*  ここから修正　①～③をコメントアウトし、最後に１行にまとめている  *////


            // ①方向を計算
            //Vector3 direction = tapPos - transform.position;

            // ②方向の情報から、不要な Z成分(Z軸情報) の除去を行う
            //direction = Vector3.Scale(direction, new Vector3(1, 1, 0));

            // ③正規化処理を行い、単位ベクトルとする(方向の情報は持ちつつ、距離による速度差をなくして一定値にする)
            //direction = direction.normalized;


            // 向きの生成(Z成分の除去と正規化)　①～③を１行にまとめる
            Vector3 direction = Vector3.Scale(tapPos - transform.position, new Vector3(1, 1, 0)).normalized;　　　//　<=　追加


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


            // バレット生成の準備
            PreparateGenerateBullet(direction);


////*  ここから追加  *////


            // 攻撃アニメ再生
            charaAnim.PlayAnimation(CharaAnimationController.attackParameter);


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


        }    
    }

    /// <summary>
    /// バレット生成の準備
    /// </summary>
    /// <param name="direction"></param>
    private void PreparateGenerateBullet(Vector3 direction) {

        // 現在使用しているバレットの情報を取得
        BulletDataSO.BulletData bulletData = GameData.instance.GetCurrentBulletData();

        // バレットの種類(BulletType) を元に決定
        switch (bulletData.bulletType) {

            // BulletType が Player_Normal の場合、あるいは
　　　　　　// BulletType が Player_Blaze の場合(処理が同じ場合には、このように記述できる)
            case BulletDataSO.BulletType.Player_Normal:
　　　　　　case BulletDataSO.BulletType.Player_Blaze:

                GenerateBullet(direction, bulletData);
                break;

            // BulletType が Player_3ways_Piercing の場合
            case BulletDataSO.BulletType.Player_3ways_Piercing:
                for (int i = -1;  i < 2; i++) {

                    // 3方向に扇状に発射する
                    GenerateBullet(new Vector3(direction.x + (0.5f * i), direction.y, direction.z), bulletData);
                }
                break;

            // BulletType が Player_5ways_Normal の場合
            case BulletDataSO.BulletType.Player_5ways_Normal:
                for (int i = -2; i < 3; i++) {
　　
　　　　　　　　　　// 5方向に扇状に発射する
                    GenerateBullet(new Vector3(direction.x + (0.25f * i), direction.y, direction.z), bulletData);
                }
                break;
        }
    }

    /// <summary>
    /// バレットの生成
    /// </summary>
    /// <param name="direction"></param>
    /// <param name="bulletData"></param>
    private void GenerateBullet(Vector3 direction, BulletDataSO.BulletData bulletData) {

        // Bullet スクリプトにてバレットを生成し、ShotBullet メソッドを実行する
        Instantiate(bulletPrefab, transform).ShotBullet(direction, bulletData);
    }

    /// <summary>
    /// PlayerControllerの設定
    /// </summary>
    /// <param name="gameManager"></param>
    public void SetUpPlayer(GameManager gameManager) {

　　　　// PlayerController スクリプトの gameManager 変数に、引数で届いた GameManager スクリプトの情報を代入
        this.gameManager = gameManager;
    }
}

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

　ヒエラルキーにある PlayerSet ゲームオブジェクトのインスペクターを確認してください。
新しく宣言した変数が表示されていますので、対象となるゲームオブジェクトをドラッグアンドドロップしてアサインしてください。

PlayerSet ゲームオブジェクト　インスペクター画像

　以上で設定は完了です。

６．DefenseBase スクリプトを修正する

DefenseBase.cs

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

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using DG.Tweening;

[RequireComponent(typeof(Rigidbody2D))]
public class DefenseBase : MonoBehaviour {

    [Header("拠点の耐久力")]
    public int durability;

    [SerializeField]
    private GameObject enemyAttackEffectPrefab;

    [SerializeField]
    private FloatingMessage floatingMessagePrefab;   // FloatingMessageObj プレファブ・ゲームオブジェクトをインスペクターよりアサインして登録する 

    [SerializeField, Header("フロート表示を行う位置情報")]
    private Transform floatingDamageTran;

    private int maxDurability;           // 耐久力の最大値を代入しておく

    private GameManager gameManager;     // GameManager スクリプトの情報を代入するための変数


    /// <summary>
    /// DefenseBaseの設定
    /// </summary>
　　public void SetUpDefenceBase(GameManager gameManager) {
    
        // 引数を利用して、GameManager スクリプトの情報を受け取って、用意しておいた変数に代入
        this.gameManager = gameManager;

        // GameData より 耐久力を取得
        durability = GameData.instance.GetDurability();

        // ゲーム開始時点の耐久力の値を最大値として代入
        maxDurability = durability;

　　　　// 耐久力の表示更新
　　　　gameManager.uiManager.DisplayDurability(durability, maxDurability);
    }

    private void OnTriggerEnter2D(Collider2D col) {

        if (col.gameObject.tag == "Enemy") {

            // ダメージの設定用
　　　　　　//int damage = 0;　　//　削除して、下の宣言に変更します

            // タプル型で変数を宣言。２つのオブジェクトの型を１つの変数内に用意できる。value は最終的なダメージ値。isWeakness は弱点であったかどうか。true ならば弱点判定
            (int value, bool isWeakness) damage = (0, false);

　　　　　　// 侵入してきたコライダーをオフにする(重複判定を防ぐため)
            col.GetComponent<CapsuleCollider2D>().enabled = false;
    
            // 侵入してきたコライダーのゲームオブジェクトに Bullet スクリプトがアタッチされていたら取得して bulet 変数に代入して、if 文の中の処理を行う
　　　　　　if (col.gameObject.TryGetComponent(out Bullet bullet)) {

                // 攻撃力を元にダメージを決定
                damage = JudgeDamageToElementType(bullet.bulletData.bulletPower, bullet.bulletData.elementType);

                Debug.Log("バレットの攻撃力 : " + bullet.bulletData.bulletPower);

            // 上の if 文が処理されず、侵入してきたコライダーのゲームオブジェクトに EnemyController スクリプトがアタッチされていたら取得して enemy 変数に代入して、if 文の中の処理を行う
            } else if (col.gameObject.TryGetComponent(out EnemyController enemy)) {

                // 攻撃力を元にダメージを決定
                damage = JudgeDamageToElementType(enemy.enemyData.power, enemy.enemyData.elementType);

                Debug.Log("エネミーの攻撃力 : " + enemy.enemyData.power);
            }

            // 耐久力の更新とゲームオーバーの確認
            UpdateDurability(damage.value);

　　　　　　// エネミーからのダメージ値用のフロート表示の生成
            CreateFloatingMessageToDamage(damage.value, damage.isWeakness);

            // エネミーの攻撃演出用のエフェクト生成
            GenerateEnemyAttackEffect(col.gameObject.transform);

            // 侵入したコライダーを持つゲームオブジェクト(バレット、あるいはエネミーのゲームオブジェクト)を破壊する
            Destroy(col.gameObject);
        }
　　}

    /// <summary>
    /// 耐久力の更新
    /// </summary>
    private void UpdateDurability(int damage) {

        // 耐久力の値をエネミーの damage 分だけ減算する(右辺の値を変更する)
        durability -= damage;

        // エネミーの攻撃力を反映しているか確認
        Debug.Log("エネミーからのダメージ : " + damage); 

　　　　// 耐久力の値を上限・下限値の範囲内に収まるか確認し、それを超えた場合には上限・下限値に置き換えて制限する
        durability = Mathf.Clamp(durability, 0, maxDurability);

　　　　// 耐久力の表示更新
　　　　gameManager.uiManager.DisplayDurability(durability, maxDurability);

        // 耐久力が 0 以下になっていないか確認し、かつ、すでに isGameUp 変数が true になっていないかも確認(すでに isGameUp 変数が true なら処理しない)
　　　　if (durability <= 0 && gameManager.isGameUp == false) {

            Debug.Log("Game Over");
                
            // 耐久力が 0 以下なら、ゲーム終了とする判定を行う。ここで isGameUp 変数が true に切り替わるので、上の if 文の条件を満たさなくなり、この分岐内は１回しか処理されなくなる
            gameManager.SwitchGameUp(true);

            // ゲームオーバーの準備
            gameManager.PreparateGameOver();


////*  ここから処理を追加  *////


            // ダウンアニメ再生
            charaAnim.PlayAnimation(CharaAnimationController.downParameter);
        }

        // ヒットアニメ再生
        charaAnim.PlayAnimation(CharaAnimationController.hitParameter); 


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


    }

    /// <summary>
    /// エネミーが拠点に侵入した際の攻撃演出用のエフェクト生成
    /// </summary>
    private void GenerateEnemyAttackEffect(Transform enemyTran) {

        // 拠点の位置(画面の中央)にエフェクトを生成
        GameObject enemyAttackEffect = Instantiate(enemyAttackEffectPrefab, enemyTran, false);

　　　　// 生成されたエフェクトを TemporaryObjectContainerTran の子オブジェクトにする(引数に GetTemporaryObjectContainerTran メソッドの戻り値を利用)
　　　　enemyAttackEffect.transform.SetParent(TransformHelper.GetTemporaryObjectContainerTran());

　　　　// 3秒後にエフェクトを破壊する
        Destroy(enemyAttackEffect, 3.0f);
    }

    /// <summary>
    /// エネミーからのダメージ値用のフロート表示の生成
    /// </summary>
    /// <param name="damage"></param>
    /// <param name="isWeakness"></param>
    private void CreateFloatingMessageToDamage(int damage, bool isWeakness) {

        // フロート表示の生成。生成位置は DefenseBase ゲームオブジェクト内の txtDurability ゲームオブジェクトの位置(子オブジェクト)
        FloatingMessage floatingMessage = Instantiate(floatingMessagePrefab, floatingMessageTran, false);

        // 生成したフロート表示の設定用メソッドを実行。引数として、エネミーからのダメージ値とフロート表示の種類を指定して渡す
        floatingMessage.DisplayFloatingMessage(damage, FloatingMessage.FloatingMessageType.PlayerDamage, isWeakness);
    }

    /// <summary>
    /// ElementTypeの相性判定を行ってダメージの最終値と弱点かどうかを判定
    /// </summary>
    /// <param name="attackPower"></param>
    /// <param name="attackElementType"></param>
    /// <returns></returns>
    private (int, bool) JudgeDamageToElementType(int attackPower, ElementType attackElementType) {

        // タプル型用に別々の変数を用意する(この変数もタプル型にすれば、１つでも実装可能)
        int lastDamage = attackPower;
        bool isWeakness = false;

        // エネミー側の本体やバレットを攻撃者とし、属性間の相性を確認
        if (ElementCompatibilityHelper.GetElementCompatibility(attackElementType, GameData.instance.GetCurrentBulletData().elementType)) {

            // エネミーの攻撃属性がプレイヤー側の弱点であるなら、被ダメージに倍率をかける
            lastDamage = Mathf.FloorToInt(attackPower * GameData.instance.GetDamageRatio());

            isWeakness = true;

            Debug.Log("弱点");
        }

        // 変数をタプル型として戻す
        return (lastDamage, isWeakness);
    }
}

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

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

　実装する内容を確認し、デバッグが必要な部分を理解した上で処理を実行してください。
何か所かデバッグを行う必要がありますので、それを自分で１つずつ確認していってみましょう。

＜実装動画　バレット生成(攻撃)時＞

動画ファイルへのリンク

＜実装動画　被ダメージ時＞

動画ファイルへのリンク

＜実装動画　ゲームオーバー時＞

動画ファイルへのリンク

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

　次は　　です。

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

印刷する

コメント（0）

２Ｄタップシューティングゲーム　拡張４ - i-school 先頭へ

コメントをかく

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

i-school