Minimap 만들기 (고비용 버전)
3인칭 프로젝트 템플릿을 이용하여 프로젝트를 생성한다
3인칭 캐릭터 블루프린트 에디터를 연다
CapsuleComponent 에 SpringArm 컴포넌트 추가
추가된 SpringArm 컴포넌트를 Y축 중심으로 -90도 회전하여 수직으로 세운다
SpringArm에 SceneCaptureComponent2D를 추가하고 이름을 SceneCapture 등으로 변경한다
- 위와같이 하면 SpringArm이 수직으로 세워져 있는 끝에 SceneCapture가 연결되므로 수직으로 내려다보면서 장면을 캡쳐하게 된다. 매 프레임마다 캡쳐하여 미맵을 그려야 하므로 성능에 좋지 못한 영향을 가진다
미니맵이 그려질 애셋(RenderTarget)을 CB에 생성한다
CB에서 > Add New > Materials & Textures > RenderTarget 선택
- RenderTarget은 일반적인 Texture2D 와 같은 이미지로 사용할 수 있다
생성된 RenderTarget의 이름을 Minimap_Render_Target 등으로 변경
SceneCapture 에 RenderTarget 를 연결한다
SceneCapture 선택 > 디테일 뷰 > Scene Capture > Texture Target > 위에서 생성한 Minimap_Render_Target 지정
컴파일 > 저장 > 캐릭터 블루프린트 에디터를 닫는다
RenderTarget의 머티리얼 생성
CB에 있는 Minimap_Render_Target > 마우스 우측 > Create Material
생성된 머티리얼을 더블클릭하여 에디터를 연다
머티리얼 노드 선택 > 왼쪽 속성창에서 > Material > Material Domain > User Interface 로 변경
저장 > 에디터를 닫는다
위젯블루프린트를 생성하여 스크린에 미니맵 이미지를 설정한다
팔레트에서 Image 위젯을 드래그하여 Canvas 위에 놓고 256x256 크기로 설정 > 선택 > 디테일뷰 > Appearance > Brush > Image > 위에서 생성한 머티리얼 지정 > 저장 > 에디터 닫는다
레벨블루프린트에서 위젯을 스크린에 보이도록 설정한다
Create Widget노드에 위에서 생성한 위젯블루프린트를 지정하고 Add To Viewport 노드를 연결한다
저장 > 에디터를 닫는다 > 실행하여 미니맵이 스크린에 나타나는지 확인한다
3인칭 캐릭터 블루프린트를 열고 SpringArm을 선택하고 디테일뷰에서 Camera Settings > Inherit Pitch, Yaw, Roll 모든 항목 체크해제
Scene Capture 컴포넌트 선택 > 디테일뷰 > Projection > Project Type > Orthographic,
위와 같은 항목 내에서 Orth Width > 2000 정도로 지정한다
컴파일 > 저장 > 에디터를 닫고 > 게임을 실행하여 오쏘 그래픽 효과를 테스트한다
캐릭터를 대체할 스프라이트 이미지를 설정한다
3인칭 캐릭터 블루프린트를 열고 Scene Capture 컴포넌트 선택 > 디테일 뷰 > Scene Capture 하단 확장> General Show Flags(일반표시플래그) > Skeletal Meshes 선택해제
- 위와 같이 설정하면 미니맵에서 캐릭터는 보이지 않게 된다. 대신 조그만 스프라이트 이미지를 보여주면 된다
캐릭터 위치를 나타낼 이미지를 CB 안으로 임포트한다
이미지 위에서 마우스 우측 > Sprite Actions > Create Sprite
3인칭 캐릭터 블루프린트에서 SpringArm 컴포넌트 아래에 Paper Sprite 컴포넌트 추가 > 선택 > 디테일뷰 > Sprite > Source Sprite > 위에서 생성한 스프라이트 이미지를 지정
추가된 스프라이트 컴포넌트를 적당히 회전하여 캐릭터 X와 스프라이트의 X 방향이 일치하도록 조정한다
PaperSprite 컴포넌트가 CapsuleComponent의 하위에 오도록 계층구조를 변경한다
게임을 실행하여 캐릭터의 머리 위에 스프라이트가 보이는지 확인한다
컴파일 > 저장 > 실행 테스트
캐릭터에게는 스프라이트가 보이지 않도록 설정한다
3인칭 캐릭터 블루프린트를 열고 > PaperSprite 컴포넌트 선택 > 디테일뷰 > Rendering 하단 확장 > Owner No See 항목 체크 > 컴파일 > 저장
게임실행 테스트
Minimap 만들기 2 ( 저비용 버전 )
맵의 전체 폭을 구한다(레벨 에디터에서 줌아웃하고 와이어프레임 모드에서 레벨의 좌우 끝까지 길이를 구함, 마우스 중앙버튼을 누르고 드래그하면 선의 크기가 표시됨)
World Outliner에서 Floor 를 선택하고 레벨블루프린트에서 Floor-->GetBounds노드를 사용하여 위치와 크기를 동시에 구해볼 수도 있다
레벨의 중앙에 큐브액터를 추가한다
큐브액터에 SpringArm 컴포넌트를 추가하고 수직으로 세운다
SpringArm 컴포넌트 안에 SceneCaptureCompnent2D 컴포넌트 추가
위에서 생성된 SceneCaptureComponent2D 컴포넌트를 선택 > 디테일뷰 > Projection > Projectin Type : Orthographic, Ortho Width: 레벨의 전체 폭 입력
CB에서 마우스 우측 > 머티리얼&텍스쳐 > Render Target 애셋을 생성
SceneCaptureComponent2D 컴포넌트를 선택 > Scene Capture / Texture Target 항목에 위에서 생성한 렌더타겟을 설정
컴파일 > 저장
CB에서 Render Target 마우스 우측 > 애셋액션 > 엑스포트 > 저장 (HDR 포맷)
HDR 파일을 포토샵으로 열고 이미지 전체선택 > 복사
그림판 열고 > 붙여넣기 > 다른 이름으로 저장 > PNG 포맷으로 저장
이렇게 작성된 배경 이미지를 CB안으로 임포트한다
큐브액터는 더 이상 필요 없으므로 레벨에서 삭제한다
미니맵을 포함할 최상위 위젯(MainWidget) 생성
- Canvas Panel 이 화면 전체를 채우도록 설정
미니맵을 표현할 MinimapWidget 생성
- Canvas Panel [변수인지] 체크
- Canvas Panel 크기를 커스텀으로 설정(X:300, Y:300)정도
- Canvas Panel 위에 Image 위젯을 드래그하여 놓고 크기를 300, 300 설정
- Image 선택 > Appearance > Brush > Image 항목에 위에서 생성한 배경 이미지를 지정
- 저장 > 에디터를 닫는다
- MainWidget의 팔레트에서 MinimapWidget을 드래그하여 적당한 위치에 놓는다
- MinimapWidget [변수인지]에 체크
플레이어 캐릭터의 아이콘으로 사용할 위젯(IconWidget) 생성
- Canvas Panel을 삭제하고 Image 위젯을 드래그하여 놓는다
- Image 선택 > [변수인지]에 체크
- Image의 크기를 32 x 32 정도의 크기로 설정
- Image 선택 > Appearance > Brush > Image 항목에 플레이어 아이콘으로 사용할 이미지 지정
- 저장 > 에디터를 닫는다
플레이어 캐릭터 클래스에서 MainWidget을 생성하고 변수에 저장한다
- Create Widget 노드 -->(변수에 저장)--> Add to Viewport
- IconWidget 를 생성한다
- 현재 플레이어의 위치를 미니맵의 위치로 환산하여 그 위치에 IconWidget 를 위치시킨다
- 주기적으로 플레이어의 위치를 미니맵의 위치로 환산하여 IconWidget위치를 변경한다
미니맵 안에서의 아이콘 위치를 지정할 때는 일반 이미지처럼 미니맵의 좌상단 모서리가 원점이 된다
언리얼 뷰포트에서는 전방(x증가), 후방(x감소), 좌측(y감소), 우측(y증가) 이므로 좌표변환시 주의해야 한다
GetActorBounds 함수노드를 사용하여 Floor 의 위치와 전체 크기(폭, 길이)를 구하는 예
3인칭 캐릭터의 아이콘을 미니맵에 표시하는 예
위에서 설정한 타이머에 의해서 호출되는 UpdateFunction 함수
AI 캐릭터에서 아이콘을 미니맵에 표시하는 경우
위에서 설정한 타이머에 의해서 주기적으로 호출되는 UpdateFunction
위에서 사용된 4개의 위젯
WG_MainWidget
WG_Minimap
WG_PlayerIcon
WG_NPC_Icon
미니맵 실행 테스트
사용된 아이콘
