【Unity】体力ゲージの作り方。Sliderを用いれば簡単に実装可能です。

2022年2月5日2024年7月28日

どうも、だらはです。
今回は体力ゲージの作り方を紹介したいと思います。
Unity標準の機能であるSliderを用いて簡単に実装できるのが本手法のメリットです。

体力ゲージの作り方

では早速作り方を記載していきます。

1. [Hierarchy -> UI -> Input Field]からInputFieldを作成。
2. [Hierarchy -> UI -> Slider]からSliderを作成。
3. SliderのHand Slide Areaを削除。(Sliderのハンドルは体力ゲージには不要)
4. SliderのFill AreaおよびFillのLeft, Rightを0に変更。(上下限まで色を塗るために必要)
5. FillのImageのColorを黄色、BackgroundのImageのColorを赤色に変更。
6. [Hierarchy -> Create Empty]から空のオブジェクトを作成して「Score」と命名後、ScoreGauge.cs(後述)をアタッチ。
7. public変数に、手順1と手順2のオブジェクトを割り当てる。(下図1参照)

以上です。

今回は体力ゲージを増減させるためのイベントをボタンを用いることで実現します。
ボタンにButtonPM.cs(後述)をアタッチし、ButtonコンポーネントからButtonPlus()およびButtonMinus()を実行します。(下図2)
実行結果は下図2の通りです。

◆下図1

◆下図2

無事、ボタン押下で体力ゲージが模擬できました。
ビバ、ノンノン！

◆ScoreGauge.cs

using UnityEngine;
using UnityEngine.UI;

public class ScoreGauge : MonoBehaviour
{
    int countMin;       //体力ゲージ最小値
    int countMax;       //体力ゲージ最大値
    int count;          //体力ゲージ現状値

    public InputField inputTextField;   //カウント表示用
    public Slider gauge;                //ゲージ表示用

    void Start()
    {
        countMin = 0;
        countMax = 10;
        count = 10;

        gauge.minValue = countMin;
        gauge.maxValue = countMax;
        gauge.value = count;

        inputTextField.text = count.ToString() + "/" + countMax;
    }

    public void Damage(int x)
    {
        if (x > 0)
        {
            if (count < countMax) { count = count + x; if (count > countMax)
                {
                    count = countMax;
                }

                gauge.value = count;
            }
        }
        else
        {
            if (count > countMin)
            {
                count = count + x;

                if (count < countMin)
                {
                    count = countMin;
                }

                gauge.value = count;
            }
        }
        inputTextField.text = count.ToString() + "/" + countMax;
    }
}

◆ButtonPM.cs

using UnityEngine;

public class ButtonPM : MonoBehaviour
{
    public void ButtonPlus()
    {
        GameObject.Find("Score").GetComponent<ScoreGauge>().Damage(1);
    }

    public void ButtonMinus()
    {
        GameObject.Find("Score").GetComponent<ScoreGauge>().Damage(-1);
    }
}

最後に

いかがでしたでしょうか。
今回は体力ゲージ実装の基礎を紹介しました。
需要があれば体力ゲージを生成するなどの機能をまとめたいと思います！

以上、だらはでした。

追記(2024.7.28)

3Dオブジェクトのすぐ付近に体力ゲージを表示する方法をまとめました！
以下を読んでいただけると嬉しいです。