こんにちは！夜の街2Dアクションゲームを制作中の怪獣です🦖

Unityでゲーム制作をしていると、
「体力UIを表示させるようにしたい」
「HPを数値だけで管理すると、プレイヤーにとって分かりづらい…」
て思うことってありますよね。

そんなときは、減っていくHPバー（体力ゲージ） を表示すると一気にゲームらしくなります！

この記事では、
UnityのImageコンポーネントの「Fill」機能を使ってHPバーを作る簡単な方法 を解説します！

※当記事は、HPゲージUIを作る方法を中心で解説しています。
⬇️ダメージ処理を受ける＋HPゲージUI込みで流れで作りたい方はこちらの記事を見るとスムーズです

【Unity入門⑧】敵に触れたらダメージ！体力UIを作ってみよう

前回の記事では、敵を作る方法を解説しました👾今回はそこから一歩進んで、プレイヤーが敵に触れたら体力が減る仕組みを作ってみましょう👾さらに、体力UI（HPバー）を画面に表示して、減っていく演出も追加します！⬇️画像のように、左上に赤いHPバー...

naiterukaiju.com

2025.10.12

⬇️こちらは、ダメージ処理を判定させる方法に特化した記事です

【Unity2D】敵に触れたらダメージを受ける仕組みの作り方｜（コード全文・解説付き）

Unity2Dでアクションゲームを作っていると、敵に触れたらHPを減らしたいダメージ処理を入れたいと思うことがありますよね。この記事では、敵に触れたらプレイヤーがダメージを受ける仕組みの作り方を、初心者向けにわかりやすく解説します！今回は ...

naiterukaiju.com

2026.03.29

この記事でできること

• 画面にHPバーを表示できる
• ダメージを受けるとHPバーが減る
• Image.fillAmount を使ったUI制御が理解できる

① HPバーUIを作る

① Canvasを作成

まずはUIの土台となるCanvasを作ります。

Canvas（キャンバス）とは、一言でいうと
Unityで「UIを表示するための土台（画面）」です。

テキスト、ボタン、パネルなどの UI要素は、必ず Canvas の子オブジェクトとして配置されます。

Hierarchy → 右クリック → UI > Canvas で作成します。

② HPの枠部分のバーを作る

背景バーのベースとなる枠部分を追加します！

①で作ったCanvasを選択 → 右クリック → UI → Imageを追加します

追加したImageを選択し、以下を変更します。

• 名前：HPBar_Backに変更
• 色：黒やグレーに変更する
• サイズ：横長（例：300×30ぐらい）

③ ゲージ部分を作る（赤のバー）

②で作った背景バーに対して、子オブジェクトとしてゲージ部分を作ります！
この③で作る部分はゲージのHPが減る見た目の赤い部分を指しています。

②で作ったHPBar_Backを選択→ 右クリック → UI → Imageを追加します

親子関係にするのがポイントです💡

追加したImageを選択し、以下を変更します。

• 名前：「HPBar_Fill」に変更する
• Inspector >Image > Source Imageを適当なスプライトに設定する（Squareなど）
• Color：赤など
• Image Type：Filledに変更（画像を少しずつ消したり、伸ばしたりできる機能にする）
• Fill Method：Horizontalに変更（横に左→右（または右→左）にゲージが減るようになる）
• Fill Origin：Leftに変更（左から減る）

➡️これで「左から減るHPバー」仕組みになります！

• 背景（Back）：HPの枠
• 前面（Fill）：実際に減る部分

こうして分けることで、見た目調整がしやすくなります！

② HPを減少させるソースコード

今回はHPバーUIの動きを確認しやすいように、Spaceキーを押すとHPが減るサンプルで解説します。ダメージを受ける処理の代わりに、Spaceキーを押すたびにゲージが減少していくことが確認できます。

using UnityEngine;
using UnityEngine.UI;

public class Player : MonoBehaviour
{
    [SerializeField, Header("最大HP")]
    private int _maxHP = 5;

    [SerializeField, Header("HPバーのImage")]
    private Image _hpBarFill;

    private int _currentHP;

    private void Start()
    {
        _currentHP = _maxHP;
        _UpdateHPBar();
    }

    void Update()
    {
        // Spaceキーを押したらHPを1減らす
        if (UnityEngine.Input.GetKeyDown(KeyCode.Space))
        {
            _currentHP--;
            _currentHP = Mathf.Clamp(_currentHP, 0, _maxHP);
            _UpdateHPBar();
        }
    }
    
    private void _UpdateHPBar()
    {
        if (_hpBarFill == null) return;

        _hpBarFill.fillAmount = (float)_currentHP / _maxHP;
    }
}

using UnityEngine;
using UnityEngine.UI;

