첫 게임 개발 (11) _ Inventory _ UI 및 체력시스템 설계하기

 

 

보더를 사용하여 위아래 배치 후 투명도를 조절한다. 이미지를 배치하여 동전 이미지를 삽입하고 텍스트로 옆에 배치한다.

 

돈의 수를 나타내는 텍스트에 위처럼 MoneyAmountWidget에 바인드 해준다.

 

 

위와 같이 BPC_Inventory의 MoneyAmountComponent 와 MoneyAmountWidget을 연결하여 돈 획득시 연동하도록 구성한다.

 

I를 눌러 인벤토리를 확인하면 위와 같이 돈이 획득되어 숫자가 올라가는 것을 볼 수 있다.

 

체력을 위젯을 만들기 위해서 WBP_Heart 위젯을 생성하고 위와 같이 이미지를 넣는다.

이미지의 변수 여부를 체크하여 변수로 사용할 수 있도록 한다.

 

Percent 플로트 변수를 추가로 만들고 위와 같이 Percent가 1, 0.5, 0 일때 각각 풀 하트, 반쪽 하트, 빈 하트 텍스쳐를 할당한다.

 

WBP_HealthBar 위젯을 따로 만들어 Wrap Box를 붙이고 사용자 생성에서  WBP_Heart를 찾아 넣는다.

Wrap Box는 안에 있는 내용물의 수에 따라 자동으로 크기를 조절하기 때문에 필수이다.

 

위와 같이 WBP_Inventory 위젯에 사용자 생성에서 WBP_Health Bar를 찾아 넣고 위치를 조정한다.

 

 

다음으로 HealthBar에서 플레이어의 최대 체력과 현재 체력을 가져와 그에 따른 하트 생성 시스템을 설계한다.

위와 같이 Clear Children 함수를 통하여 전체 위젯을 한번 지운 뒤 플레이어의 최대 체력과 현재 체력에 따라 하트를 다시 업데이트 한다.

플레이어의 현제 체력은 바꾸고 싶지 않기 때문에 Health라는 지역 변수를 위해서 Health 변수를 만들고 디테일에서 꼭 프라이빗 체크를 해준다.

 

Counter 인티저 변수를 0으로 디폴트하고 위와 같이 While Loop를 이용하여 설계한다.

최대 체력을 올림하여 Counter와 비교한다.

최대 체력의 올림한 정수만큼 While문이 돌아갈 것이다.

그 후 현재 체력을 Counter와 비교하여 참이면 다시 현재 체력을 내림한 값과 Counter를 비교하여 Flase면 Full Heart를 True면 Half Heart를 프린트한다.

이후 현재 체력값이 Counter보다 작아지면 Empty Heart를 프린트한다.

 

여기 설계가 좀 어려울 수 있는데 즉 최대체력만큼의 하트 칸을 만들어야 하니 최대 체력을 Counter와 비교하여 현재 체력보다 많은 곳은 빈하트로 할당하는 것이다.

이후 현재 체력이 x.0으로 끝나면 Half Heart를 배정하지 않아도 되고 체력이 x.5로 끝난다면 Half Heart를 마지막에 한번 배치해야 되므로 위와 같이 설계되었음을 볼 수 있다.

최대체력 5.0, 현재 체력 4.0인 경우

최대체력 5.0, 남은 체력 2.5인 경우

위의 두 가지 상황에서 현재 체력에 맞게 하트가 프린트 되는 것을 볼 수 있다.

이를 활용하여 하트텍스쳐를 할당할 것이다.