UE4 Chapter 10-1. HUD : 플레이어의 HP Bar

Date:     Updated:

카테고리:

태그:

인프런에 있는 황대희님의 언리얼 엔진4 3D 횡스크롤 게임 만들기 강의를 듣고 정리한 필기입니다. 😀
언리얼 엔진 공식 문서 https://docs.unrealengine.com/ko/index.html

🚖 플레이어의 HP Bar UI 만들기

플레이어의 상태 UI 를 나타낼 “GamePlayMain” 위젯 블루프린트 추가

🚩 “GamePlayMain” 위젯 블루프린트 디자이너 모드

image

언리얼에선 Progress Bar UI 를 통하여 체력바, 진행률 같은 부분을 구현할 수 있다. 유니티 이미지의 Filled 와 비슷.

  • Image_HeroPic 👉 히어로 사진
    • Appearance - Image 에서 사진 할당
      • Idle 애니메이션에서 캡처하였다..
  • ProgressBar_HP
    • Progress - Percent 를 1 로 설정해주었다. 기본 상태를 100% 채워져 있는 상태로!
    • Appearance - Fill Color 에서 채울 색 지정
    • Style - Background 채워지지 않은 부분, 배경색
  • ProgressBar_MP
    • HP 와 동일
  • ProgressBar_ST
    • HP 와 동일
    • 단, ProgressBar_ST 아직 안보이게 할 것이라서 Behavior - Visablity 에서 Hidden 으로 바꿔주었다.


🚖 HP Bar UI 생성 및 띄우기

게임 인스턴스에서 관리.

🚩 “SideScrollGameInstance” 게임 인스턴스 블루프린트

image

  • Show Game Play Main Widget 함수
    • isShow 파라미터가 True 이면 “GamePlayMain” 위젯 블루프린트를 뷰포트에 띄우고
    • isShow 파라미터가 False 이면 “GamePlayMain” 위젯 블루프린트를 뷰포트에서 내린다.
    • “GamePlayMain” 위젯 블루프린트가 싱글톤으로 관리될 수 있도록 한다.
      • “GamePlayMain” 참조 타입의 GamePlayMainWidjet 변수가 유효하지 않다면 생성하고 이에 할당하고, 이 변수가 유효하다면 생성하지 않음

🚩 Stage 1 레벨 블루프린트

image

Stage 1 레벨이 활성화 되면 “SideScrollGameInstance” 게임 인스턴스의 Show Game Play Main Widget 함수를 실행하여 “GamePlayMain” 위젯 블루프린트를 화면에 띄운다. isShow 를 True 로 넘긴다. Stage 1 레벨이 불러와질 때 “GamePlayMain” 위젯이 자동으로 뷰포트에 띄워질 것이고 Stage 1 레벨이 비활성화 되고 다른 레벨이 될 땐 자동으로 “GamePlayMain” 위젯이 꺼지게 될 것이다.


🚖 HP 를 HP Bar UI 에 적용시키기.

🚩 “GamePlayMain” 위젯 블루프린트 이벤트 그래프

image

  • Update_HeroHPBar 라는 함수를 만들었다.
    • 파라미터는 float 의 HPMaxHP
    • HP/MaxHP 에 해당하는 값을 ProgressBar_HP 에 적용시켜 해당 값만큼 채워지게 할 것이다.
  • Progress Bar
    • Set Percent
      • Progress Bar UI 의 값을 설정한다.
      • 이 설정된 값만큼 Progress Bar UI에 채워지게 된다.
      • 최대 값은 1.0 이며 0.0 ~ 1.0 에 해당하는 값이 들어와야 한다.

🚩 플레이어 블루프린트 이벤트 그래프

image

image

  • 게임이 시작 되면 BeginPlay
    • SideScrollGameInsRef 변수에 “SideScrollGameInstance” 게임 인스턴스 블루프린트 가져오기
      • “GamePlayMain” 위젯 블루프린트가 할당 되어 있는 여기의 GamePlayMainWidjet 변수를 가져와야 변경된 플레이어의 HP 를 HP Bar UI 에도 적용시킬 수 있기 때문에.
    • Update_HeroHPBar 함수 실행 하여 현재 HP 를 MaxHP 로 설정
      • 플레이어가 죽고 게임을 다시 시작해도 HP Bar 가 다시 원래대로 복귀하지 않길래 추가해보았다.

image

  • 공격을 받아서 플레이어의 HP 가 바뀌면
    • “SideScrollGameInstance” 게임 인스턴스의 “GamePlayMain” 위젯 블루프린트가 할당 되어 있는 GamePlayMainWidjet 변수로부터 Update_HeroHPBar 함수 실행
    • HP, MaxHP 연결

image



🌜 개인 공부 기록용 블로그입니다. 오류나 틀린 부분이 있을 경우 
언제든지 댓글 혹은 메일로 지적해주시면 감사하겠습니다! 😄

맨 위로 이동하기

UE4 Lesson 1 카테고리 내 다른 글 보러가기

댓글 남기기