내일배움캠프 Unity - TIL : 25.04.09

오늘 학습한 내용

1) ScrollRect 안의 UI 요소가 마우스 입력을 독점하여 스크롤이 되지 않는 문제 해결

ScrollView 안에 버튼이나 이미지 등 상호작용 가능한 UI가 있을 경우 드래그 시 ScrollRect가 아닌 해당 UI가 입력을 가져가 스크롤이 작동하지 않는 문제를 해결했습니다.

---

문제 및 해결 과정

1) 문제 (ScrollRect 내부 UI 요소가 마우스 입력을 가로채는 문제)

ScrollRect 안에 버튼, 이미지 등의 UI 요소가 있을 경우, 드래그를 시도하면 해당 요소가 마우스 입력을 우선 처리하게 되어 ScrollRect가 드래그 이벤트를 받지 못하는 문제가 발생했습니다. 이로 인해 스크롤이 동작하지 않고 UI가 고정된 것처럼 보이는 현상이 나타났습니다.

 

시도한 해결 방법

ScrollRect 바깥쪽에 마우스 드래그 이벤트를 중계하는 스크립트를 작성하여, 내부 UI가 마우스 이벤트를 독점해도 ScrollRect가 정상적으로 작동하도록 처리했습니다.

using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;

public class ScrollRectEventPasser : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler
{
    public ScrollRect scrollRect;

    public void OnBeginDrag(PointerEventData eventData)
    {
        scrollRect.OnBeginDrag(eventData);
    }

    public void OnDrag(PointerEventData eventData)
    {
        scrollRect.OnDrag(eventData);
    }

    public void OnEndDrag(PointerEventData eventData)
    {
        scrollRect.OnEndDrag(eventData);
    }
}

 

결과

스크롤뷰 안의 버튼이나 이미지 등 상호작용 가능한 UI 요소들이 마우스 이벤트를 받아도, ScrollRect가 정상적으로 드래그를 인식하여 스크롤이 가능해졌습니다.

---

새롭게 알게 된 점

유니티에서 ScrollRect 안에 버튼 등의 UI 요소가 있을 때, 사용자가 드래그를 시도하면 ScrollRect가 아닌 해당 UI 요소가 이벤트를 가로채는 문제가 발생할 수 있습니다.
이런 경우, 이벤트를 수동으로 ScrollRect에 전달하는 방식으로 문제를 해결할 수 있다는 점을 배웠습니다.
유저 인터페이스 상호작용을 유연하게 처리하기 위해서는 EventSystem 인터페이스의 이해가 필수적이라는 점도 알게 되었습니다.