언리얼 엔진

Unreal Engine - 위젯 드래그앤드롭 구현 중 OnMouseButtonDown 미작동 원인 분석

로안님 2025. 3. 30. 23:15

🎮 왜 OnMouseButtonDown을 사용하게 되었는가?

📌 목적: 블록을 "드래그 앤 드롭" 방식으로 조커 교체/배치를 구현하기 위해

  • 마우스로 블록을 클릭 → 드래그 → 다른 위치에 드롭 → 블록 교체
  • 이 동작을 위해서는 마우스 입력 감지 및 드래그 시작 트리거가 필요함

Unreal Engine에서는 위젯의 드래그 기능을 위해 OnMouseButtonDown() + DetectDragIfPressed() + OnDragDetected() 의 구조를 사용함


🐞 디버깅 과정 요약

⚠️ 문제: OnMouseButtonDown()이 호출되지 않음

구조:

[WBP_BlockSlot]
└ Canvas Panel (Root)
   └ Button (BlockButton)
       └ Text (숫자 텍스트)

초기 시도:

  • WBP_BlockSlot에 OnMouseButtonDown() 오버라이드 추가
  • Print String("Drag") 넣어 테스트 → 출력 안 됨

✅ 디버깅 시도

  1. Is Focusable = true 설정 → 여전히 호출 안 됨
  2. Set Focus(Self) 추가 → 로그에 경고("포커스를 받을 수 없음")
  3. Button → Not Hit-Testable (Self Only) 설정 → 여전히 무반응
  4. Canvas Panel 외에 다른 위젯으로 감싸보기

💡 결정적 단서

  • Button을 삭제하고 Border로 대체하니 → OnMouseButtonDown() 정상 작동

✅ 최종 결론

🔍 이유: Button은 자체적으로 마우스 입력을 소모(Consume)

  • Button은 내부적으로 클릭 이벤트(OnClicked, OnPressed)를 처리하며,
  • 마우스 이벤트를 부모 위젯(UserWidget)으로 전달하지 않음
  • OnMouseButtonDown()은 호출되지 않음

✅ 해결: Border 위젯으로 교체

  • Border는 입력 처리를 하지 않고 전달 가능
  • 드래그 감지에도 적합하며, 스타일 커스터마이징으로 버튼처럼 표현 가능

🧩 현재 구조 변경

[WBP_BlockSlot]
└ Canvas Panel (Root)
   └ Border (마우스 감지 + 드래그 시작)
       └ Text (블록 숫자 표시)
  • OnMouseButtonDown() 오버라이드 → DetectDragIfPressed() 호출
  • OnDragDetected()에서 Drag Visual 및 블록 데이터 전달 처리

✅ 요약

항목 내용

문제 Button이 마우스 이벤트를 독점하여 OnMouseButtonDown() 미호출
시도 Visibility, Focusable, Focus 처리 등 여러 시도 실패
해결 Button 제거, Border로 교체 후 정상 작동
결과 드래그앤드롭 로직 구축 가능해짐, 구조적으로도 깔끔해짐

 


 

💭 기술 회고: 내 추측은 무엇이 맞았고, 무엇이 빗나갔을까?

처음에는 이렇게 생각했다:

"Button이 내부적으로 클릭 이벤트를 처리하고 부모로 이벤트를 넘기지 않는다 라는 것은, 드래그 앤 드롭도 Button 내부 클릭 이벤트 만으로 구현하는 게 맞지 않을까?"

🔍 실제로 확인한 결과:

  • Button이 이벤트를 부모로 넘기지 않는다는 점은 정확히 맞음
  • 하지만 드래그 앤 드롭은 원래부터 DetectDragIfPressed()OnDragDetected() 흐름으로 구현되는 것이 공식적인 방식이었다는 점
  • 예전에는 OnPressed/OnReleased 방식으로 직접 드래그 비슷하게 구현하는 경우도 있었지만, 이는 구조적이지 않고 비공식적임

✅ 회고 요약:

  • 문제의 본질은 정확히 짚었지만, 원래 구조에 대한 해석은 과거 방식에 가깝게 접근했던 셈
  • 이번 디버깅을 통해 UE의 입력 처리 흐름과 공식 DragDrop 구조에 대해 확실히 이해하게 됨

👉 앞으로는 위젯 입력 구조를 정확히 이해하고, 구조적으로 설계된 방식에 맞춰 활용할 것!