Invalidiation Box

UI ウィジェットを最適化するための Invalidation Box 使用についての概要です。

前提トピック

このページは以下のトピックへの知識があることを前提にしています。まず以下のトピックの内容についてご確認をお願いします。

説明

Invalidation Box (無効化ボックス) でラップされているウィジェットでは、子ウィジェットのジオメトリをキャッシュして、スレートのレンダリングをスピードアップすることができます。Invalidation Box によってキャッシュ化されたウィジェットは、事前に渡されたり、ティックされたり、ペイントされたりしません。一般的にプロジェクトを最適化する方法を考える場合、特定のウィジェットを Invalidation Box でラップすると、パフォーマンスが向上する場合があります (特に、モバイル プロジェクトや複雑な UI 表示)。あまり変化しないウィジェットは、ペイント、ティック、事前に渡される中に考慮する代わりに Invalidation Box 内に入れてキャッシュすることができます。

しかし、ウィジェットが変化すると、ボックスは無効になり、キャッシュを手動で無効化する必要があります。これは、実質的にボックスを破棄し、次のペイント パスで再描画を強制します。ウィジェットの外観を変えるものは何でも無効化する必要があります。この唯一の例外は、こうしたウィジェットの頂点バッファーに保存されない外観に対する変更です (例、マテリアル。マテリアル パラメーターの変更は、ウィジェットの無効化を必要としないからです)。

詳細パネル

配置した Invalidation Box[Details (詳細)] パネルには、ウィジェットに関連して設定可能な以下のようなオプションがあります。

Invalidation Box properties in the Details panel

オプション

説明

Cache Relative Transforms

Invalidation box に相対的に子の描画エレメントの位置をキャッシュし、フレーム毎にそれらを描画する余分なオーバーヘッドを加えます。ただし、Invalidation box の位置がフレーム毎に変化する場合は、このオプションを使用すると大きな節約につながります。

Is Volatile

true の場合は、ウィジェットやその子のジオメトリまたはレイアウトの情報がキャッシュされないようにします。このウィジェットがフレーム毎に変化するが、それでも Invalidation panel に入れたい場合は、フレーム毎に無効化する代わりに volatile にします。これにより、Invalidation panel が実際に何かをキャッシュするのを防ぎます。

Is Volatile のチェック ボックスに関しては、どのウィジェットでも Volatile に設定することができます。Volatile ウィジェットは、通常のスレート ウィジェットの pre-invalidation のように機能します。これらはすべての子を含めてフレーム毎に再描画されます。Invalidation panel と組み合わせると、UI の非常に動的な部分だけを再描画することだけを配慮すればよくなります。パネル全体を無効化するほうがはるかに負荷が高くなるからです。

関数

Invalidation Box を使用する場合、C++ で Invalidate を呼び出すか、子ウィジェットで Invalidate Layout And Volatility ノード (以下の図) を呼び出して無効化を強制するかはユーザー次第です。

Invalidate node

現在、特定のプロパティが変更された場合に、一部のコア ウィジェットはこれを自動的に実行しますが、時間の経過と共にさらに多くのウィジェットがこれを行います。

デバッグ

ウィジェット リフレクタ (CTRL+Shift+W) を使用して、Invalidation Debugging トグルをクリックして Invalidation Box をデバッグすることができます。

SlateDebugger.Invalidate.Enable 1 が呼び出されると凡例が表示するには、SlateDebugger.Invalidate.ToggleLegend を使用します。

クリックしてフルサイズで表示

ウィジェット リフレクタをアップし、Invalidation Debugging をオンにすると、以下の色が表示されます。

説明

Yellow

Paint がこのフレームを無効化しました。

Gray

Volatility がこのフレームを無効化しました。

Cyan

ChildOrder がこのフレームを無効化しました。

Black

RenderTransform がこのフレームを無効化しました。

White

Visibility がこのフレームを無効化しました。

Pink

Layout が Invalidation Box に対してこのフレームを無効化しました。

Blue

各ウィジェットが並び替えられました。

Red

完全に再更新されました。

InvalidationBox の挙動をデバッグするために、SlateDebugger.InvalidationRoot.Enable を使用します。

上の図は、Invalidation Box でラップされた枠内に Volatile とマークされた画像です。 画像は Volatile とマークされているため、ゲームプレイ中に動的に更新することができます。これに対して Border (またはこの画像周囲に表示させたい変化しない他のアート アセット) はキャッシュされます。

Eample of using Invalidation Box

Unreal Engine のドキュメントを改善するために協力をお願いします!どのような改善を望んでいるかご意見をお聞かせください。
調査に参加する
キャンセル