5. 마무리

드래그 위젯 환경설정, 메인 HUD 에 표시 및 테스트용 Health Bar 를 추가하여 마무리하도록 합니다.

Windows
MacOS
Linux
이 페이지의 내용:

이번 최종 단계에서는, (드래그중인 비주얼 위젯) DragWidget 구성을 하겠습니다. 그리고 캐릭터 블루프린트에게 HUD 위젯 블루프린트를 뷰포트에 추가하고 마우스 커서를 활성화시켜 드래그 위치를 확인할 수 있도록 해주겠습니다.

단계

  1. DragWidget 위젯 블루프린트를 열고 Canvas PanelSize Box 로 대체하고 자손 Border 설정을 합니다.

  2. SizeBox 이름을 WidgetSize 로 변경하고 isVariable 을 true 로 설정한 뒤, Width OverrideHeight Override 를 체크합니다.

    UpdateDragDrop3.png

    Size Box 의 Width 와 Height 를 Health Bar 위젯의 크기에 맞게 설정하도록 하겠습니다.

  3. Border 의 경우, Brush ColorBlack 으로, Alpha0.5 로 하여 약간 반투명하게 만듭니다.

    UpdateDragDrop4.png

    우리 예제에서 드래그 비주얼로는 Health Bar 의 실루엣을 사용하면서 실제 Health Bar 는 같은 위치에 유지합니다.

  4. 그래프 에서 Widget Reference 를 끌어 놓고 Event Construct 에서 HealthBar 에 형변환한 뒤 Desired SizeBreak Vector 를 구합니다.

    UpdateDragDrop5.png

    그러면 Size Box 에 설정할 수 있는 Health Bar 크기가 나옵니다. 오버라이드를 수동 입력할 수도 있지만, 그랬다면 Health Bar 크기 변경 시 여기서도 변경해 줘야 할 것입니다.

  5. Widget Size 를 끌어 놓은 뒤 거기서 Set Height OverrideSet Width Override 를 추가하고 아래와 같이 연결합니다.

    클릭하면 원본을 확인합니다.

  6. 콘텐츠 브라우저 에서 Content/ThirdPersonBP/Blueprints 아래 ThirdPersonCharacter 블루프린트를 엽니다.

  7. Event Begin Play 에서 Create Widget 를 추가( 및 HUD 로 설정)한 뒤, Add to Viewport 하고, Get Player ControllerShow Mouse Cursor 로 설정합니다. DragDrop19.png

  8. 컴파일, 저장플레이 버튼을 클릭하여 에디터에서 플레이합니다.

최종 결과

에디터에서 플레이 후, 화면에서 Health Bar 를 좌클릭 드래그 후 새 위치에 드롭합니다.

이는 드래그 앤 드롭 프로세스를 시작하는 데 필요한 엘리먼트 예제일 뿐입니다. 플레이어가 위젯을 세이프 존 외부 혹은 다른 위젯 위에 드래그하지는 않았나 추가적인 확인이 필요할 수 있습니다.

Welcome to the new Unreal Engine 4 Documentation site!

We're working on lots of new features including a feedback system so you can tell us how we are doing. It's not quite ready for use in the wild yet, so head over to the Documentation Feedback forum to tell us about this page or call out any issues you are encountering in the meantime.

We'll be sure to let you know when the new system is up and running.

Post Feedback