Unreal Engine 5 배워보기 - 47일차

컴퓨터 및 게임 관련 전공인이 아닌 문외한 일반인이 언리얼 엔진을 배우면서 정리한 내용입니다.

그날그날 배웠던 내용을 제가 나중에 보기 위해 정리한 것으로, 지금 당장 보기에 부족한 점이 아주아주 많고 추후에 수정이 될 수도 있습니다.

오탈자 및 잘못 기재된 내용 지적, 부족한 내용 설명은 언제든지 환영입니다.

 

본글은 언리얼 엔진 5.5.4 버전 영문판을 기준으로 합니다.

 

----------------------------------------------------------------------------------------------------------------

 

47일차 학습 내용

- 비밀번호 입력으로 열리는 문

- Inventory

 

 

비밀번호 입력으로 열리는 문

이번에는 BP를 활용하여 비밀번호 입력 시 열리는 문을 한번 제작해보도록 하겠다.

우선은 사용했던 문의 액터 BP로 가서 "Physics Constraint" 를 없애주고, 문의 "Simulate Physics" 를 비활성화 시켜준다.

그리고 위 그림과 같이 문에 비밀번호를 입력할 수 있는 기능을 알려주는 스위치 비슷한 오브젝트를 하나 추가해준다.

비밀번호를 입력하려면 Widget을 하나 띄워야하기에, 새로운 WBP를 생성해준다.

Widget을 띄웠을 때 비밀번호 입력창의 뒷배경으로 할 Image를 검은색으로 설정하여 배치해주고, 그 뒤에 주위 배경을 흐리게 할 "Background Blur" 를 추가해준다.

비밀번호를 입력할 창을 만들기 위해 위 그림과 같이 "Grid Panel" 배치 후 그 위에 "Button" 을 배치해주고, "Button" 에 숫자를 입력해준다.

배치한 모든 Button에 입력하는 기능을 추가해줄 것이기에, 모든 Button의 우측 상단에 있는 "is Variable" 을 체크해줘야한다.

맨 아래에 있는 빈칸은 "Text Box" 인데, "Text Box" 에서 입력한 비밀번호가 무엇인지 확인할 수 있도록 해줄 것이다.

"Graph" 탭으로 이동하여 각 버튼 별로 눌렀을 때 실행할 이벤트를 생성해주기 위해, 각 버튼 별로 좌측 하단의 "On Clicked" 를 눌러 노드를 생성해준다.

위 그림과 같이 String 형식의 변수를 2개 생성해준다.

하나는 현재 입력하고 있는 비밀번호를 표시할 String이고, 다른 하나는 문이 열리도록 설정한 비밀번호의 String이다.

그리고 위 그림과 같이 노드를 연결해준다.

"Append" 노드를 통해 각 버튼 별로 "Text Box" 에 출력할 숫자를 정해준 것이다.

"Del Button" 에는 "Text Box" 에 입력된 수치를 초기화 시켜주는 기능을 넣어주었고, "Ent Button" 에서 입력된 비밀번호와 설정한 비밀번호가 맞는지 확인하기 위한 기능을 넣어주었다.

입력한 비밀번호와 설정한 비밀번호가 일치할 경우 문이 열리도록 해주었고, 일치하지 않을 경우에는 소리가 나며 1초 뒤 입력한 비밀번호를 초기화 시켜주었다.

"Remove from Parent" 노드 앞에 따로 연결해줘야함

비밀번호 호출을 할 Custom Event를 위 그림과 같이 생성해주었다.

"PasswordKey" 라는 Event를 호출하면 화면에 Widget을 생성하고 UI 모드로 변환하며 마우스 커서를 보이게 해줬고, 그러지 않을 경우에는 화면에서 Widget을 제거하면서 일반 게임 모드로 변환하며 마우스 커서를 다시 숨기게 해줬다.

그리고 코드를 아래와 같이 추가로 작성해준다.

PlayerControl.cpp

void APlayerCharacterControll::Operate()
{
 
.
.
.
 
        if (name == TEXT("WeaponPistol"))
        {
            IsWeaponMap[EWeaponType::Pistol] = true;
        }
        
.
.
.
 
        else if (name == TEXT("Door1")) // 추가
        {
            AActor* Actor = HitResult.GetActor();
            UFunction* PasswordKey = Actor->FindFunction(FName("PasswordKey")); // Actor 내의 "PasswordKey" 라는 함수를 검색
            if (PasswordKey)
            {
                Actor->ProcessEvent(PasswordKey, nullptr); // Actor 내의 "PasswordKey" 라는 함수를 실행
            }
            return;
        }
 
.
.
.
 
}

"Operate" 키를 눌러 문 앞의 스위치의 Collision을 인식하면 "PasswordKey" 함수를 호출해 실행시키도록 해주는 코드이다.

