본문 바로가기

언리얼

언리얼 엔진5로 umg 구현하기(5) : umg 배치하기(2)

 영역2 

캔버스 앵커를 오른쪽 위로 설정하고 Alignment(얼라인먼트) x값을 1로 설정해 영역을 설정합니다.

Horizontal Box를 넣고 각 아이콘을 오버레이로 묶습니다. 여기서도 추후 업데이트를 고려하여 'size to content'를 체크해줍니다.

시안에서 볼때 알림 뱃지가 붙어있는데 이것은 모든 아이콘에 해당됩니다. 그래서 이 알림 뱃지를 공통화해주어야 합니다.

시안

뱃지 이미지는 평소에는 꺼져있다가 어떠한 변화가 생기면 나타나는 이미지입니다. 그래서 이미지에 변수 체크를 해주고 평소에는 꺼져있다가 변화가 생길때 나타나게 해주기 위해 이미지의 Visibility(비지빌리티)는 Collapsed(컬랩스)로 설정해줍니다.

여기서 프로그래머분들에게 이미지가 켜질때는 hit-Testable(힛테스터블)로 해달라는 코멘트를 남겨줍니다.

또한, 공통화를 하는김에 버튼도 공통화를 시켜주면 좋습니다.

그리고 다시 메인씬에 돌아와서 원래 배치해둔 버튼을 지우고 방금 만든 bp를 배치해줍니다.

 

다음은 지도 관련 아이콘입니다.

영역1때 사용했던 bp_Bar 위젯을 열어 버튼도 공통화를 해줍니다.

비활성화 아이콘 이미지는 알파값을 0.3으로 조정해줍니다

여기서도 아이콘의 이미지에 비활성화/활성화가 있으므로 widget switcher로 묶어주겠습니다.

맨 아래 던전 아이콘은 현재 시안에서 볼 때, 레벨 제한때문에 선택의 여지가 없으므로 일단 스킵해두겠습니다.

이번에는 미니맵을 만들어보겠습니다.

미니맵 이미지는 이미지만으로 되는 것이 아니기에 변수 체크를 합니다.

현재 접속해 있는 채널을 표시해주는 이미지와 텍스트를 추가해줍니다.

여기서 '채널'은 스태틱이고 숫자'7'은 변수이므로 변수체크를 7에 해줍니다.

적 위치를 나타내는 아이콘은 아래와 같이 공통화를 해줍니다.

투명한 아이콘은 다른 층에 있는 것을 의미하고 빨간색 아이콘은 보스를 의미합니다.

위젯 이름을 달리 설정해 구분을 해준뒤 투명 아이콘은 알파값을 0.5로 설정하고 빨간색은 시안을 스포이드 찍어 색깔값을 적용해줍니다.

색깔
투명

현재 유저의 위치를 나타내는 이미지는 변수 체크를 하고 마무리합니다.

 

 

To be continued.....