언리얼 엔진/언리얼 엔진 활용

Unreal UI #6 - 기본 HUD 추가 & 새로운 UI 구현

로안님 2025. 3. 4. 17:45

Unreal Engine - 기본 HUD 추가 & 새로운 UI 구현


🌟 1. C++로 Custom HUD 추가 (조준선)

📅 작업 내용

  • C++ HUD 클래스를 생성하고, 조준선 구현
  • DrawRect() 함수를 이용하여 시간간 조준선 보이기
void ACustomHUD::DrawHUD()
{
    Super::DrawHUD();

    if (Canvas)
    {
        const float CenterX = Canvas->ClipX * 0.5f;
        const float CenterY = Canvas->ClipY * 0.5f;

        // 수직선 (Vertical Line)
        DrawRect(CrosshairColor, CenterX - Thickness * 0.5f, CenterY - LineSize * 0.5f, Thickness, LineSize);

        // 수평선 (Horizontal Line)
        DrawRect(CrosshairColor, CenterX - LineSize * 0.5f, CenterY - Thickness * 0.5f, LineSize, Thickness);
    }
}


🌟 2. Custom HUD + WBP_HUD 합쳐서 보이기 설정

📅 작업 내용

  • WBP_HUD도 같이 보이도록 설정
  • CreateWidget로 UI 개체화
  • AddToViewport() 함수를 이용하여 UI가 포스팅되도록 만들기


🌟 3. 게임 시작 버튼과 메뉴로 돌아가기 버튼에 페이드 효과 적용

📅 작업 내용

  • 페이드를 보이기 위해 WBP_FadeInOut 추가
  • PlayAnimation()을 이용하여 페이드 효과 구현
  • Event Construct를 이용하여 위젯 생성 시 자동으로 애니메이션 시작


🌟 4. WBP_HUD에서 UI 추가 (총기 정보, 진행상황, 적 정보, 플레이어 정보)

📅 작업 내용

  • 게임 현재 진행 상황 표시 (Wave, Time)
  • 현재 플레이어 레벨, 체력바 추가

 


🌟 5. 체력바 & 소진 체력바 색상 테스트 & 변경

📅 작업 내용

  • 체력,레벨 바 생성
  • 보이는 색 조정

 


🌟 6. WBP_FinalScore에 각 수치마다 호버 효과 적용

📅 작업  내용

  • 적용 효과: Hover 시 배경 색상 변경
  • On Hovered, On Unhovered 를 이용하여 구현
  • 각 버튼마다 각자의 영역에 호버 효과 적용

 

Unreal UI #1 - 버튼 호버 효과 및 설정

Unreal UI #2 - 최적화 및 해상도 테스트

Unreal UI #3 - 버튼 애니메이션 효과

Unreal UI #4 - UI 레이아웃 및 최적화 정리

Unreal UI #5 - 블러 및 페이드 효과 적용

Unreal UI #6 - 기본 HUD 추가 & 새로운 UI 구현

Unreal UI #7 - 전투 UI 개선: 부드러운 체력바, 히트마커, 데미지 텍스트 애니메이션

Unreal UI #8 - 데미지 텍스트 색상 · 위치 · 연속표시 문제 해결기

Unreal UI #9 - FPS 게임 감도 설정 시스템 구축기