public class Player : MonoBehaviour
{
    [SerializeField, Header("最大HP")]
    private int _maxHP = 5;

    [SerializeField, Header("HPバーのImage")]
    private Image _hpBarFill;

    private int _currentHP;

    private void Start()
    {
        _currentHP = _maxHP;
        _UpdateHPBar();
    }

    void Update()
    {
        // Spaceキーを押したらHPを1減らす
        if (UnityEngine.Input.GetKeyDown(KeyCode.Space))
        {
            _currentHP--;
            _currentHP = Mathf.Clamp(_currentHP, 0, _maxHP);
            _UpdateHPBar();
        }
    }
    
    private void _UpdateHPBar()
    {
        if (_hpBarFill == null) return;

        _hpBarFill.fillAmount = (float)_currentHP / _maxHP;
    }
}

③ コードを1行ずつ解説

HPを管理する変数

[SerializeField] private int _maxHP = 5;
private int _currentHP;

[SerializeField] private int _maxHP = 5;
private int _currentHP;

_maxHP は最大HPです。
_currentHP は現在のHPです。

SerializeField を付けているので、Inspector から数値を調整することもできます。

StartでHPを初期化する

private void Start()
{
    _currentHP = _maxHP;
}

private void Start()
{
    _currentHP = _maxHP;
}

ゲーム開始時に、現在HPを最大HPと同じ値にしています。
これを入れておくことで、最初から満タンの状態でスタートできます！

HPバー更新処理

    private void _UpdateHPBar()
    {
        if (_hpBarFill == null) return;

        _hpBarFill.fillAmount = (float)_currentHP / _maxHP;
    }

    private void _UpdateHPBar()
    {
        if (_hpBarFill == null) return;

        _hpBarFill.fillAmount = (float)_currentHP / _maxHP;
    }

ここで「見た目（UI）」を更新しています。
_hpBarFill.fillAmountは赤いゲージ部分の長さとなる部分です。
現在HPからMAXHPを割って今の体力の割合を求め、_hpBarFill（赤いゲージ部分のImage）にセットしています。
こうすることで、バーの長さを少しずつ削って体力が変動するように見せています！

④ プレイヤー側にバーをセットする

Playerオブジェクトを選択し、Inspectorの「HP Bar Fill」に対して、作ったHPBar_Fillをドラッグ＆ドロップします！

これを忘れると動かないので注意です！

❌よくあるエラー

HPバーが減らない

原因：

• Image Typeが「Simple」になっている
  ➡️ 必ず「Filled」にする

NullReferenceExceptionが出る

原因：

• _hpBarFillの設定忘れの可能性大
  ➡️ ④の手順通り、Inspectorの「HP Bar Fill」に対して、作ったHPBar_Fillをドラッグ＆ドロップする

まとめ

最後まで読んでいただきありがとうございました！

今回は、ImageのFill機能を使ったHPバー（体力UI）の作り方を解説しました！

動作確認はSpaceキーで行いましたが、実際のゲームでは敵に触れたときにHPを減らす形にしています。
敵に触れたらダメージを受ける処理の仕組みは、こちらの記事で詳しく解説しているので、
合わせて実装すると「敵に触れる」→「ダメージを受ける」→「HPを減らす」という風になり、一気にゲームらしくなります👾

【Unity2D】敵に触れたらダメージを受ける仕組みの作り方｜（コード全文・解説付き）

Unity2Dでアクションゲームを作っていると、敵に触れたらHPを減らしたいダメージ処理を入れたいと思うことがありますよね。この記事では、敵に触れたらプレイヤーがダメージを受ける仕組みの作り方を、初心者向けにわかりやすく解説します！今回は ...

naiterukaiju.com

2026.03.29

前回の記事では、落下したらゲームオーバーにさせる実装方法の解説をしました。

【Unity入門⑬】落下したらゲームオーバー！ゲームオーバーUIを表示させよう

前回の記事では、ゲーム開始時にBGMをつける方法の解説しました！今回は「プレイヤーがマップから落下したら、ゲームオーバーUIを表示する」実装方法を解説します。落下判定は2Dアクションでよく使う定番ギミックです。ミスしたかが分かりやすくなるの...

naiterukaiju.com

2026.01.10

今回は、
プレイヤーがゴールオブジェクトに触れたら「ゲームクリアUI」を表示する方法
を解説します。

ゲームでは、
「敵に当たったらゲームオーバー」、「ゴールにたどり着いたらゲームクリア」という流れが基本になりますよね。

この記事では、

• ゲームクリアUIの作成
• Playerがゴールに触れたかどうか判定させる処理をつくる
• MainManagerでUIを表示させる処理をつくる
• SPACEキーを押すとシーンを最初からやり直す

という流れで作成～表示させるところまで解説を進めていきます！

