Unity UI 패널 이벤트 가이드
이 문서는 Unity의 UI Toolkit에서 패널 이벤트를 관리하는 방법에 대한 설명입니다. 패널은 UI 계층 구조에서 가시적인 요소의 인스턴스를 나타내며, 이벤트를 처리하는 데 중요한 역할을 합니다. 여기서는 패널 이벤트를 어떻게 생성하고 활용할 수 있는지 살펴보겠습니다.
패널 이벤트란?
패널 이벤트는 UI 계층 구조 내의 시각적 요소와 패널 간의 관계가 변할 때 발생합니다. 예를 들어, 시각적 요소를 패널에 추가하거나 제거할 때 발생합니다.
- AttachToPanelEvent: 요소가 패널에 연결될 때 발생합니다.
- DetachFromPanelEvent: 요소가 패널에서 제거될 때 발생합니다.
패널 이벤트 기본 클래스
모든 패널 이벤트의 기본 클래스는 PanelChangedEventBase입니다. 이 클래스는 각 이벤트의 공통 기능을 제공합니다.
| 이벤트 이름 | 설명 | 대상 |
|---|---|---|
| AttachToPanelEvent | 요소가 패널에 추가된 후 실행됩니다. | 패널에 연결된 시각적 요소 |
| DetachFromPanelEvent | 요소가 패널에서 제거되기 전 트리거됩니다. | 패널에서 분리되는 시각적 요소 |
예제: 에디터 창에서의 패널 이벤트
이 예제에서는 레이블을 추가하고 클릭 시 레이블이 제거되는 버튼이 있는 에디터 창을 생성합니다. 레이블이 패널에 추가되거나 제거될 때 콘솔에 메시지를 출력하는 커스텀 레이블 클래스를 구현합니다.
단계별 구현
- C# 스크립트 생성:
Assets > Scripts > Editor에서PanelEventsTestWindow.cs라는 이름의 C# 스크립트를 작성합니다. - 스크립트 코드 복사: 아래 코드를 스크립트에 복사합니다.
using UnityEditor;
using UnityEngine;
using UnityEngine.UIElements;
public class PanelEventsTestWindow : EditorWindow
{
[MenuItem("Window/UI Toolkit/Panel Events Test Window")]
public static void ShowExample()
{
PanelEventsTestWindow wnd = GetWindow<PanelEventsTestWindow>();
wnd.titleContent = new GUIContent("Panel Events Test Window");
}
public void CreateGUI()
{
rootVisualElement.panel.visualTree.name = "Our Window Root Visual Element";
rootVisualElement.Add(new Button(() => rootVisualElement.Add(new CustomLabel())) { text = "Add New Label" });
}
}
public class CustomLabel : Label
{
private static int m_InstanceCounter = 0;
private int m_LabelNumber;
public CustomLabel() : base()
{
m_LabelNumber = ++m_InstanceCounter;
text = $"Label #{m_LabelNumber} - click me to detach";
RegisterCallback<AttachToPanelEvent>(evt =>
{
Debug.Log($"I am label {m_LabelNumber} and I " +
$"just got attached to panel '{evt.destinationPanel.visualTree.name}'");
});
RegisterCallback<DetachFromPanelEvent>(evt =>
{
Debug.Log($"I am label {m_LabelNumber} and I " +
$"just got detached from panel '{evt.originPanel.visualTree.name}'");
});
RegisterCallback<PointerDownEvent>(evt => this.RemoveFromHierarchy());
}
}
- 에디터 실행: Unity 에디터에서
Window > UI Toolkit > Panel Events Test Window를 선택하여 창을 열고 레이블을 추가합니다.
예제 작동 방식
- 레이블 추가: "Add New Label" 버튼 클릭 시 새로운 레이블 인스턴스가 패널에 추가됩니다.
- 레이블 클릭: 레이블을 클릭하면 해당 레이블이 패널에서 제거되고 콘솔에 관련된 메시지가 출력됩니다.
결론
패널 이벤트 시스템을 통해 Unity UI Toolkit에서 시각적 요소의 관리 및 이벤트 처리를 간편하고 효율적으로 수행할 수 있습니다. 위의 예제를 통해 기본적인 패널 이벤트를 연습하고 이를 다른 UI 구성 요소와 조합하여 활용할 수 있습니다. UI 개발을 할 때 이러한 패널 이벤트의 활용은 필수적인 요소가 됩니다.