본문 바로가기

유니티/UI System

[UIToolkit]UXML을 사용한 UI 구조

반응형

Unity UXML(Extensible Markup Language)파일은 사용자 인터페이스의 구조를 정의하는 텍스트 파일입니다. UXML형식은 HTML, XAML, XML에서 영감을 받았습니다. 이전에 이러한 형식으로 작업한 적이 있다면 UXML과의 유사점을 찾을 수 있습니다. 그러나 UXML 형식에는 Unity를 사용하는 효율적인 방법을 제공하기 위해 약간의 차이점이 있습니다. 이 섹션에서는 Unity가 지원하는 UXML 형식에 대해 설명하고 UXML 템플릿 작성, 로드 및 정의에 대한 세부 정보를 제공합니다. 또한 새 요소를 정의하는 방법과 UQuery를 사용하는 방법에 대한 정보가 포함되어 있습니다. UXML을 사용하면 기술 수준이 낮은 사용자가 Unity 내에서 사용자 인터페이스를 쉽게 구축할 수 있습니다. UXML에서 당므을 수행할 수 있습니다.

 

- XML에서 사용자 인터페이스(UI)의 구조를 정의합니다.

- USS 스타일시트의 레이아웃을 정의합니다.

 

 따라서 개발자는 에셋 가져오기, 로직 정의 및 데이터 처리와 같은 기술 작업을 수행해야 합니다.

 

새로운 요소 정의

UI Toolkit을 사용하여 고유한 사용자 인터페이스 구성 요소 및 요소를 정의할 수 있습니다. UXML 파일을 사용하여 새 요소를 정의하려면 먼저 'VisualElement'클래스 또는 해당 하위 클래스에서 새 클래스를 파생시킨 다음 이 클래스 내에서 적절한 기능을 구현해야 합니다. 새 클래스는 기본 생성자를 구현해야 합니다.

 

예를 들어 아래 코드는 StatusBar 클래스를 파생시키고 기본 생성자를 구현합니다.

 

class StatusBar : VisualElement
{
    public StatusBar()
    {
        m_Status = String.Empty;
    }

    string m_Status;
    public string status { get; set; }
}

 

UI Toolkit이 UXML파일을 읽을 때 새 클래스를 인스턴스화하려면 클래스에 대한 팩토리를 정의해야 합니다. 팩토리에서 특별한 작업을 수행해야 하는 경우가 아니면 UxmlFactory<T>에서 팩토리를 파생시킬 수 있습니다. 구성 요소 클래스 내에 팩토리 클래스를 배치하는 것이 좋습니다.

 

예를 들어 다음 코드는 UxmlFactory<T>에서 StatusBar 클래스의 팩토리를 가져오는 방법을 나타내고 있습니다. 공장의 이름은 UxmlFactory 입니다.

 

class StatusBar : VisualElement
{
    public new class UxmlFactory : UxmlFactory<StatusBar> {}

    // ...
}

 

이 팩토리를 정의하면 UXML파일의 <StatusBar> 요소를 사용할 수 있습니다.

 

 

요소의 속성 정의

새 클래스에 대한 UXML 특성을 정의하고 이러한 특성을 사용하도록 해당 팩토리를 설정할 수 있습니다. 예를 들어, 다음 코드는 'status'속성을 'StatusBar' 클래스의 속성으로 초기화하기 위해 UXML특성 클래스를 정의하는 방법을 보여줍니다. status 속성은 XML 데이터에서 초기화됩니다.

 

class StatusBar : VisualElement
{
    public new class UxmlFactory : UxmlFactory<StatusBar, UxmlTraits> {}

    public new class UxmlTraits : VisualElement.UxmlTraits
    {
        UxmlStringAttributeDescription m_Status = new UxmlStringAttributeDescription { name = "status" };

        public override IEnumerable<UxmlChildElementDescription> uxmlChildElementsDescription
        {
            get { yield break; }
        }

        public override void Init(VisualElement ve, IUxmlAttributes bag, CreationContext cc)
        {
            base.Init(ve, bag, cc);
            ((StatusBar)ve).status = m_Status.GetValueFromBag(bag, cc);
        }
    }

    // ...
}

 

UxmlTraits의 두 용도

- 팩토리는 이를 사용하여 새로 생성된 객체를 초기화합니다.

