【Unity】Runtime UIElements を試す

Unity2020.1から Runtime UIElements が利用できるようになったので導入と表示までをまとめる

利用できると言ってもまで Preview 版なので、デバッグUIに利用する分には問題無いが
uGUI の代わりとしてはまだ使えなさそうでした

利用した Version

UnityVersion：2020.1.10f
UI Builder；1.0.0-preview.9
UI Toolkit；1.0.0-preview.9

導入

Runtime UIElements の導入は PackageManagerから行う

左上の「＋」より Add package form git URL を選択

com.unity.ui を追加

そうすると UI Toolkit が表示されるのでこれをインストール
ついでに UIBuilder も利用するので一緒にインストール
※ Preview なので設定で Preview 版を表示するようにする必要があります

これで必要なライブラリは揃いました

Runtime で利用する

uxml の準備

UI Elements を表示させるには uxml が必要なので UI Builder を利用して適当な uxml を作成する

とりあえずボタンでもあればいいので 左下の Library から Button を Viewport へドラッグ

するとボタンが表示されます

これを適当なところへ保存します

コンポーネントのセット

GameObject を作成し UIDocument を AddComponent します
これが uGUI でいう Canvas の代わりになります

UIDocument には uxml と Panel Setting Asset が必要なので
右クリックメニューから Panel Setting Asset を作成します

特に値をいじる必要はありません

そして uxml と Panel Setting Asset をセットすると

Game Scene 上に表示されます

しかし再生してもボタンなのにクリックしても反応しません

クリックを有効にする

クリック等入力を有効にするためには、Event System(UI Toolkit) が必要になります
これを UIDocument と同じ GameObject に 追加してください

そうすることでクリックすると色が変わることが確認できます

クリック時にログを出す

クリック処理自体は Runtime じゃない場合と変わらない

下記のコードを記述して UIDocument がある GameObejct に追加することでクリック時に特定の処理を呼ぶことができる

using UnityEngine;
using UnityEngine.UIElements;
 
public class UESample : MonoBehaviour
{
    private void Awake()
    {
        var document = GetComponent<UIDocument>();
        var button = document.rootVisualElement.Q<Button>();
        button.clicked += () => Debug.Log("Click");
    }
}