유니티)기초 UI 체력바 만들기

UI 체력바 만들기(GUI)

UI이미지 만들기

이미지 2개와 텍스트UI 1개를 생성한다. 

1) 체력이 깍일 때 밑에 보이는? 이미지

2) 실제 HP를 표시 할 이미지

3) 캐릭터의 HP를 텍스트로 표시할 UI오브젝트

(UI오브젝트들은  'Canvas'안에 넣어야 게임뷰에 보이기 때문에 canvas안에 생성해준다)

1) HP_glass는 별다른 설정없지만

2) HP_Image는 HP수치에 따라 왼쪽에서 오른쪽으로 길이가 줄어드는 효과를 내야한다.

HP 이미지 컴포넌트 설정

Source Image : UI이미지에 적용할 sprite이미지

Image Type -> Filled

Fill Metod -> Horizontal 수평으로 증감 효과 

Fill Origin -> Left 이미지가 채워지는 시작장소(체력이 달면 오른쪽에서 왼쪽으로 줄어듦)

Fill Amount : 1이면 이미지가 모두 채워지고 0으로 갈수록 줄어듦

소스코드

 private void Update()

 {

PlayerHPbar();

 }

public void PlayerHPbar( ) 

{

float HP = CharMgr.Instance._PlayerHp; //캐릭터 hp를 받아옴

hpbar.fillAmount = HP / 100f;

HpText.text = string.Format("HP {0}/100", HP);

}

hpbar.fillAmount HP/ 100f; : 현재 체력을 100으로 나누어 이미지 넓이를 표시한다.

HpText.text = stirng.Format("HP {0}/100",HP); : 텍스트로도 표시 하기 위한 UI text