この記事でやること

• ゲームをクリアしたときのUIを作成する
• ゴールオブジェクトを作成する
• Playerがゴールに触れたらゲームクリアUIを表示させる
• SPACEキーを押すと最初からスタート

① ゲームクリアUIを作成しよう

まずはUIの土台となるCanvasを作ります。

Canvas（キャンバス）とは、一言でいうと
Unityで「UIを表示するための土台（画面）」です。

テキスト、ボタン、パネルなどの UI要素は、必ず Canvas の子オブジェクトとして配置されます。

Canvas を作成する

1. Hierarchy を右クリック
2. UI → Canvasを追加

GameClearPanel を作る

クリア時に画面に表示させるベースとなるパネルを作ります。

1. Canvas の子に UI → Panel を作成する
2. 名前を GameClearPanel に変更
3. 背景色を半透明の黒にするのがおすすめです（Colorで調整）

テキストを配置する

クリア時に画面に表示させる文字を作ります。

1. GameClearPanel の子に UI → Text (TextMeshPro)を追加
2. テキストを GAME CLEAR!! などに変更
3. 中央寄せ・大きめフォントに調整する

必要であれば

• 「次へ」ボタン
• 「タイトルへ戻る」ボタン

を追加してもOKです。

最初は非表示にする

• GameClearPanel の
  チェックを外して非アクティブにしてください。（ゲーム開始時に表示されてしまうため）

②MainManager に 処理を追加する

次に、 MainManagerに以下の処理を作成します。（コピペOK！）

• ゲームクリア時のUIを表示させる処理
• SPACEキーを押すとシーンを最初からやり直す処理

MainManager は主に以下のような役割をします。

• ゲーム全体の状態管理する
• UI の表示・非表示を制御など

using UnityEngine;

public class MainManager : MonoBehaviour
{
    [Header("UI参照")]
    [SerializeField] private GameObject _gameClearPanel;
    
    private bool _isGameClear = false;

    private void Awake()
    {
        // 念のため起動時は非表示
        _gameClearPanel.SetActive(false);
    }
    
    void Update()
    {
        // ゲームクリア後、SPACEキーが押されたらリスタート
        if (_isGameClear && Input.GetKeyDown(KeyCode.Space))
        {
            RestartScene();
        }
    }

    // ゲームクリアUIを表示する
    public void ShowGameClearUI()
    {
        _gameClearPanel.SetActive(true);
        _isGameClear = true;
    }
    
    // シーンを最初から読み直す
    private void RestartScene()
    {
        SceneManager.LoadScene(SceneManager.GetActiveScene().name);
    }
}

using UnityEngine;

public class MainManager : MonoBehaviour
{
    [Header("UI参照")]
    [SerializeField] private GameObject _gameClearPanel;
    
    private bool _isGameClear = false;

    private void Awake()
    {
        // 念のため起動時は非表示
        _gameClearPanel.SetActive(false);
    }
    
    void Update()
    {
        // ゲームクリア後、SPACEキーが押されたらリスタート
        if (_isGameClear && Input.GetKeyDown(KeyCode.Space))
        {
            RestartScene();
        }
    }

    // ゲームクリアUIを表示する
    public void ShowGameClearUI()
    {
        _gameClearPanel.SetActive(true);
        _isGameClear = true;
    }
    
    // シーンを最初から読み直す
    private void RestartScene()
    {
        SceneManager.LoadScene(SceneManager.GetActiveScene().name);
    }
}

各処理の解説

[SerializeField] private GameObject _gameClearPanel;

[SerializeField] private GameObject _gameClearPanel;

• SerializeFieldを定義してUnity上のInspector から設定できるようにしています

上記を定義したら、以下のようにUnity上から①で作成したGameClearPanelをドラッグ＆ドロップしてください！

private bool _isGameClear = false;

private bool _isGameClear = false;

ゲームクリア状態かどうか判断するようのフラグです。
後の処理で、ゲームクリアしている状態（true）だったらSPACEキーを受け付けるようにしています。

private void Awake()
{
    _gameClearPanel.SetActive(false);
}

private void Awake()
{
    _gameClearPanel.SetActive(false);
}

Awake は「シーンが始まった瞬間」に必ず1回だけ呼ばれます💡

• シーン起動時に 必ず非表示にする
• こうするとInspector 設定ミスを防げる

private void Update()
{
    if (_isGameClear && Input.GetKeyDown(KeyCode.Space))
    {
        RestartScene();
    }
}

private void Update()
{
    if (_isGameClear && Input.GetKeyDown(KeyCode.Space))
    {
        RestartScene();
    }
}

Updateは毎フレーム呼ばれます。

• キー入力は 毎フレーム監視する必要がある
• ゲームクリア後だけ受付するように条件を付けています

