スレート ポストバッファ は、UI マテリアルで使用するためにゲーム シーンをサンプリングします。ポストプロセス マテリアルでの SceneColor の使用方法と同様です。これにより、ゲーム ワールドとユーザー インターフェース (UI) の両方に適用する視覚効果を作成できるようになります。スレート ポストバッファは、ブラー エフェクトなどの幅広いポストプロセスを処理するために、スレート ポストプロセス を適用できる可能性もあります。
スレート ポストバッファの使用例は以下のとおりです。
- 透明なポップアップ メッセージの後ろのシーンをブラーにする。
- ダメージまたは暗さを表すビネット エフェクト。
- ウィジェットおよびゲーム ワールドを選択的に不明瞭にする画面全体のブラー。
- 擦り切れた VHS テープのような見た目の歪みフィルタ。
上記の例は、機能別サンプル プロジェクトの UI_SlatePostBuffer レベルで利用可能です。
このページでは次の項目について説明します。
- スレート ポストバッファを使用するワークフローの概要。
- スレート ポストバッファの機能と制限のテクニカル情報
- 以下のことを行う方法の手順
- スレート ポストバッファを有効にする。
- スレート ポストバッファを設定する。
- 新しいスレート ポストプロセッサ クラスを作成する。
- スレート ポストバッファをマテリアルに組み込み、それを UI 要素に適用する。
概要
スレート ポストバッファ クラスとポストプロセッサ クラスは、グローバル リソースであるため、プロジェクトでどのように使用するかをチーム全体と情報共有する必要があります。
UE は、ポストバッファを 5 つまでサポートします。それぞれが UI マテリアルで使用するためにゲーム シーンをサンプリングします。各ポストバッファにスレート ポストプロセッサ クラスを設定し、UI マテリアル で使用する前にそのバッファに幅広いポストプロセスを適用できます。ポストプロセッサがない場合、ゲーム シーンのコピーをサンプリングします。
UI マテリアルは、GetSlatePost 関数を使用してポストバッファをサンプリングできます。たとえば、GetSlatePost0 はスレート ポストバッファ 0 をサンプリングし、GetSlatePost4 はスレート ポストバッファ 4 をサンプリングします。UI マテリアルは、ポストプロセス マテリアルが SceneColor でシーンをサンプリングするのと同様にスレート ポストバッファを使用できます。
UI マテリアルをウィジェットに適用した場合、その後ろの画面の一部にマテリアルのポストプロセスを適用するためにウィジェットを使用します。以下の例は、反転 Y 軸 UV 座標を使用して、スクエア ウィジェット内のビューポートの一部を上下反転します。
より複雑な例として、以下のスクリーンショットは、擦り切れた VHS テープのように見せるためにウィジェットが画面をゆがめている様子です。VHS の歪みマテリアルを適用するウィジェットは、画面全体を占め、UI 内の他のウィジェットの上にレイヤー化されています。これにより、UE は UI とゲーム シーンを一緒に処理することができるため、日付やタイムコードなどの要素を UMG ブループリントのテキスト ウィジェットで制御できます。
デフォルトでは、GetPostBuffer ノードは UI ウィジェットの後ろから直接サンプリングします。このノードをオーバーライドする方法については、下の「UI マテリアルでポストバッファを使用するヒント」のセクションを参照してください。
スレート ポストバッファを有効にする
スレート ポストバッファを有効にするには、次の CVar をプロジェクトの「*Engine.ini」ファイルに追加してください。
DefaultEngine.ini
[ConsoleVariables]
Slate.CopyBackbufferToSlatePostRenderTargets=1
別の方法として、次のコンソール コマンドを使用してこの CVar を有効にできます。
コンソール
-dpcvars=Slate.CopyBackbufferToSlatePostRenderTargets=1
プロジェクト設定でスレート ポストバッファを設定する
ポストバッファを設定するには、次の手順に従います。
-
[Project Settings (プロジェクト設定)] を開きます。
-
[Game (ゲーム)] > [Slate RHIRenderer Settings (スレート RHI レンダラ設定)] > [Post Processing (ポストプロセス)] に移動します。
-
設定したいバッファのドロップダウンを展開します。必要に応じて各バッファを有効または無効にできます。
-
スレート ポストバッファに特定のポストプロセスを追加したい場合、これに [Post Processor Class (ポスト プロセッサ クラス)] を選択します。
スレート ポストプロセッサ クラスを作成して使用する
新しいスレート ポストプロセッサ クラスを作成するには、次の手順に従います。
-
USlateRHIPostBufferProcessor またはその子クラスのひとつから派生する 新規ブループリント クラス を作成します。このチュートリアルでは USlatePostBufferBlur を例として使用します。
-
新しいポストプロセッサのためのブループリントを開き、クラスのデフォルトを編集します。[Gaussian Blur Strength (ガウス ブラー強度)] のデフォルト設定を、親クラスから継承したデフォルト値以外に変更します。この例では [Gaussian Blur Strength] を「10.0」に設定しています。
-
[Project Settings (プロジェクト設定)] > [Slate Renderer Settings (スレート レンダラ設定)] > [Post Processing (ポストプロセス)] を開き、ポストバッファのひとつのドロップダウンを展開し、[Post Processor Class (ポストプロセッサ クラス)] を新しいポストプロセッサに設定します。
これで UE はウィジェットがコピーする前にバックバッファを処理するために設定したポストプロセッサを使用します。この場合、ポストプロセッサはガウス ブラーを追加します。
USlateRHIPostBufferProcessor から新規 C++ クラスを取得することで独自のポストプロセッサを実装することもできます。
ランタイム時にスレート ポストプロセッサを変更する
スレート FX サブシステム を使用して、ランタイム時にスレート ポストプロセッサの値を変更できます。
-
Slate FX Subsystem ノードを作成します。
-
Get Slate Post Processor を呼び出し、ポストバッファの秘匿からポストプロセッサを取得します。
-
適切なクラスにポストプロセッサをキャストします。
-
キャストされたポストプロセッサ オブジェクトからポストプロセッサのパラメータにアクセスします。
上の画像は、ランタイム時のポストプロセッサの変更の様子の一例です。示されているようにティックでこの処理を実行することは推奨しません。
スレート ポストバッファとポストプロセッサはグローバル リソースであるため、上の例のようにスレート ポストプロセッサの値を変更すると、値がグローバルで変更されるからです。したがって、このポストプロセスを使用するスレート ウィジェットまたは UI マテリアルのすべてのインスタンスはその変更を反映します。注意して使用し、ランタイム時にスレート ポストプロセスを変更する前にチーム全体と情報共有してください。
UI マテリアルでポストバッファを使用する
ポストバッファをサンプリングする UI マテリアルを作成するためには、以下の手順に従います。
-
新しい マテリアル を作成します。
-
マテリアルの [Material Domain (マテリアルドメイン)] を [User Interface (ユーザー インターフェース)] に設定します。
-
バッファをサンプリングするには、使用したいポストバッファに対応した GetSlatePost 関数を呼び出します。たとえば、
GetSlatePost0はポストバッファ 0 を取得します。
UI マテリアルでポストバッファを使用するヒント
以下は、UI マテリアルでポストバッファを使用するヒントです。
- デフォルトでは、GetSlatePost ノードは現在のウィジェットの後ろのピクセルのみをサンプリングしますが、これは、UV 入力を使用して変更できます。
- LinearRGB を使用して、バックバッファの正しいガンマのサンプルを取得します。
- RGB は、正しい色の反転などのエフェクトに役立ちます。
次のグラフは後ろのワールドの色を反転する、回転する UE ロゴを作成するためにポストバッファを使用するマテリアルの例です。UE ロゴのテクスチャは、オパシティの出力に接続され、最終カラーは、GetSlatePost0 の RGB 出力を反転します。
このマテリアルは下の画像で使用されています。GetSlatePost0 に UV 入力がないにもかかわらず、マテリアルはウィジェットの後ろのシーンを直接サンプリングしていることに留意してください。
ポストバッファで UI ウィジェットをキャプチャする
デフォルトでは、GetSlatePost ノードはシーンのみをキャプチャします。UI をキャプチャするタイミングをスレートに伝える ポストバッファの更新ウィジェット を使用してシーンと他の UI ウィジェットの両方をキャプチャすることができます。ポストバッファで UI をキャプチャするためには、以下の手順に従います。
-
UMG デザイナーのパレットで [Post Buffer Update Widget (ポストバッファ更新ウィジェット)] を探します。
-
現在の UI 更新を配置したい場所にウィジェットを追加します。スレート ポストバッファはこのウィジェットが配置された場所を更新します。
サンプリングしたいウィジェットのあと (または上) に描画させるため、階層の最後の要素として更新ウィジェットに配置することを推奨します。
-
[Details (詳細)] パネルでポストバッファ更新ウィジェットを設定します。
ポストバッファ更新ウィジェットには以下のパラメータが含まれます。
| パラメータ | 説明 |
|---|---|
| Perform Default Post Buffer Update (デフォルトのポストバッファ更新を実行) | True の場合、デフォルトのシーンのみのコピー / スレート ポストプロセスが行われます。そうでない場合、デフォルトのコピー / プロセスは行われません。ポストバッファの更新が「描画」されず、この設定がオフの場合、ウィジェットがスレート ポストバッファのサンプリングを試みるとき動作は未定義です(結果は、最後のフレームになるか、白 / 黒になる可能性があります - この状況を回避してください)。 |
| Buffers to Update (更新するバッファ) | このウィジェットが UI とシーンのサンプルをトリガーするバッファの配列。この時点から、UI で GetSlatePost ノードの予想される使用量に一致する必要があります。 |
ポストバッファ更新ウィジェットを設定したら、将来のウィジェットは、更新するために選択したバッファに適用されたポスト FX を含むシーンと UI の両方を自由にサンプリングできます。
ポストバッファと描画順
ポストバッファ更新が正常に機能するためには、スレートは、ポストバッファがサンプリングする「前」に、ポストバッファがサンプリングする UI 要素すべてを描画する必要があります。描画が順不同なため、垂直 / 水平 / グリッド ボックス内のオーバーレイにポストバッファを配置することはこれを保証するものではありません。以下はガイドラインです。
- 階層の最下レイヤーは、ポストバッファの影響を受けたビジュアルを表示したいウィジェットにします。
- 中央レイヤーは、ポストバッファ ウィジェットを含んでいる必要があります。
- 最上レイヤーはポストバッファをサンプリングしエフェクトを最下レイヤーに適用するマテリアルである必要があります。
次の画像は、効果的な描画順を示しています。
次の画像は水平ボックスの画像に適用されたマテリアルを示しています。
テクニカル情報と制限事項
以下は、スレート ポストバッファの動作の技術的洞察と制限事項です。
サンプリング
GetSlatePost ノードは、サンプリングするウィジェットのシーン バックバッファのフレームごとに処理されるコピーをサンプリングします。これらのバッファはグローバルであるため、使用にはチームでの計画が必要です。マテリアルはバックバッファのコピーをサンプリングするため、最上部に描画されたウィジェットは、ポストバッファ更新ウィジェットを使用しない限り、それより下のウィジェットをサンプリングしません。
パフォーマンスとブラー ポストプロセス
ブラーの使用量に比例して、ブラー ポストプロセスのパフォーマンス コストが高くなることを見込んでください。つまり、32 ピクセル ブラーは 16 ピクセル ブラーよりもパフォーマンス コストが高くなります。次の表はゲームシーンのフレームのレンダリングから得られたパフォーマンス測定値を示しています。これらの測定値は UE 5.4 の Renderdoc を使用した RTX 3080 で測定されました。
| ブラー強度 (ピクセル) | カーネル サイズ | ブラー時間 (マイクロ秒単位) (us) | 合計 GPU フレーム時間 | ブラーが使用する GPU 比率 |
|---|---|---|---|---|
| 72 | 28x28 | 93 us | 8272 | 1.1% |
| 256 | 97x97 | 212 us | 8254 | 2.5% |
上の値は主に、ブラー サイズ間の相対的なパフォーマンスの差の目安を示すためのものです。必ずしも Unreal Engine や現行ハードウェアの現在のパフォーマンスを反映したものではありません。
複数のポストプロセッサ
複数のポストバッファをポストプロセスで使用する場合、実際に画面に表示されるポストプロセスのパフォーマンス コストのみを負担します。たとえば、2 つのポストバッファがあり、それぞれが異なる値のブラー ポストプロセスを使用する場合、以下のようになります。
-
そのうちの 1 つしか表示されない場合、その分だけを負担します。
-
両方が表示される場合、両方負担します。
バッファ使用量を最小限にする
バッファを使用するウィジェットが描画された場合のみ、各バッファはコピー/追加されます。バッファが 2 つのフレームで使用されていない場合、GPU で 1x1 にサイズ変更されます。
HDR のサポート
スレート ポストバッファは HDR をサポートします。しかし、HDR を使用している場合、マテリアルは LinearRGB ではなく RGB からサンプリング する必要があります。さらに、HDR サポートは、HDR コンポジットがオフの場合のみすぐに機能します。HDR コンポジットを使用したい場合、使用中にガンマ値を修正する必要があるかもしれません。
キャッシュされたバッファの使用量
ウィジェット マテリアルは、マテリアル/テクスチャの作成時とリソースの更新時にポストバッファをキャッシュしますが、この描画ごとのキャッシュされた値は更新しません。
グローバル CVar Slate.CopyBackbufferToSlatePostRenderTargets がオフの状態で実行すると、このキャッシュが原因で使用量の表示されないマテリアルで止まってしまう可能性があります。この場合、ポストバッファの使用を試みているマテリアルは、黒 / 白のみをサンプリングする可能性があります。もしそうなった場合、使用キャッシュをクリアして正しい結果を得たい場合は、再起動する必要があるかもしれません。*Engine.ini で、またはテストの初期段階で Slate.CopyBackbufferToSlatePostRenderTargets を有効にすることをお勧めします。
PIE でポストバッファ更新ウィジェットのサイズを変更する場合、サイズ変更中一時的にサンプリング結果が黒/白になる場合があります。これは、サイズチェックに関してポストバッファ更新ウィジェットにはより保守的であるために起こります。PIE はエディタを描画するため、サイズ変更時の描画がよりアクティブになるため、これは PIE でのみ起こります。スタンドアローンやシッピング ビルドでは起こりません。