- 스키마 생성 프로세스는 이를 분석하여 요소에 대한 정보를 얻습니다. 이 정보는 XML스키마 지시문으로 변환됩니다.

 

위의 코드 예제는 다음을 수행합니다.

- m_Status의 선언은 status이라는 이름의 속성을 정의합니다.

- uxmlChildElementsDescrption은 statusbar에 항목이 없음을 나타내는 빈 IEnumerable을 반환합니다.

- Init()은 XML 파서에서 속성 가방(property bag)내의 status속성 값을 읽고 StatusBar.status 속성을 이 값으로 설정합니다.

- 새로운 UxmlTraits클래스는 기본 클래스 UxmlTraits에서 상속되므로 기본 클래스의 속성을 공유합니다.

- Init()은 기본 클래스의 속성을 초기화하기 위해 base.Init()을 호출합니다.

 

이 코드 예는 UxmlStringAttributeDescription 클래스를 사용하여 문자열 속성을 선언합니다. UI Toolkit은 다음 유형의 Attribute를 지원하며 각 Attribute는 C# 타입을 XML 타입에 링크합니다.

 

 

UI Toolkit Attribute

UxmlStringAttributeDescription: 문자열

UxmlFloatAttributeDescription: C# float 형식 범위의 단정밀도 부동소수점 값

UxmlDoubleAttributeDescription: C# double 형식 범위의 배정밀도 부동소수점 값

UxmlIntAttributeDescription: C# int 형식 범위의 정수 값

UxmlLongAttributeDescription: C# long 형식 범위의 긴 정수 값

UxmlBoolAttributeDescription: true 또는 false 값

UxmlColorAttributeDescription: 색상을 나타내는 문자열 (#FFFFFF)

UxmlEnumAttributeDescription<T>: Enum유형에 대한 값 중 하나를 나타내는 문자열 T 입니다.

 

위의 코드 예에서 uxmlChildElementsDescription은 empty IEnumerable을 반환합니다.이것은 StatusBar 요소가 child를 갖지 않음을 나타냅니다.
요소가 모든 유형의 child를 허용하도록 하려면 uxmlChildElementsDescription 속성을 재정의해야 합니다. 예를 들어 StatusBar 요소가 모든 유형의 child를 받아들이려면 uxmlChildElementsDescription 속성을 다음과 같이 지정해야 합니다.
 

 

public override IEnumerable<UxmlChildElementDescription> uxmlChildElementsDescription
{
    get
    {
        yield return new UxmlChildElementDescription(typeof(VisualElement));
    }
}
 
 

네임스페이스 접두사 정의

C#에서 새 요소를 정의한 후에는 UXML 파일에서 요소를 사용할 수 있습니다. 새 요소가 새 네임스페이스에 정의된 경우 네임스페이스에 대한 접두사를 정의해야 합니다. 네임스페이스 접두사는 루트 요소에 대한 속성으로 선언되며 <UXML>요소의 범위를 지정할 때 전체 네임스페이스 이름을 대체합니다.
 
네임스페이스 접두사를 정의하려면 정의 하려는 각 네임스페이스 접두사에 UxmlNamespacePrefix 어트리뷰트를 어셈블리에 추가합니다.
[assembly: UxmlNamespacePrefix("My.First.Namespace", "first")]
[assembly: UxmlNamespacePrefix("My.Second.Namespace", "second")]

어셈블리의 모든 C# 파일의 루트 수준(모든 네임스페이스 외부)에서 이 작업을 수행할 수 있습니다.

 

스키마 생성 시스템은 다음을 수행합니다.

- 이러한 속성을 확인하고 스키마를 생성하는 데 사용합니다.

- 새로 생성된 UXML 파일의 <UXML>요소의 속성으로 네임스페이스 접두사 정의를 추가합니다.

- xsl:schemaLocation 속성에 네임스페이스의 스키마 파일 위치를 포함합니다.

 

프로젝트의 UXML스키마를 업데이트해야 합니다. Assets > Update UXML Schema 를 선택하여 텍스트 편집기가 새 요소를 인식하도록 합니다.

 

정의된 접두사는 Project/Assets/Editor 폴더에서 Create > UI Toolkit > Editor Window를 선택하여 새로 생성된 UXML에서 사용할 수 있습니다.

 

 

 

 

 

 

 

 

반응형