概要
UIToolkitはまだuGUIと完全に置き換えることができるまでにはなっていないですが、そろそろ実用レベルが近づいてきています。
試しにどんなものか触ってみたい人のために基礎の基礎を記事にまとめてみました。
本文
1 Component作成
Projectウィンドウで右クリック → Create → UI Toolkit → UI Document(UIのデザインを決めるファイル)
Projectウィンドウで右クリック → Create → UI Toolkit → Panel Settings Asset(UIの表示設定を保存するファイル)
2 Hierarchyにオブジェクトを作成
UI用のオブジェクトをHierarchyに作成します(Create Empty)。作成したらUI Documentコンポーネントをアタッチします。そして先程作成したアセットをコンポーネント内へ以下のように設定します
Panel Settings → Panel Settings Asset
Source Asset → UI Document
3 UIをデザインする
最初に作成したUI Documentをダブルクリックすると以下のようなUI Builderウィンドウが開きます。
LibraryをスクロールするとたくさんUIパーツがあることがわかりますが、今回はこの中からLabelを使います。LabelをHierarchyにドラッグアンドドロップすることでUIを配置することができます。
次にウィンドウ右上のLabelの下の入力欄に名前を入力します。これはコード上からこのUIパーツを指定する時に使われます。今回は「SampleLabel」と名付けました。
後はInspector上で文字の見た目をお好みで設定してみてください。
例)
表示する文章 Attributes → Text
装飾 InlinedStyles → Text
ここまでの設定でUIを画面に表示する基本部分は出来ました![]()
4 コード設定
コード上からUIを操作してみます。Create → MonoBehaviour Scriptで新規ファイルを作成して以下のコードを入力します。("SampleLabel")部分にはUI Builderで指定したLabelの名前を入力してください。
入力が終わったら、これをGameObjectにアタッチします。
using UnityEngine;
using UnityEngine.UIElements;
public sealed class UIToolkitTest : MonoBehaviour
{
private void Start()
{
var root = GetComponent<UIDocument>().rootVisualElement;
root.Q<Label>("SampleLabel").text = "Hello, UIToolkit!";
}
}
実行すると、Labelの文字が書き換わったことが確認できました![]()




