UE4でIBLのHDR天球画像を動的に変更する方法

やりたいこと

UE4 で HDR 画像を使った IBL (Image-Based Lighting) において、天球画像をアプリ実行中に変更したい。
下の画像はスターターコンテンツの Advanced_Lighting マップです。ゲーム実行中にキー押しなどのイベントが発生した際にライティングを別のものに変更するやり方をこの記事では説明します。

ibl_combined2

使用したバージョンは UE4.12.5 で、Mac OSX 10.10.5 と Windows 10 で動作確認しました。

HDR画像を用意する

使いたい HDR 画像を用意します。手元にない場合は http://www.hdrlabs.com/sibl/archive.html などからフリーの画像を入手できます。この記事ではそのサイトの Tropical Beach を利用しました。

セットアップ

スターターコンテンツの Advanced_Lighting マップを利用すると、HDR 画像による IBL が初めからセットアップされているので作業が簡単です。このマップを直接改変するか、あるいはコピーして新しいマップを用意して作業を始めます。

ibl_default

まずは HDR 画像をプロジェクトにインポートします。好きな場所(StarterContent > HDRI とか)に画像をインポートします。この記事では上記のサイトからダウンロードした Tropical_Beach_3k.hdr をインポートしました。アウトライナで BP_LightStage を選択し、詳細から HDRI Cubemap の項目を今インポートした画像に差し替えます。トロピカルな感じになりました。

ibl_tropical

やりたいのは、このような天球画像の変更をエディタ上ではなくゲーム中に動的に変更することです。BP_LightStage の HDR 画像をはじめの画像(HDRI_Epic_Courtyard_Daylight という、スターターコンテンツのHDRIフォルダにあるやつ)に一旦戻しておきます。

ブループリントの編集

BP_LightStage のブループリントを編集します。ブループリントを開いたらイベントグラフのタブをクリックします。そして下記のようなノードを組みます。キー押しによって画像を変更させるという処理です。

ibl_bp01

Set Texture Parameter Value ノードは Context Sensitive(状況に合わせた表示)をオフにしないとノード作成時に選択肢に表示されないかもしれません。このノードの Target インプットには SkyboxMaterial 変数を指定します。ParameterName インプットには HDRI_Cubemap と記入します。Value インプットには使いたい HDR 画像(この記事の場合では Tropical_Beach_3k)を指定します。

Set Texture Parameter Value ノードで画像変更の命令ができますが、その時点ではその変更は画面に反映されません。続いて RecaptureSky ノードを実行することで再レンダリングがなされ、ゲーム内の映像に反映されます。なお、RecaptureSky は処理が重く、動作に一瞬ラグが生じるので、ランタイムで連続的に実行するような用途には向きません。

もう1つの作業として、BP_LightStage が入力を受け付けるようにさせる必要があります。エディタで BP_LightStage を選択し、詳細で Input(下の方にあるはず)にある Auto Receive Input の項目を Player0 に選択します。これで BP_LightStage のブループリントで入力イベントが動くようになります。

ゲームを実行してキーボードの 1 キーを押すと、ブループリントで指定した画像に照明が変更されて背景や球の写り込みが変化します。やったね!

下記は、2つのキーで2つの天球画像を切り替えられるようにしたものです。キーを交互に押すと、天球が切り替わってから球体表面の反射(写り込み)が変化するまでに少しの時間的ラグがある様子が確認できます。

ibl_bp02

参考にした記事

Sky Lights(スカイライト)
反射環境
 Unreal Engine の公式ドキュメント

List of sites with free HDRi
 フリーの HDR 画像を配布しているサイトのリスト

コメント