private void RestartScene()
{
    SceneManager.LoadScene(SceneManager.GetActiveScene().name);
}

private void RestartScene()
{
    SceneManager.LoadScene(SceneManager.GetActiveScene().name);
}

• 今開いているシーン名を取得
• そのシーンを再ロード

➡️ 「最初からスタート」＝シーンを再読み込みということをしています。

public void ShowGameClearUI()
{
    _gameClearPanel.SetActive(true);
    _isGameClear = true;
}

public void ShowGameClearUI()
{
    _gameClearPanel.SetActive(true);
    _isGameClear = true;
}

• ゲームクリア時に呼ばれる（Player側で判断します）
• UI を表示するだけのシンプルな責務
• _isGameClearをtrueに更新し、クリア状態にしている

他にもこのあとに

• SE 再生
• BGM 停止
• フェード演出

を追加する場合も、ここに書けばOKです！

③ゴールオブジェクトを作る

ゴール用オブジェクトを作成

• Hierarchyで「2Dオブジェクト → Sprite → Square」を作成する（名前はGoalにする）
• Add Componentでコンポーネントを追加
  • BoxCollider2D などの Collider2D を追加
  • Rigidbody2D（物理挙動を持たせておく）
    • Body TypeはStaticにしておきます（オブジェクトが動かないようにするため）
• Sprite Rendererタブで「Sprite」にゴール用の画像をドラッグする

「Goal」タグを追加して設定する

1. Inspector の Tag からAdd Tagを押す
2. 「＋」ボタンでGoal タグを追加する

Goal タグを追加したらゴールオブジェクトに設定してください。

④Player.csにゴールの当たり判定処理を作る

次に、プレイヤーがゴールに触れたことを検知する処理をOnCollisionEnter2Dメソッド内に作成します。

OnCollisionEnter2D は
Collider2D 同士が接触した瞬間に呼ばれるUnityの共通メソッドです。

今回のように、「敵に当たった」「ゴールに触れた」といった判定をすることが出来ます。

public class Player : MonoBehaviour
{
    
    private void OnCollisionEnter2D(Collision2D collision)
    {
        // 敵に触れたときの処理
        if (collision.gameObject.CompareTag("Enemy"))
        {
            _HitEnemy(collision.gameObject);
        }
        // 追加
        // ゴールに触れたときの処理 
        else if (collision.gameObject.tag == "Goal")
        {
            FindObjectOfType<MainManager>().ShowGameClearUI();

            // プレイヤーを非アクティブにする
            enabled = false;
            GetComponent<PlayerInput>().enabled = false;
        }
    }
}

public class Player : MonoBehaviour
{
    
    private void OnCollisionEnter2D(Collision2D collision)
    {
        // 敵に触れたときの処理
        if (collision.gameObject.CompareTag("Enemy"))
        {
            _HitEnemy(collision.gameObject);
        }
        // 追加
        // ゴールに触れたときの処理 
        else if (collision.gameObject.tag == "Goal")
        {
            FindObjectOfType<MainManager>().ShowGameClearUI();

            // プレイヤーを非アクティブにする
            enabled = false;
            GetComponent<PlayerInput>().enabled = false;
        }
    }
}

各処理の解説

        // ゴールに触れたときの処理 
        else if (collision.gameObject.tag == "Goal")
        {
            FindObjectOfType<MainManager>().ShowGameClearUI();

            // プレイヤーを非アクティブにする
            enabled = false;
            GetComponent<PlayerInput>().enabled = false;
        }

        // ゴールに触れたときの処理 
        else if (collision.gameObject.tag == "Goal")
        {
            FindObjectOfType<MainManager>().ShowGameClearUI();

            // プレイヤーを非アクティブにする
            enabled = false;
            GetComponent<PlayerInput>().enabled = false;
        }

• tag名が“Goal”に設定されたオブジェクトに触れたか判定
• 触れた場合、シーン上に存在する MainManager を探して取得する
• ShowGameClearUI() で、ゲームクリア用の UI をMainManager から表示する
• BGM 停止や効果音再生などもここでまとめて管理ができます

enabled = false;
GetComponent<PlayerInput>().enabled = false;

enabled = false;
GetComponent<PlayerInput>().enabled = false;

• Player スクリプト自体を停止（ゴール後に操作できないようにする）
• Update や移動処理が動かなくなる

ゴール後も動けてしまうと、演出が壊れてしまうため必須の処理です。

動作確認

ゴールオブジェクトに触れて、UIを表示することができました！

まとめ

1. ゴールに触れたら GAME CLEAR!! UI を表示
2. プレイヤー操作を停止
3. SPACEキーを押すとシーンを最初からやり直す

最後まで読んでいただきありがとうございました！

