UnityUI ツール — MRTK3

UnityUI は、3D ユーザー インターフェイスを作成するときに Mixed Reality 開発者が考える最初のツールではない可能性があります。 ただし、いくつかのヘルパー コンポーネントとユーティリティを使用すると、UnityUI で美しく柔軟な 3D ユーザー インターフェイスを作成できます。

Unity UI のボタンとスライダーの例

ヒント

UnityUI を作成するときに、パフォーマンスのボトルネックを簡単に作成できます。 複雑な UnityUI レイアウトを作成する前に、この チュートリアルをお読みください。

サンプル

UnityUI用に構築されたさまざまなコンポーネントのデモについては、UnityUI サンプルを参照してください。

UI 動作コンポーネント

以下のコンポーネントは UI のレンダリングに役立ちますが、 グラフィック コンポーネントは表示されません。

ScaleMeshEffect

Unity UI コンポーネントでは、unity_ObjectToWorld マトリックス(またはUNITY_MATRIX_MURPで)は、Graphic コンポーネントが含まれるローカル変換の変換マトリックスではなく、その親の Canvas の変換マトリックスです。 グラフィックツール内のシェーダー効果の多くは、オブジェクトのスケールを把握する必要があります。 この問題を解決するために、UI メッシュの構築中に、ScaleMeshEffect.csによってスケーリング情報が UV チャネル属性に格納されます。

ヒント

グラフィックス ツール内の Canvas または CanvasRenderer は、必要に応じて ScaleMeshEffect.cs の追加を求められます。

RectMask2DFast

UnityUI には RectMask2D という組み込みコンポーネントがあります。 通常、このコンポーネントは、より大きな領域の小さなセクションをマスクするために使用されます。 多数のオブジェクトをマスクする場合、このプロセスでは CPU 上のオブジェクトを削除するのにかなりの時間がかかる場合があります。 このボトルネックを回避するために、グラフィックス ツールにはRectMask2DFastコンポーネントが 含まれています。

RectMask2DFast は、推奨される代替方法と同じ方法 RectMask2D で動作します。 RectMask2DFastからのオブジェクト の追加または削除後にマスクが更新されない問題が発生した場合は、次のような更新プログラムを手動で呼び出す必要がある場合があります:

myRectMask2DFast.ForceClip = true;

すべての グラフィックス ツール/キャンバス/ シェーダーと グラフィックス ツール/標準キャンバス シェーダーのサポート材 RectMask2DRectMask2DFast、および RoundedRectMask2D

注意

グラフィックス ツール/キャンバス/ シェーダーと グラフィックス ツール/標準キャンバス シェーダーは、RectMask2DまたはRectMask2DFast.Softness プロパティをサポートしていません

RoundedRectMask2D

RoundedRectMask2DRectMask2DFastから派生し、同様に動作します。 唯一の違いは、 RoundedRectMask2Dは角が丸い場合のコーナー半径の値が含まれていることです。 この半径は、すべてのコーナーまたは各コーナーに対して個別に選択できます。

2 つのイメージを含む RoundedRectMask2D の例

注意

マテリアルのインスタンス化は、ユーザーがコントロールする必要があります。 すなわち、共有マテリアルはRoundedRectMask2Dによって影響を受ける可能性があります.

UI グラフィック コンポーネント

以下の グラフィック コンポーネントは、キャンバスに 3D 次元を追加するのに役立ちます。

CanvasElementRoundedRect

このコンポーネントは、3Dで丸められた矩形 メッシュを手続き的に生成し、キャンバスの頂点のストリームに割り当てます。 通常、このコンポーネントは、グラフィックス ツール/キャンバス/バック プレート シェーダーを使用してバックプレート メッシュを生成するために使用されます。

CanvasElementRoundedRect のバックプレートの例

CanvasElementBeveledRect

CanvasElementRoundedRect同様に、このコンポーネントは、丸い矩形だがべベルエッジを持つ3Dを手続き的に生成します。 通常、このコンポーネントは、グラフィックス ツール/キャンバス/べベル シェーダーを使用してバックプレート メッシュを生成するために使用されます。

CanvasElementBeveledRect の例

CanvasElementMesh

Unity の MeshRenderer コンポーネントを使用して UnityUI 内に 3D メッシュを表示できますが、UnityUI で提供されるレイアウト機能の一部は考慮されません。 これらのレイアウトの問題を解決するには、CanvasElementMeshコンポーネントがあります。

CanvasElementMeshコンポーネントは 入力メッシュを受け取り、Graphicコンポーネントに 変換します。

ロケットを使用した CanvasElementMesh の例

重要

スクリプト内で頂点を読み取ることができるように、入力メッシュの 読む/書く プロパティが有効になっている必要があります。

アニメーション

UnityUI マテリアル プロパティをアニメーション化するには、 CanvasMaterialAnimator... クラスを使用できます。 詳細については、アニメーションドキュメントを参照してください。

UI レイアウトに役立ついくつかのメニュー項目がグラフィックス ツール内に存在します。

アンカーをコーナーに、コーナーをアンカーに

Window > Graphics ツール > キャンバス アンカー>アンカー から コーナーへ およびWindow > Graphics ツール > キャンバスアンカー > コーナーから アンカーへ を使用すると、ピン留めシステムでのレイアウトの表現と RectTransform に固有のアンカー (制約) システム間を前後に移動できます。 これは、レスポンシブと固定スケール レイアウトの間を移動する場合に便利です。

関連項目