【UE4】VRでの字幕UIの作り方

VR開発での字幕UIの作成例を紹介します。
作成するアプローチ方法は今回の方法以外にもあると思います。また、プロジェクトごとに実装の最適解も変わってくると思うのであくまでも一例として参考にしていただけたら幸いです。

前提

VRでのUIは基本的に3Dで作る必要があります。

そのため、2DUIよりも空間的にどう表現するかUIごとに考える必要があるかと思います。
今回作る字幕UIは視線前方より若干下に常に配置され、他オブジェクトと重なる場合は手前に（重ならない位置に）表示するようにしたいと思います。

作成手順

１．プロジェクト作成

まずは VRテンプレート をベースにプロジェクトを作成します。

２．字幕Widget作成

字幕として表示する Widget Blueprint を作成します。

中身は Text Block を配置しただけです。

３．Spring Arm の追加

VRTemplate > Blueprints から VRPawn を開きます。

Camera コンポーネントの下に Spring Arm コンポーネントを追加します。

この Spring Arm コンポーネントがとても優秀でこのコンポーネントを追加するだけで、"前提" で書いていた「他オブジェクトと重なる場合は～」という部分が作れます。
よくキャラクターとカメラの位置を補間するために使われたりします。

各パラメーターを設定していきます。

・衝突判定チャンネル
他オブジェクトとのレイトレース判定をこちらで設定したチャンネルで行います。
このチャンネルと衝突するオブジェクトには字幕UIが重ならないようになります。

・字幕との距離

・移動、回転時のラグの有無とスピード
こちらを設定すると頭（HMD）を動かした時やオブジェクトとの衝突時に遅れて移動するようになるので酔いにくくなります。

４．Widget コンポーネントの追加

Spring Arm コンポーネントの下に Widget コンポーネントを追加します。（Widget Interaction コンポーネントと間違えないように）

「２」で作成したWidget Blueprint を設定して、位置等を調整したら実装終了です。

まとめ

実装方法としては簡単ですが、割といい感じの動きをしてくれるのでコスパ良い実装方法かなと思っています。

また、前述したように Spring Arm コンポーネントはキャラとカメラの位置関係を補間するのに使いがちですが、今回のように他の用途でもとても優秀なので活用していきたいところです。

開発の参考になれば幸いです。

UE Version : 4.27.1-17735300