これで、「遊ぶ → クリア → もう一回」という、
ゲームとして最低限必要なループが完成しました！

この記事が少しでもゲーム制作のお役に立てたら嬉しいです🦖

段々ゲームらしくなってきましたが、背景がまだ何も設定していなくて寂しいので
次回は背景の表示方法及び、背景を歩行に合わせてスクロールさせる実装方法の解説を行う予定です！

【Unity入門⑮】歩行に合わせて背景をスクロールさせよう！

前回の記事では、ゴールに触れたらゲームクリアUIを表示させる方法を解説しました。今回は歩行に合わせて背景画像をスクロールさせる方法 を解説します！背景があるだけでよりゲームらしさがグッと増して、世界観が一気に広がりますよね！ただ背景を用意す...

naiterukaiju.com

2026.02.17

前回の記事では、ゲーム開始時にBGMをつける方法の解説しました！

【Unity入門⑫】2Dアクションゲームで開始時にBGMを流そう！

前回の記事では、効果音をつける方法の解説しました！今回はゲームを起動した瞬間に、 BGMを自動再生する方法を解説します。BGMが入るだけで、画面の印象やゲームの世界観が一気に引き締まり、ゲームらしさがグッと増します！BGMはゲーム全体で共通...

naiterukaiju.com

2026.01.01

今回は「プレイヤーがマップから落下したら、ゲームオーバーUIを表示する」実装方法を解説します。

落下判定は2Dアクションでよく使う定番ギミックです。
ミスしたかが分かりやすくなるので、よりゲームのテンポも良くなります！

この記事では、

• ゲームオーバーUIはすでに用意してある前提
• 「プレイヤーがマップから落下したかどうか判定する」

という ロジック部分のみを扱います。

ゲームオーバーUIの作成方法自体は、すでに別記事で解説しています。
詳しくは、先にこちらをご覧ください⬇️

【Unity入門⑨】HPが0になったらゲームオーバーの演出をさせよう

前回の記事で、敵に触れたらダメージを食らうHPバーを作りました。今回はプレイヤーのHPが0になったらゲームオーバになるUIを作ってみましょう！この記事では、・プレイヤーのHPが0になったら画面に「GAME OVER」、「リトライ」ボタンを表...

naiterukaiju.com

2025.10.18

この記事ですること

今回やることはシンプルで、流れはこんな感じです。

1. プレイヤーの Y座標が一定より下になったら「落下」と判定
2. MainManager に「ゲームオーバーになった」と伝える
3. MainManager が ゲームオーバーUIを表示する

事前確認

• 「【Unity入門⑨】HPが0になったらゲームオーバーの演出をさせよう」の章を実装済である提で解説を進めています
• ゲームオーバーUI、MainManager が既に作成済である前提で解説を進めています

①Player.cs（落下を検知する処理だけ書く）

Player 側では
「落ちたかどうか」だけを判断します。
落下判定は、一番分かりやすい Y座標チェックを使います。

using UnityEngine;

public class Player : MonoBehaviour
{
    [SerializeField] private float _fallDeadLineY = -10f;

    private MainManager _mainManager;
    private bool _isDead;

    private void Start()
    {
        _mainManager = FindObjectOfType();
    }

    private void Update()
    {
        if (_isDead) return;

        if (transform.position.y < _fallDeadLineY)
        {
            _isDead = true;
            _mainManager.Show();
        }
    }
}

using UnityEngine;

public class Player : MonoBehaviour
{
    [SerializeField] private float _fallDeadLineY = -10f;

    private MainManager _mainManager;
    private bool _isDead;

    private void Start()
    {
        _mainManager = FindObjectOfType();
    }

    private void Update()
    {
        if (_isDead) return;

        if (transform.position.y < _fallDeadLineY)
        {
            _isDead = true;
            _mainManager.Show();
        }
    }
}

②各処理の説明

落下ラインの設定

[SerializeField] private float _fallDeadLineY = -10f;

[SerializeField] private float _fallDeadLineY = -10f;

• この Y 座標より下に行ったら「落下した」と判断するライン

Inspectorから調整できるので、ステージが変わっても数値を変えるだけで対応可能！

MainManager を取得

_mainManager = FindObjectOfType<MainManager>();

_mainManager = FindObjectOfType<MainManager>();

• シーン内にある MainManager を探して使えるようにしている

➡️Player は「ゲームオーバーにしてほしい」と MainManager にお願いする役です。

Update() で落下判定

if (_isDead) return;

if (_isDead) return;

• すでに落下した後は何もしないようにしています

if (transform.position.y < _fallDeadLineY)
{
    _isDead = true;
    _mainManager.Show();
}

if (transform.position.y < _fallDeadLineY)
{
    _isDead = true;
    _mainManager.Show();
}

