Week04_UI_Damage - M-634/unity-game-dev-tutorial GitHub Wiki

Week04 - UI_Damage

🎯 今回のゴール

  • 弾が敵に当たると HP を削るようにする
  • 敵ごとに HP を持たせ、HP0で消滅させる
  • キル数をカウントして UI に表示する
  • ダメージを与えたときに、数字を表示する（簡易演出）
  • UnityでUIを実装するための基礎を取得する

🧭 授業の流れ（追加）

  • 必要なScriptsを作成する。
  • UIの簡単な説明と設定
  • TextMeshProをインポート

① 敵にHPを持たせる

📄 EnemyHealth.cs 

using UnityEngine;

   public class EnemyHealth : MonoBehaviour
    {
        [SerializeField] 
        private int _maxHp = 100;
        
        private int _currentHp;
        private bool _isDead = false;

        private void Start()
        {
            _currentHp = _maxHp;
        }
        
        public void OnDamaged(int damageAmount)
        {
            if(_isDead) return;
            
            DamagePopup.Create(transform.position, damageAmount);   
            _currentHp -= damageAmount;
            

            if (_currentHp <= 0)
            {
                _isDead = true;
                EnemyKillCounter.Instance.AddKillCount();
                Destroy(gameObject);
            }
        }
    }

② 弾が敵にダメージを与える処理

📄 Bullet.cs の修正

using UnityEngine;

 [RequireComponent(typeof(Rigidbody2D), typeof(BoxCollider2D))]
    public class Bullet : MonoBehaviour
    {
        [SerializeField] 
        private int _damageAmount = 10;
        
        private void OnTriggerEnter2D(Collider2D collision)
        {
            if (collision.CompareTag("Wall"))
            {
                 Destroy(gameObject);  
                 return;
            }

            if (collision.TryGetComponent<Enemy.EnemyHealth>(out var enemy))
            {
                 enemy.OnDamaged(_damageAmount);
            }
        }
    }

③ キルカウント用のスクリプト

📄 EnemyKillCounter.cs

using UnityEngine;
using UnityEngine.UI;

 public class EnemyKillCounter : MonoBehaviour
    {
        [SerializeField] 
        private TextMeshProUGUI _killCountText;
        
        private int _killCount;
        
        public static EnemyKillCounter Instance { get; private set; }
        
        [RuntimeInitializeOnLoadMethod(RuntimeInitializeLoadType.SubsystemRegistration)]
        public static void Initialize()
        {
            Instance = null;
        }
        
        private void Awake()
        {
            if (Instance == null)
            {
                Instance = this;
            }
            else
            {
                Destroy(gameObject);
            }
        }

        public void AddKillCount()
        {
            _killCount++;
            _killCountText.text = _killCount.ToString();
        }
    }

✅ 設定手順

  • Canvas に Text を作成 → フォント大きめ・右上表示など
  • EnemyKillCounter.cs を空オブジェクトにアタッチ
  • _killText に Text UI をアタッチ

④ ダメージ数値の表示（簡易）

📄 DamagePopup.cs

using UnityEngine;
using UnityEngine.UI;

  public class DamagePopup : MonoBehaviour
    {
        [SerializeField]
        private TextMeshProUGUI _popupText;
        
        [SerializeField] 
        private float _floatSpeed = 1f;
        
        [SerializeField]
        private float _duration = 0.5f;
        
        public static void Create(Vector3 position, int damage)
        {
            var resourcePrefab = Resources.Load<GameObject>("DamagePopup"); 
            GameObject popup = Instantiate(resourcePrefab, position, Quaternion.identity);
            popup.GetComponent<DamagePopup>().SetDamage(damage);
        }
        
        private void SetDamage(int damage)
        {
            _popupText.text = damage.ToString();
            Destroy(gameObject, _duration);
        }

        private void Update()
        {
            transform.position += Vector3.up * _floatSpeed * Time.deltaTime;
        }
    }

✅ 設定手順

  • Workspace/Resourcesを作成する。
  • Popup用のPrefabを作成し、Workspace/Resourcesに格納する。
  • 中に Canvas → TextMeshPro（World Space）を入れ、DamagePopup.cs をアタッチ
  • Textにはデフォルトで "0" としておき、フォントサイズ・色を赤などに

✅ 動作チェックリスト（拡張）

  • 弾が敵に当たると HP が減る
  • 敵に HP バーをつける（任意） or 数値表示が出る
  • HP が 0 になると敵が Destroy される
  • キル数が UI に反映される
  • 弾は敵や壁に当たると消える

🎨 補足：CanvasとUIの基本

✅ Canvasとは？

  • UI（ユーザーインターフェース）を表示するための仕組み
  • ボタン・HPバー・スコア表示などはすべて Canvasの子オブジェクト に配置される

Canvasの表示モード（Render Mode）

モード 特徴 用途
Screen Space - Overlay 画面の最前面に表示される（標準） スコア・HPバーなどの固定UI
World Space ワールド上の座標に表示されるUI ダメージ数字・敵のHPバーなど

よく使うUI要素

UI要素 用途
Slider HPバーなどのバー表示に使う
*Text 数字・スコアなどの表示に使う
Image 背景・アイコンなどの表示に使う

*今回の講義では「Textmeshpro」を使用する。

📝 課題 (バランス調整)

  • 1.新しい「敵の種類」を作ろう L 新機のEnemyPrefabを作成し、HPやダメージを調整してみる

  • 2.敵のHPをランダムに変化させるようにし、弱い敵（1発）〜強い敵（3発）などを混ぜて出現させてみよう

ヒント : ランダムで数値を出すやり方.

_currentHp = Random.Range(1, 4); // HP1〜3
  • 3.敵がダメージを受けるたびに、一瞬白く光る処理を追加してみよう （難）

ヒント１ : SpriteRenderer コンポーネントの色(color)を変えて見る

[SerializeField] private SpriteRenderer _renderer;

 _renderer.color = Color.red;//赤色になる

ヒント2 : 「一瞬白く光る」を実現させるためには...「Coroutine」というキーワードをググってみる

  • 4 PlayerにHPバーを作成して、Hpが「０」になったらゲームオーバーの仕組みを作ってみよう（ノーヒント：難）
⚠️ **GitHub.com Fallback** ⚠️