UI - 캐릭터 HP 바 만들기

 

캔버스 만들고 그 안에 Image 만들고 거기에 이미지 넣어서 같은걸 하나 더 복사한 후 색을 바꿔준다.

 

아래쪽 이미지(HP_Front_Blue)가 점차 사라지면서 뒤에 있는 Red 이미지가 보여짐.

 

 

Image Type을 Filled로 바꾼뒤 Vertical로 해준다.

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

public class HP_UI_Controller : MonoBehaviour
{
    [SerializeField] private Image image;
    [SerializeField] private float playerCurrentHp;
    [SerializeField] private float playerMaxHp;

    [SerializeField] private float damage;

    void Update()
    {
        if( Input.GetKeyDown(KeyCode.T) )
        {
            playerCurrentHp -= damage;
            image.fillAmount = playerCurrentHp / playerMaxHp;
        }
            
    }
}

 

 

스크립트를 넣고 점차 없어지게할 이미지를 선택하고 데미지와 HP를 적어서 확인해본다.