1. プレイヤーの現在位置を取得
2. Y座標が落下ライン（Inspectorで設定したもの）より下かチェック
3. 下ならゲームオーバー
   という流れです。

なぜ「落下判定」と「ゲームオーバー処理」を分けるのか？

ここが設計上大事なポイントです。

• Player
  ➡️「落ちたかどうか」を判断するだけ
• MainManager
  ➡️「ゲームオーバーにする」責任だけを持つ

こうしておくと、

• HPが0になった
• トゲに当たった
• 制限時間切れ

なども、すべて

_mainManager.Show();

_mainManager.Show();

で統一することができます🦖

落下ラインの調整方法

[SerializeField] private float _fallDeadLineY = -10f;

[SerializeField] private float _fallDeadLineY = -10f;

• ステージの一番下より少し低めに設定
• Inspector から調整できるようにしておく

これだけで、
ステージごとの微調整がとても楽になります。

まとめ

• 今回は 「ゲームオーバーにする条件」だけを実装
• ゲームオーバー処理は MainManager に集約すると拡張しやすい

この記事では、「プレイヤーがマップから落下したかどうか判定する」方法について解説しました。

最後まで読んでいただきありがとうございました！

この記事が少しでもゲーム制作に役立てたら嬉しいです🦖

次回は、ゴールに触れたらゲームクリアさせ、クリア時のUIを作成～表示させる実装方法の解説を行う予定です！

【Unity入門⑭】ゴールに触れたらゲームクリア！ゴールUIを表示しよう

前回の記事では、落下したらゲームオーバーにさせる実装方法の解説をしました。今回は、プレイヤーがゴールオブジェクトに触れたら「ゲームクリアUI」を表示する方法を解説します。ゲームでは、「敵に当たったらゲームオーバー」、「ゴールにたどり着いたら...

naiterukaiju.com

2026.01.18

前回の記事で、敵に触れたらダメージを食らうHPバーを作りました。

【Unity入門⑧】敵に触れたらダメージ！体力UIを作ってみよう

前回の記事では、敵を作る方法を解説しました👾今回はそこから一歩進んで、プレイヤーが敵に触れたら体力が減る仕組みを作ってみましょう👾さらに、体力UI（HPバー）を画面に表示して、減っていく演出も追加します！⬇️画像のように、左上に赤いHPバー...

naiterukaiju.com

2025.10.12

今回はプレイヤーのHPが0になったらゲームオーバになるUIを作ってみましょう！

この記事では、
・プレイヤーのHPが0になったら画面に「GAME OVER」、「リトライ」ボタンを表示させる
・「リトライ」ボタン押したら初期位置にリスポーンする
のような仕組みを解説していきます！

完成イメージ

• 画面中央に「GAME OVER」＋「リトライ」ボタンを表示
• リトライボタンを押すとシーンを再読み込みして最初からスタートできる

① UI を用意する（Canvas）

ゲームオーバーになった場合に表示させるUI（テキスト、ボタン）を作っていきましょう！

1. Canvas を作成
   • Hierarchy → 右クリック → UI > Canvas
   • Render Mode：Screen Space – Overlay（そのままでOK）
   • ※自動で EventSystem も作られます（なければ UI > Event System を追加）
2. 全画面の暗幕を作る
   • Canvas を右クリック → UI > Panel（名前：GameOverPanelにする）
   • Image の色を 黒 (0,0,0)、Alpha=160/255 くらい（薄暗く）
   • Inactive（非アクティブ） にしておく（起動直後に見えないように）
3. ゲームオーバー時のテキスト & リトライボタン
   • GameOverPanel の子に UI > Text (TMP) か UI > Text（名前：Title）
     • 文字：GAME OVER
   • GameOverPanel の子に UI > Button（名前：RetryButton、ラベル：RETRY）
     👉「RETRY」ボタンを押したときに シーンを再読み込み（ゲーム再スタート） するため用のボタンです

＜3.ゲームオーバー時のテキスト＞
テキストのサイズ、位置などを調整します。

＜3.リトライボタン＞
ボタンの位置はPos X、Pos Yで調整します。

② MainManager.csの新規作成

ゲームオーバー時のUI表示、リトライをまとめて管理するMainManager.csを新規作成します📝（コピペOK）

using UnityEngine;
using UnityEngine.SceneManagement;
using UnityEngine.UI;
using System.Collections;

public class MainManager : MonoBehaviour
{
    [Header("UI 参照")]
    [SerializeField] private GameObject _gameOverPanel;   // ← GameOverPanel を割り当て
    [SerializeField] private Button _retryButton;         // ← RetryButton を割り当て

    private bool _shown = false;

