Version: 2023.2
언어: 한국어
매니퓰레이터로 포인터 캡처
요소의 포커스 순서

이벤트 콜백 및 값 변경 처리

UI 툴킷의 이벤트는 HTML 이벤트와 유사합니다. 이벤트가 발생하면 UI 툴킷은 타겟 시각적 요소와 시각적 트리의 전파 경로에 있는 모든 요소에 이벤트를 전송합니다.

이벤트 처리 시퀀스는 다음과 같습니다.

  1. 루트 요소에서 이벤트 타겟까지의 요소에 대한 이벤트 콜백을 실행합니다. 이는 디스패치 프로세스의 트리클다운 단계입니다.
  2. 이벤트 타겟에서 루트까지의 요소에 대한 이벤트 콜백을 실행합니다. 이는 디스패치 프로세스의 버블업 단계입니다.

이벤트가 전파 경로를 따라 이동하면 Event.currentTarget 프로퍼티가 현재 이벤트를 처리하는 요소에 업데이트됩니다. 이벤트 콜백 함수 내에서:

  • Event.currentTarget은 콜백이 등록되는 시각적 요소입니다.
  • Event.target은 원본 이벤트가 발생하는 시각적 요소입니다.

자세한 내용은 디스패치 이벤트를 참조하십시오.

이벤트 콜백 등록

이벤트 콜백을 등록하면 기존 클래스의 개별 인스턴스 동작(예: 텍스트 레이블에 대한 마우스 클릭에 응답)을 커스터마이즈할 수 있습니다. 이벤트에 대한 콜백을 등록하려면 RegisterCallback() 메서드를 사용하여 콜백을 요소에 바로 등록합니다.

전파 경로를 따라 전달되는 각 요소(타겟 제외)는 다음과 같이 하나의 이벤트를 두 번 수신할 수 있습니다.

  • 트리클다운 단계에서 한 번
  • 버블업 단계에서 한 번

기본적으로, 등록된 콜백은 타겟 단계 및 버블업 단계 동안 실행됩니다.이러한 기본 동작은 부모 요소가 자식 요소 이후에 반응하도록 합니다.

그러나 부모 요소가 자식보다 먼저 반응하도록 하려면 다음과 같이 TrickleDown.TrickleDown 옵션으로 콜백을 등록합니다.

using UnityEngine;
using UnityEngine.UIElements;

...
VisualElement myElement = new VisualElement();

// Register a callback for the trickle-down phase.
myElement.RegisterCallback<PointerDownEvent>(MyCallback, TrickleDown.TrickleDown);
...

이는 디스패처에 타겟 단계와 트리클다운 단계에서 콜백을 실행하라고 알립니다.

특정 시각적 요소에 커스텀 동작을 추가하려면 다음과 같이 해당 요소에 이벤트 콜백을 등록합니다.

// Register a callback on a pointer down event
myElement.RegisterCallback<PointerDownEvent>(MyCallback);

콜백 함수의 서명은 다음과 같습니다.

void MyCallback(PointerDownEvent evt) { /* ... */ }

자식 요소가 이벤트를 처리하는 요소의 경우 콜백을 등록하려면 Q() 메서드를 사용하여 자식 요소를 찾고 해당 요소에 콜백을 등록합니다.

다음 예시에서는 슬라이더의 드래그 컨테이너 요소에 콜백을 등록하여 슬라이더의 포인터 업 이벤트를 처리합니다. 이 경우 슬라이더 자체가 아닌 드래그 컨테이너 요소에 콜백을 등록해야 합니다. 드래그 컨테이너가 포인터 다운 이벤트 동안 포인터를 캡처하여 다음 포인터 업 이벤트의 유일한 수신자로 만들기 때문입니다.

var dragContainer = slider.Q("unity-drag-container");
dragContainer.RegisterCallback<PointerUpEvent> ( evt => Debug.Log("PointerUpEvent"));

참고: 이벤트에 여러 콜백을 등록할 수 있습니다. 하지만 동일한 이벤트 및 전파 단계에 동일한 콜백 함수를 한 번만 등록할 수 있습니다.

VisualElement에서 콜백을 제거하려면 myElement.UnregisterCallback() 메서드를 호출하십시오.

이벤트 콜백에 커스텀 데이터 전송

콜백과 함께 커스텀 데이터를 이벤트로 전송할 수 있습니다. 커스텀 데이터를 부착하려면 호출을 연장하여 콜백을 등록해야 합니다.

다음 예시에서는 PointerDownEvent를 위한 콜백을 등록하고 콜백 함수로 커스텀 데이터를 보냅니다.

// Send user data along to the callback
myElement.RegisterCallback<PointerDownEvent, MyType>(MyCallbackWithData, myData);

콜백 함수의 서명은 다음과 같습니다.

void MyCallbackWithData(PointerDownEvent evt, MyType data) { /* ... */ }

컨트롤 값 관리

UI 컨트롤은 value 프로퍼티를 사용하여 내부 상태에 대한 데이터를 보유합니다. 예제:

  • ToggleToggle이 켜지거나 꺼질 때 변경되는 부울 값을 보유합니다.
  • IntegerField는 필드의 값을 보유하는 정수를 보유합니다.

컨트롤 값을 가져오려면 다음을 수행합니다.

  • 컨트롤에서 직접 값을 가져옵니다.int val = myIntegerField.value;. 컨트롤이 전송한 ChangeEvent를 수신하고 변경 사항이 발생하면 처리합니다.다음과 같이 콜백을 이벤트에 등록해야 합니다.

    //RegisterValueChangedCallback is a shortcut for RegisterCallback<ChangeEvent>.
    //It constrains the right type of T for any VisualElement that implements an
    //INotifyValueChange interface.
    myIntegerField.RegisterValueChangedCallback(OnIntegerFieldChange);
    

    콜백 함수의 서명은 다음과 같습니다.

    void OnIntegerFieldChange(ChangeEvent<int> evt) { /* ...*/ }
    

컨트롤 값을 변경하려면 다음을 수행합니다.

  • value 변수를 직접 변경합니다. myControl.value = myNewValue;. 이렇게 하면 새 ChangeEvent가 트리거됩니다.
  • myControl.SetValueWithoutNotify(myNewValue);를 사용합니다. 이는 새 ChangeEvent를 트리거하지 않습니다.

자세한 내용은 이벤트 변경을 참조하십시오.

추가 리소스

매니퓰레이터로 포인터 캡처
요소의 포커스 순서