게임을 실행하고 아래 움짤과 같이 일치하는 비밀번호를 입력했을 경우, 문이 열리면서 Widget이 사라지게 된다.

* 아래 그림과 같이 WBP에서 문이 열린 후에 Widget이 사라지도록 설정해줄 수 있음

 

Inventory

인벤토리는 대형 게임사에서도 필요하지 않으면 넣지 않을 정도로 번거롭고 어려운 기능이다.

인벤토리의 동작 알고리즘을 간략하게 정리하면 아래와 같다.

캐릭터의 인벤토리 키를 눌러 인벤토리 창 (UI) 이 열려야함
// 인벤토리가 열리면서 게임을 일시정지시킬 것인지, 실행 중 상태로 둘 것인지 결정

인벤토리 칸에 아이템 존재 여부 확인 + 아이템 이미지 및 마우스 커서 표시

인벤토리로 옮길 아이템을 클릭 시 아이템 이미지가 마우스를 따라가도록 설정

아이템을 놓을 인벤토리 칸이 비어있는지 여부 및 같은 아이템인지 확인

비어있을 경우 아이템 이미지가 생성되면서 추가 / 같은 아이템일 경우 수량 증가 / 다른 아이템일 경우 추가 불가능

위 알고리즘을 바탕으로 정말 간단하고 간략하게 인벤토리 기능을 한번 제작해보도록 하겠다.

우선은 WBP를 4개 생성해준다.

인벤토리에서 표시할 아이템 WBP, 아이템을 인벤토리로 드래그할 때 표시할 WBP, 착용 중인 아이템을 표시할 UI WBP, 인벤토리 UI WBP 이렇게 4종류이다.

인벤토리에서 표시할 아이템 WBP, 아이템을 인벤토리로 드래그할 때 표시할 WBP는 위 그림과 같이 Image만 넣으면 되기에 크게 어려운 점은 없다.

착용 중인 아이템을 표시할 WBP도 위 그림과 같이 Image만 한 장 놓아주면 되고, 우측 상단의 "Is Variable" 을 체크해준다.

일단은 사용할 인벤토리의 칸 수를 3칸으로 간단하게 3칸으로 할 것이기에, 위 그림과 같이 인벤토리 UI WBP에 3개의 아이템 WBP를 배치해준다.

위 그림과 같이 "Size" 를 'Fill' 로 설정해주고, "Allignment" 도 상하좌우 꽉 채워주는 것으로 설정해주면, 인벤토리 칸에 딱 맞게 차게 된다.

그리고 착용 중인 아이템을 표시할 WBP를 위 그림과 같이 인벤토리 UI WBP 하단에 배치해준다.

아이템을 마우스로 클릭한 뒤 드래그를 해야하는 과정이 있기에, 아이템 WBP에서 추가적인 코드가 필요하다.

아이템 WBP에서 "Graph" 탭으로 넘어가 Function의 "Override" 에서 "Mouse" 를 검색해주면, 마우스 클릭과 관련된 이벤트 노드들을 생성할 수 있다.

우선은 아이템을 클릭한다는 명령이 있어야하기에, "On Mouse Button Down" 노드를 생성해준다.

그리고 위 그림과 같이 노드들을 연결해줘서, 마우스 좌클릭을 하면 시작되는 이벤트 BP를 생성해주면 된다.

마우스 클릭으로 아이템을 가져갔으면 이번엔 드래그를 통해 이동시켜야하므로, 이번엔 드래그와 관련된 이벤트를 생성해줘야한다.

'Tag' 라는 이름의 String 형식의 변수를 생성하고, "On Drag Detected" 노드를 생성한 뒤 위 그림과 같이 연결해준다.

마우스를 드래그하면 아이템을 인벤토리로 드래그할 때 표시할 WBP 중 'Tag' 에 들어간 변수와 동일한 이름을 가진 이미지의 Widget을 생성해주는 BP이다.

연결한 Tag의 변수에서 위 그림과 같이 "Instance Editable" 과 "Expose-on Spawn" 을 활성화시켜준다.

활성화해주고 인벤토리 UI WBP로 돌아가면, 위 그림과 같이 인벤토리에 배치된 아이템에 'Tag' 변수가 생성된 것을 확인할 수 있고, 해당 'Tag' 에 아이템의 이름을 기입해주면 된다.

위 사진에서는 DT를 만들지 않아 기본적으로 제공하는 임의의 DT를 삽입하였음

착용 중인 아이템을 표시할 WBP는 위 그림과 같이 노드들을 연결해주면 된다.

위 그림의 노드를 보면 알겠지만, 인벤토리를 사용하려면 반드시 인벤토리에 들어갈 아이템들의 정보들을 관리할 "Data Table (이하 DT라 칭함)" 이 필수로 있어야한다.