Групповые мероприятия

Панель представляет собой видимый экземпляр иерархии UI. Она обрабатывает отправку событий поведения элемента в иерархии визуального дерева. Она содержит ссылку на корневой визуальный элемент иерархии. Для времени выполнения UI она сопоставима с Canvas в UGUI.

Чтобы панель могла отображать или получать события, к ней необходимо подключить экземпляр визуального элемента.

События панели возбуждаются для визуального элемента, когда изменяется его отношение к панели. Например, при добавлении визуального элемента на панель (AttachToPanelEvent) или удалении его с панели (DetachFromPanelEvent).

События панели отправляются только визуальным элементам и их дочерним элементам в иерархии, которые непосредственно затрагиваются изменениями панели. Родительные элементы не получают событий, когда дочерние визуальные элементы присоединяются к панели или отделяются от нее.

Например, в коде UXML ниже, когда вы добавляете визуальный элемент parent в иерархию, уже присоединенную к панели, parent, childи grandchild все получают одно и то же событие. Если вы удаляете parent из той же иерархии UXML, все визуальные элементы получают события DetachFromPanel.

<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements">
   <ui:VisualElement name="parent">
       <ui:VisualElement name="child">
           <ui:VisualElement name="grandchild" />
       </ui:VisualElement>
   </ui:VisualElement>
</ui:UXML>

Базовый класс для всех событий панели — PanelChangedEventBase.

В нижеследующей таблице описываются события, происходящие в группе, и этапы их распространения:

Мероприятие	Описание	Просыпается	Пузырьки вверх	Аннулируемые
AttachToPanelEvent	Отправляется сразу после того, как элемент (или один из его родителей) прикрепляется к панели.
DetachFromPanelEvent	Отправляется непосредственно перед тем, как элемент (или один из его родителей) отделяется от панели.

Уникальные свойства

originPanel: объект originPanel содержит данные, относящиеся к DetachFromPanelEvent. В нём хранится исходная панель, от которой визуальный элемент отсоединяется при смене панели.

destinationPanel: объект destinationPanel содержит данные, относящиеся к AttachToPanelEvent. Он предоставляет панель, к которой теперь прикреплён визуальный элемент.

Список событий

В следующем списке приведены имя, описание и назначение каждого события в семействе событий.

AttachToPanelEvent

AttachToPanelEvent запускается после присоединения визуального элемента к панели. Этот же запуск происходит при добавлении визуального элемента в иерархию, присоединенную к панели.

target: Визуальный элемент, который прикреплен к панели.

DetachFromPanelEvent

Триггеры DetachFromPanelEvent запускаются перед удалением визуального элемента с панели. Они также запускаются при удалении визуального элемента из иерархии, прикрепленной к панели.

target:Визуальный элемент, который отделяется от панели.

Примеры

Следующий пример создает окно Редактора с кнопкой, которая добавит дополнительные метки в окно. Нажатие на метки удалит их снова.

В этом примере реализован пользовательский класс метки, который выводит сообщение в консоль каждый раз, когда экземпляр VisualElement прикрепляется к панели или открепляется от неё. Пример показывает поведение событий AttachToPanelEvent и DetachFromPanelEvent и работу со свойствами originPanel и destinationPanel.

Чтобы посмотреть пример в действии, выполните следующие действия:

1. Создайте проект Unity с любым шаблоном.

2. В окне Project создайте папку Editor.

3. В окне Editor создайте скрипт C# с именем PanelEventsTestWindow.cs со следующим содержанием:

   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()
       {
           // Set a name for the panel
           rootVisualElement.panel.visualTree.name = "Our Window Root Visual Element";
       
           // Add a button which will add new instances of our custom labels to the window
           rootVisualElement.Add(new Button(() => rootVisualElement.Add(new CustomLabel())) { text = "Add New Label" });
       }
   }
       
   // Custom label class which prints out a console message when it is attached or detached.
   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}'");
           });
           // Register a pointer down callback that removes this element from the hierarchy
           RegisterCallback<PointerDownEvent>(evt => this.RemoveFromHierarchy());
       }
   }
   

4. Чтобы увидеть пример в реальном времени, в меню выберите Окно > UI Toolkit > Панель событий Тестовое окно.