    private void Awake()
    {
        // 起動直後は非表示
        if (_gameOverPanel != null) _gameOverPanel.SetActive(false);

        if (_retryButton != null)
            _retryButton.onClick.AddListener(Restart);
    }

    // 外部（Player）から呼ぶ
    public void Show()
    {
        if (_shown) return;
        _shown = true;

        // パネルを出す
        if (_gameOverPanel != null) _gameOverPanel.SetActive(true);

        // 時間停止（UI演出は unscaledDeltaTime で動かす）
        Time.timeScale = 0f;

    }

    public void Restart()
    {
        // 時間を戻してからリロード
        Time.timeScale = 1f;
        SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex);
    }
}

using UnityEngine;
using UnityEngine.SceneManagement;
using UnityEngine.UI;
using System.Collections;

public class MainManager : MonoBehaviour
{
    [Header("UI 参照")]
    [SerializeField] private GameObject _gameOverPanel;   // ← GameOverPanel を割り当て
    [SerializeField] private Button _retryButton;         // ← RetryButton を割り当て

    private bool _shown = false;

    private void Awake()
    {
        // 起動直後は非表示
        if (_gameOverPanel != null) _gameOverPanel.SetActive(false);

        if (_retryButton != null)
            _retryButton.onClick.AddListener(Restart);
    }

    // 外部（Player）から呼ぶ
    public void Show()
    {
        if (_shown) return;
        _shown = true;

        // パネルを出す
        if (_gameOverPanel != null) _gameOverPanel.SetActive(true);

        // 時間停止（UI演出は unscaledDeltaTime で動かす）
        Time.timeScale = 0f;

    }

    public void Restart()
    {
        // 時間を戻してからリロード
        Time.timeScale = 1f;
        SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex);
    }
}

③各処理の説明

UI参照の変数

[SerializeField] private GameObject _gameOverPanel;
[SerializeField] private Button _retryButton;

[SerializeField] private GameObject _gameOverPanel;
[SerializeField] private Button _retryButton;

• UnityのInspectorから
  • ゲームオーバー用のPanel
  • Retryボタン
    を 紐づけるための変数です。

• Unity上の設定から設定できるようにする

ゲームオーバーの多重実行防止

private bool _shown = false;

private bool _shown = false;

• ゲームオーバー処理が
  何回も呼ばれてしまうのを防ぐためのフラグです。

落下判定は Update() で毎フレーム実行されるため、
何もしないと 何度もゲームオーバー処理が走る可能性があります。

Awake() の役割

private void Awake()
{
    if (_gameOverPanel != null)
        _gameOverPanel.SetActive(false);

    if (_retryButton != null)
        _retryButton.onClick.AddListener(Restart);
}

private void Awake()
{
    if (_gameOverPanel != null)
        _gameOverPanel.SetActive(false);

    if (_retryButton != null)
        _retryButton.onClick.AddListener(Restart);
}

Awake とは？

• オブジェクトが生成された直後に1回だけ呼ばれる
• 「初期設定」を書くのに向いている

_gameOverPanel.SetActive(false);

_gameOverPanel.SetActive(false);

GameOverPanel を非表示にする設定をしています。
ゲーム開始直後からゲームオーバー画面が表示されないようにするためです。

_retryButton.onClick.AddListener(Restart);

_retryButton.onClick.AddListener(Restart);

Retryボタンに処理を登録しています。
Retryボタンが押されたらRestart() メソッドを実行するという 予約をしています。

※ ボタンを押すたびに処理を追加しないため、Awakeで1回だけ登録するのがポイントです。

Show() メソッド（ゲームオーバーにさせる）

public void Show()

public void Show()

• 「ゲームオーバーになった瞬間」に呼ばれる
• Player や他のクラスから呼び出す用

if (_shown) return;
_shown = true;

if (_shown) return;
_shown = true;

• 落下中は毎フレーム条件を満たす
• そのたびに呼ばれると不具合の原因になる

➡️「最初の1回だけ実行する」ための安全装置です（2重実行を防止）

_gameOverPanel.SetActive(true);

_gameOverPanel.SetActive(true);

GameOver UI を表示させるということをしています。

• 非表示だったUIを表示する

Restart()（リトライボタンを押したとき）

public void Restart()
{
    Time.timeScale = 1f; // 時間を元に戻す
    SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex); // 同じシーンを再読み込み
}

public void Restart()
{
    Time.timeScale = 1f; // 時間を元に戻す
    SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex); // 同じシーンを再読み込み
}

「RETRY」ボタンを押したときに呼ばれます。

• Time.timeScale = 1
  → ゲームを再開できるように時間を元通りにする
• SceneManager.LoadScene()
  → 今のシーンをリロードして最初からスタート！

これで「やり直し」ができるようになります。

