GameDevelop/UnrealEngine

UnrealEngine - 변수 UI에 붙이기 (블루 프린트 사용)

Une_ 2024. 9. 14. 02:10

오늘은 언리얼 엔진에서 UI를 만들어서 붙여보려고 합니다.

(ChatGPT의 도움을 받으며 진행했습니다.)

 

내가 보유한 총알 갯수를 띄워보겠습니다.

 

 

 

언리얼 엔진에서 UI(사용자 인터페이스)를 만들기 위해서는 UMG (Unreal Motion Graphics)라는 언리얼 엔진의 UI 툴킷을 사용합니다.

 

우측 하단의 '콘텐츠 드로어' 버튼으로 컨텐츠 브라우저를 열어줍니다.

 

 

이제 '콘텐츠 브라우저'에서 우클릭을 한 뒤, '유저 인터페이스' -> '위젯 블루프린트'를 클릭해줍니다.

 

 

'사용자 위젯' 클릭하여 '새 위젯 블루프린트'를 만들어줍니다.

 

 

저는 총알 남은 갯수를 표시해줄 거라서 AmmoWidget으로 이름을 지었습니다.

 

 

이제 더블 클릭하여 UMG 에디터를 열어줍니다.

 

 

Text 위젯을 드래그 앤 드롭하여 넣어줍니다.

 

 

저는 디테일 패널에서 3가지 정도 건드려봤습니다.

 

텍스트 위젯의 이름 변경해봤구요,

 

기본 텍스트를 'Ammo : 0'으로 했습니다.

 

그리고 폰트 크기를 좀 키워봤습니다.

 

 

이제 텍스트 바인딩을 위해 바인딩 생성 버튼을 눌러줍니다.

 

 

그러면 창이 디자이너에서 그래프 탭으로 넘어가게 되고,

아까 위젯 이름 변경한 거에 맞춰서 'GetAmmoLabelText' 라는 함수가 블루프린트 그래프에 생성됩니다.

 

 

저는 AUE_CppCharacter.cpp 에서 현재 AmmoCount를 가진 변수를 들고 있게 해놨고

이걸 UI에 연결할겁니다.

 

 

  • Get Player Character → 플레이어가 사용하는 캐릭터를 가져옵니다.
  • Cast To AYourGameCharacter → 캐릭터를 우리가 만든 캐릭터 클래스(AYourGameCharacter)로 캐스팅합니다.
  • Get CurrentAmmo → 캐릭터의 CurrentAmmo 값을 가져옵니다.
  • Set Text (AmmoText) → UI 위젯의 텍스트 블록에 CurrentAmmo 값을 표시합니다.

 

 

위처럼 하면 'Ammo :' 텍스트는 안나오기 때문에 아래와 같이 추가해줬습니다.

 

 

 

 

이제 위젯을 띄우기 위해 레벨 블루프린트를 열어줍니다.

레벨 블루프린트에서 위젯을 띄워달라고 세팅할겁니다.

 

레벨 블루프린트에서 우클릭하여 EventBeginPlay 노드를 추가해줍니다.

Event Begin Play 노드는 게임이 시작될 때 실행되는 이벤트입니다. 이 노드를 사용해 게임이 시작되면 위젯을 생성하고 화면에 추가할 수 있습니다.

 

이제 같은 방식으로 Create Widget을 선택해 노드를 추가해줍니다.

Create Widget 노드는 UI 위젯을 인스턴스화(생성)하는 데 사용됩니다.

 

Class 하단에 드롭다운 버튼 누르셔서 아까 생성했던 위젯인 AmmoWidget을 연결해줍니다.

 

 

 

Create Widget 노드의 Return Value 핀을 끌어서 Add to Viewport 노드를 추가합니다.

Add to Viewport는 생성된 위젯을 게임 화면에 추가하는 노드입니다. 이로써 위젯이 플레이어 화면에 표시됩니다.

 

 

 

아.. 깜빡했는데 EventBeginPlay와 CreateWidget을 연결해줘야 합니다.

연결해주고.. 컴파일, 세이브 해줍니다.

 

 

 

 

결과 :

 

 

 

 

다음엔 블루프린트 대신 C++ 을 주로 사용하여 연결을 해보겠습니다.

 

 

 

 

 

여담)

C++ 수정한 내용을 적용하려고 라이브 코딩을 쓰는데..

이게 버그가 좀 있는건지 에디터 킬 때마다 수정된 내용을 인식을 못해서 컴파일 에러가 나네요.

라이브 코딩 한번씩 눌러줘야 인식을 하네요.

 

에디터 플레이도 라이브 코딩으로 적용한 내용 때문인지 잘 안되고;;

F5로 디버깅 모드로 플레이해야 정상 동작하네요.

 

이게 제가 아직 미숙해서 비정상적으로 작업을 한건지.. 아니면 라이브 코딩 버그인지는 잘 모르겠습니다 ㅠㅠ

아무튼간 저걸로 꽤나 시간을 뺏겨서 아쉬웠네요.