Unity 런타임 UI 생성 가이드
이 문서에서는 Unity에서 런타임 UI를 생성하고 구현하는 방법을 설명합니다. UI 툴킷을 사용하여 게임 뷰에 UI 요소를 표시할 수 있습니다.
시작하기
플랫폼 준비를 위해 다음 단계를 수행하세요:
- UI 문서(.uxml) 생성: UI 요소를 포함하는 문서를 만듭니다.
- UIDocument 게임 오브젝트 추가: 씬에 UIDocument를 추가하고 생성한 UXML 파일을 소스 에셋으로 설정합니다.
- UI 동작 정의: MonoBehaviour를 사용하여 UI 컨트롤의 동작을 정의합니다.
예제
아래는 씬에 레이블, 버튼, 토글 및 텍스트 필드를 추가하는 간단한 런타임 UI 예제입니다. 버튼 클릭 시 콘솔에 메시지를 표시하고, 토글 선택 후 버튼 클릭 시 클릭 횟수를 출력합니다. 텍스트 필드에 메시지를 입력하면 콘솔에 해당 메시지가 표시됩니다.
필요 조건
- Unity 에디터에 대한 이해
- UI 툴킷 사용 경험
- C# 스크립팅 지식
UI 문서 생성
UI 요소 추가
UI 문서에 다음 내용이 포함되도록 설정합니다:
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements"
xsi="http://www.w3.org/2001/XMLSchema-instance" engine="UnityEngine.UIElements" editor="UnityEditor.UIElements"
noNamespaceSchemaLocation="../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
<ui:VisualElement style="flex-grow: 1;">
<ui:Label text="This is a Label" display-tooltip-when-elided="true"/>
<ui:Button text="This is a Button" display-tooltip-when-elided="true" name="button"/>
<ui:Toggle label="Display the counter?" name="toggle"/>
<ui:TextField picking-mode="Ignore" label="Text Field" text="filler text" name="input-message" />
</ui:VisualElement>
</ui:UXML>
씬 설정
SampleScene에서UIDocument게임 오브젝트 생성.- UI 문서를 소스 에셋으로 드래그하여 추가.
| 단계 | 작업 |
|---|---|
| 1 | GameObject > UI Toolkit > UI Document 선택 |
| 2 | UIDocument 게임 오브젝트에 SimpleRuntimeUI.uxml 드래그 |
UI 동작 정의
MonoBehaviour를 상속받은 스크립트를 작성하여 UI 요소에 대한 동작을 정의합니다. 아래는 SimpleRuntimeUI.cs의 내용입니다.
using UnityEngine;
using UnityEngine.UIElements;
public class SimpleRuntimeUI : MonoBehaviour
{
private Button _button;
private Toggle _toggle;
private int _clickCount;
private void OnEnable()
{
var uiDocument = GetComponent<UIDocument>();
_button = uiDocument.rootVisualElement.Q("button") as Button;
_toggle = uiDocument.rootVisualElement.Q("toggle") as Toggle;
_button.RegisterCallback<ClickEvent>(PrintClickMessage);
var _inputFields = uiDocument.rootVisualElement.Q("input-message");
_inputFields.RegisterCallback<ChangeEvent<string>>(InputMessage);
}
private void OnDisable()
{
_button.UnregisterCallback<ClickEvent>(PrintClickMessage);
}
private void PrintClickMessage(ClickEvent evt)
{
++_clickCount;
Debug.Log($"{"button"} was clicked!" + (_toggle.value ? " Count:" + _clickCount : ""));
}
public static void InputMessage(ChangeEvent<string> evt)
{
Debug.Log($"{evt.newValue} -> {evt.target}");
}
}
스크립트 추가
위의 스크립트를 UIDocument 게임 오브젝트의 컴포넌트로 추가합니다.
추가 리소스
이 문서를 통해 Unity에서의 런타임 UI 생성 과정을 쉽게 이해하고 적용할 수 있습니다. 더 많은 예제와 세부 사항은 Unity 공식 문서를 참고하시기 바랍니다.