④MainManagerのセットアップ

②で作成したスクリプトを管理する用のMainManagerオブジェクトを作成します。

1. MainManagerオブジェクトを作成する
   • Hierarchy → ＋ボタンクリック →「create Empty」で空のオブジェクトを作成する
   • 名前を「MainManager」に変更
     （create Emptyはスクリプトだけ入れたい時などに使用されます）
2. MainManager.csの適用
   • Add Component> MainManager.csを選択して適用する
3. UIのセットアップ
   • 「gameOverPanel」 に CanvasのGameOverPanel をドラッグする
   • 「retryButton」 に CanvasのRetryButton をドラッグする

⑤Player からゲームオーバーを呼ぶ処理を書く

Player.csにMainManager.csで追加した処理を呼び出します。
HP処理の _TakeDamage() で 0 以下になった瞬間に Show() を呼びます。

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.InputSystem;

public class Player : MonoBehaviour
{
    [SerializeField, Header("最大HP")]
    private int _maxHP = 5;

    private int _currentHP;
    [SerializeField, Header("HPバーのImage")]
    private Image _hpBarFill;

    private MainManager _mainManager;　// 追加
    private PlayerInput _input;　// 追加

    void Start()
    {
        _currentHP = _maxHP;
        _UpdateHPBar();
        _mainManager = FindObjectOfType<MainManager>(); // 追加
        _input = GetComponent<PlayerInput>(); // 追加
    }

    private void OnCollisionEnter2D(Collision2D col)
    {
        if (col.collider.CompareTag("Enemy"))
        {
            _TakeDamage(1);
        }
    }

    // ダメージ処理
    private void _TakeDamage(int damage)
    {
        _currentHP -= damage;
        _currentHP = Mathf.Clamp(_currentHP, 0, _maxHP);

        _UpdateHPBar();

        if (_currentHP <= 0)　// 追加
        {
            // 操作を止める
            if (_input != null) _input.enabled = false;

            // ゲームオーバーを表示
            if (_mainManager != null) _mainManager.Show();
        }
    }

    // HPバーの見た目を更新
    private void _UpdateHPBar()
    {
        if (_hpBarFill != null)
        {
            _hpBarFill.fillAmount = (float)_currentHP / _maxHP;
        }
    }
}

using UnityEngine;
using UnityEngine.UI;
using UnityEngine.InputSystem;

public class Player : MonoBehaviour
{
    [SerializeField, Header("最大HP")]
    private int _maxHP = 5;

    private int _currentHP;
    [SerializeField, Header("HPバーのImage")]
    private Image _hpBarFill;

    private MainManager _mainManager;　// 追加
    private PlayerInput _input;　// 追加

    void Start()
    {
        _currentHP = _maxHP;
        _UpdateHPBar();
        _mainManager = FindObjectOfType<MainManager>(); // 追加
        _input = GetComponent<PlayerInput>(); // 追加
    }

    private void OnCollisionEnter2D(Collision2D col)
    {
        if (col.collider.CompareTag("Enemy"))
        {
            _TakeDamage(1);
        }
    }

    // ダメージ処理
    private void _TakeDamage(int damage)
    {
        _currentHP -= damage;
        _currentHP = Mathf.Clamp(_currentHP, 0, _maxHP);

        _UpdateHPBar();

        if (_currentHP <= 0)　// 追加
        {
            // 操作を止める
            if (_input != null) _input.enabled = false;

            // ゲームオーバーを表示
            if (_mainManager != null) _mainManager.Show();
        }
    }

    // HPバーの見た目を更新
    private void _UpdateHPBar()
    {
        if (_hpBarFill != null)
        {
            _hpBarFill.fillAmount = (float)_currentHP / _maxHP;
        }
    }
}

全体の流れをまとめると…

動作確認

1. GameOverPanel を非アクティブにしておく（Startで有効化されないように）
2. プレイして敵に触れ、HPを0にする
3. 画面が暗転＋GAME OVER、操作が止まり、RETRYでシーン再読み込み

まとめ

• GameOverPanel を用意して MainManager で表示・停止・再開を管理
• Player 側は HPが0の瞬間だけ Show() を呼ぶ

最後まで読んでいただきありがとうございました！

敵からダメージを食らうようにしましたが、このままだと敵を倒す処理が実装されていないので次回では倒せるようにします！

【Unity入門⑩】敵を踏んだら倒す処理を作ろう！

前回は「HPが0になったらゲームオーバーの演出させる」処理を実装しました。今回は2Dアクションゲームらしく、上から踏んだら敵を倒す処理を追加します！💥この記事でやることプレイヤーが上から敵を踏むと倒す横や下からぶつかるとダメージを受ける反動...

naiterukaiju.com

2025.11.08