Unity の QuizU アセットに TestScene を追加してみます。
QuizU で UI Toolkit を学ぼう～TestScene の追加～
QuizU
QuizU – A UI toolkit sample
UI Toolkit の使い方が学べる、Unity公式の無料のアセットです。
TestScene の追加
QuizU の MainMenu に TEST ボタンを追加します。
TEST ボタンを押すと、自分で作成した TestScene に遷移します。
Test フォルダを作成して、その下に必要なファイルを作成していきます。
TEST ボタンを追加する
MainMenuScreen アセットをダブルクリックして UI Builder を開きます。
#menu__button-more を複製して、#menu__button-test を作成します。
Attributes の Text も TEST に変更します。
UI Document の作成
Projectビューの Assets/Test/UI/Uxml フォルダで右クリックして、Create -> UI Toolkit -> UI Document をクリックします。
名前は TestScreen にします。
TestScreen をダブルクリックすると UI Builder が開きます。
Visual Element と Button を追加します。
#back-button の Style Class List には .back-button を追加します。
#character-sprite の Position Mode は Absolute に設定します。
TestScene の作成
TestScene シーンを作成します。
TestScree プレハブを追加します。
SceneLoader プレハブを追加します。
SceneLoader プレハブは QuizU に含まれています。
TempCamera プレハブを追加します。
TempCamera プレハブは QuizU に含まれています。
TestEvents スクリプトの作成
TestEvent.cs を作成します。
using System;
namespace MyApp {
public static class TestEvents {
#region Public Fields
public static Action SetupCompleted;
public static Action BackButtonClicked;
public static Action CharacterSpriteClicked;
#endregion // Public Fields.
#region Private Fields
#endregion // Private Fields.
#region Public Properties
#endregion // Public Properties.
#region Private Properties
#endregion // Private Properties.
#region Unity Methods
#endregion // Unity Methods.
#region Public Methods
#endregion // Public Methods.
#region Private Methods
#endregion // Private Methods.
}
}TestPresenter スクリプトの作成
TestPresenter.cs を作成します。
using Quiz;
using UnityEngine;
namespace MyApp {
public class TestPresenter : MonoBehaviour {
#region Public Fields
#endregion // Public Fields.
#region Private Fields
private TestScreen m_rTestScreen;
#endregion // Private Fields.
#region Public Properties
public TestScreen TestScreen { get => m_rTestScreen; set => m_rTestScreen = value; }
#endregion // Public Properties.
#region Private Properties
#endregion // Private Properties.
#region Unity Methods
private void OnEnable() {
TestEvents.SetupCompleted += TestEvents_SetupCompleted;
TestEvents.CharacterSpriteClicked += TestEvents_CharacterSpriteClicked;
}
private void OnDisable() {
TestEvents.SetupCompleted -= TestEvents_SetupCompleted;
TestEvents.CharacterSpriteClicked -= TestEvents_CharacterSpriteClicked;
}
#endregion // Unity Methods.
#region Public Methods
#endregion // Public Methods.
#region Private Methods
private void Initialize() {
NullRefChecker.Validate(this);
}
private void TestEvents_SetupCompleted() {
Initialize();
}
private void TestEvents_CharacterSpriteClicked() {
m_rTestScreen.UpdateCharacterSpritePosition();
}
#endregion // Private Methods.
}
}TestScreen スクリプトの作成
TestScreen.cs を作成します。
using UnityEngine;
using Quiz;
using UnityEngine.UIElements;
namespace MyApp {
public class TestScreen : UIScreen {
#region Public Fields
#endregion // Public Fields.
#region Private Fields
private Button m_rBackButton;
private VisualElement m_rCharacterSprite;
#endregion // Private Fields.
#region Public Properties
public Button BackButton => m_rBackButton;
public VisualElement CharacterSprite => m_rCharacterSprite;
#endregion // Public Properties.
#region Private Properties
#endregion // Private Properties.
#region Unity Methods
#endregion // Unity Methods.
#region Public Methods
public TestScreen(VisualElement rParentElement) : base(rParentElement) {
m_RootElement = rParentElement;
SetVisualElements();
m_HideOnAwake = false;
}
public void RegisterCallbacks() {
m_EventRegistry.RegisterCallback<ClickEvent>(m_rBackButton, rEvent => TestEvents.BackButtonClicked?.Invoke());
m_EventRegistry.RegisterCallback<ClickEvent>(m_rCharacterSprite, rEvent => TestEvents.CharacterSpriteClicked?.Invoke());
}
public void UnregisterCallbacks() {
m_EventRegistry.Dispose();
}
public void UpdateCharacterSpritePosition() {
float fPosX = Random.Range(0, Screen.width);
float fPosY = Random.Range(0, Screen.height);
m_rCharacterSprite.transform.position = new Vector3(fPosX, fPosY, m_rCharacterSprite.transform.position.z);
}
#endregion // Public Methods.
#region Private Methods
private void SetVisualElements() {
m_rBackButton = m_RootElement.Q<Button>("back-button");
m_rCharacterSprite = m_RootElement.Q<VisualElement>("character-sprite");
}
#endregion // Private Methods.
}
}TestSetup スクリプトの作成
TestSetup.cs を作成します。
using Quiz;
using UnityEditor;
using UnityEngine;
using UnityEngine.UIElements;
namespace MyApp {
public class TestSetup : MonoBehaviour {
#region Public Fields
#endregion // Public Fields.
#region Private Fields
[SerializeField] private UIDocument m_rDocument;
private TestPresenter m_rTestPresenter;
private TestScreen m_rTestScreen;
private const string C_SCENE_PATH_TO_UNLOAD = "Assets/Test/Scenes/TestScene.unity";
#endregion // Private Fields.
#region Public Properties
#endregion // Public Properties.
#region Private Properties
#endregion // Private Properties.
#region Unity Methods
private void OnEnable() {
if (m_rDocument == null) {
m_rDocument = GetComponent<UIDocument>();
}
if (m_rTestPresenter == null) {
m_rTestPresenter = GetComponent<TestPresenter>();
}
NullRefChecker.Validate(this);
if (!Coroutines.IsInitialized) {
Coroutines.Initialize(this);
}
SetupTestScreen();
TestEvents.BackButtonClicked += TestEvents_BackButtonClicked;
}
private void OnDisable() {
TestEvents.BackButtonClicked -= TestEvents_BackButtonClicked;
m_rTestScreen.Disable();
}
#endregion // Unity Methods.
#region Public Methods
#endregion // Public Methods.
#region Private Methods
private void SetupTestScreen() {
VisualElement rRootElement = m_rDocument.rootVisualElement.Q<VisualElement>("test-container");
m_rTestScreen = new TestScreen(rRootElement);
m_rTestScreen.Initialize();
m_rTestScreen.RegisterCallbacks();
m_rTestScreen.Show();
m_rTestPresenter.TestScreen = m_rTestScreen;
TestEvents.SetupCompleted?.Invoke();
}
private void TestEvents_BackButtonClicked() {
#if UNITY_EDITOR
if (!CheckSceneExists(C_SCENE_PATH_TO_UNLOAD)) {
Debug.LogWarning($"[TestSetup]: Missing scene at path {C_SCENE_PATH_TO_UNLOAD}");
return;
}
#endif // UNITY_EDITOR.
SceneEvents.UnloadSceneByPath?.Invoke(C_SCENE_PATH_TO_UNLOAD);
Debug.Log($"[TestSetup] Unloading scene: {C_SCENE_PATH_TO_UNLOAD}");
}
#if UNITY_EDITOR
private bool CheckSceneExists(string rScenePath) {
return AssetDatabase.LoadAssetAtPath<SceneAsset>(rScenePath) != null;
}
#endif // UNITY_EDITOR.
#endregion // Private Methods.
}
}動作確認
Unity エディターの再生ボタンを押します。
MainMenu に TEST ボタンが追加されています。
TEST ボタンを押すと、TestScene に遷移します。
Sprite をクリックすると、ランダムな座標に移動します。
まとめ
QuizU は、UI Toolkit の使い方を学べるアセットになります。
今回は、TestScene を作成して、MainMenu から呼び出してみました。
クリックして遊ぶゲームを考えて作ってみましょう。
コメント