위젯 마우스 호버 무시하도록 설정하기

개요

🕹️ 위젯에 마우스를 올렸을 시 호버 이벤트가 적용되지 않게 설정하자.

언리얼에서 위젯을 사용해 버튼을 제작할 시 기본 텍스트 옵션이 없다.
이때, 텍스트 위젯을 추가로 버튼 위에 올려야 한다.

그러면 텍스트의 영역만큼 버튼을 가려서 UX가 상당히 불편해진다.

본론

---

🕹️ Not Hit-Testable 옵션

아래와 같은 구조로 버튼과 텍스트를 넣은 위젯을 만들었습니다.

이미지와 텍스트를 설정해주었습니다.
추가로 변화를 볼 수 있게 Hover와 Presssed도 세팅했습니다.

하지만, 실행하여 동작을 확인해보면 텍스트의 영역에 마우스가 올라가면 Hover와 Presssed 이벤트가 발생하지 않는 것을 볼 수 있습니다.

이는 텍스트가 버튼위에 있기 때문에 마우스 이벤트를 영역만큼 먹어 버리기 때문입니다.

해결책

이를 해결할 옵션이 Visibility 옵션의 Not Hit-Testble 속성입니다.
이 옵션을 설정하면 해당 위젯은 화면에 보이지만, 마우스 입력을 무시합니다.

즉, HitTest를 수행할 때 마우스 이벤트를 전달하지 않습니다.
따라서 마우스가 해당 위젯 위에 있어도 다른 위젯에 이벤트가 전달될 수 있습니다.

여기서 Self Only는 옵션을 설정한 자기 자신만을 무시하게 하는 것이고,
Self & All Children은 해당 위젯 하위에 있는 다른 모든 위젯도 무시하도록 설정합니다.

패널에 해당하는 위젯이였다면 Self & All Children으로 설정해주었겠지만,
텍스트 위젯은 어차피 하위 위젯을 넣을 수 없으니 Self Only로 설정해주겠습니다.

옵션을 변경한 후 다시 실행하여 동작을 확인해보겠습니다.
그러면 텍스트의 영역 위일지라도 텍스트는 무시하고 버튼을 인식하게 됩니다.

---

마무리

위젯을 또 하나 추가해서 설정해줘야 하는 번거로움이 있지만,
버튼의 기본 텍스트 기능보다는 독립적인 위젯 구조를 구성하는 것이 더 유연하고 세밀한 제어를 할 수 있어서 선호합니다.