NinaLabo

個人ゲーム開発者の技術メモ

【Unity】UIElementsの導入

Unity2020になってEditor利用だけだったUIElementsがランタイムのゲームUIとして使えるようになったようです。

 

UIElements 開発者ガイド - Unity マニュアル

f:id:ninagreen:20201116023428p:plain

 

原始的なIMGUIに始まり、NGUIが席巻したと思ったら、UGUIがUnityから出て、落ち着いてきた頃にUIElementsに変わるとか、UI領域は技術の陳腐化が早すぎて本当に大変です。

最終的にUIElementsがUGUIに取って変わるのか、それとも結局UGUIが残り続けるのかはわかりませんが、ローグスフィア2の開発はUIElementsでやってみようかと思ってます。

 

まずはインストールして簡単なものを表示してみるところまでやってみます。

環境は Unity2020.1.13f1を使用しています(2020/11/16時点の最新)

 

UIElementsをインストール

Window > PackageManager を開く

まだpreviewの状態のため、左上の+ボタンから「Add package from git URL」を選択して 「com.unity.ui」を入力してインストールします

*昔はcom.unity.ui.runtimeだったようですがそちらは古いようで、com.unity.uiが新しいようです。

 

Runtime package 0.0.4 - Unity Forum

com.unity.ui.runtime is not supported, it's the old version and name of the pacakge.

You need to use the new package going forward "com.unity.ui" (no .runtime)

"com.unity.ui": "1.0.0-preview.3"

 

しばらくするとUI ToolKitのインストールが完了します

f:id:ninagreen:20201116032158p:plain

 

同じく「com.unity.ui.builder」を入力してUI Builderもインストールします。

f:id:ninagreen:20201117011750p:plain

 

レイアウトの生成(UXML作成)

Window > UI ToolKit > UIBuilderを開いてレイアウトを生成

f:id:ninagreen:20201117013011p:plain

UIBuilderの詳細な使い方は追々調べることにして、ひとまずは簡単なレイアウトを作成して

f:id:ninagreen:20201117013146p:plain

File > Save で適当な場所にuxmlファイルを保存

f:id:ninagreen:20201117013233p:plain

 

UIDocumentのアタッチ

シーン上に適当なオブジェクトを作成してUIDocumentをアタッチ

f:id:ninagreen:20201117025248p:plain

・PanelSettingsには

Projectウィンドウで右クリック > Create > UI ToolKit > Panel Settings Asset

で作成したPanelSettingsを設定する

・Source Assetには先ほど保存したuxmlファイルを設定する

 

再生

Unityを再生するとGameSceneにUIが表示されます。

再生したまま、UI Builderのレイアウトを編集できるのは便利で良いですね。

 

参考資料 

www.youtube.com