執筆: イチクマ
はじめに
ゲーム開発などで長時間モニターを見ながらのデバッグは辛い歳頃になりました。
最近、Unityのお仕事でPost-Processingを使う機会がありましたので、デバッグ用に調整できるようにしてみようと思い立ちました。
これで少しは目を守れるかな。
この記事の内容
Unity再生中にUIを調整してPost-Processingを動的に変更させます。
Post-Processingの導入や詳細については割愛しています。
以下参考にさせていただきました。
【Unity】ポストプロセシング(Post-Processing)を使ってプロ級の画面に
用意するもの
・Unity(2019 3.15f1)
・Post-Processingのインストール
手順
Post-Processingを準備
早速UnityでPost-Processingの準備をしていきます。
まずはPost-Processingを使えるように[Package Manager]からインストールします。
メニューから[Window] > [Package Manager]を選択します。
表示されたウィンドウ左の一覧から「Post Processing」を選択します。
ウィンドウ右下にある[Install]を選択します。
これで機能が有効になるので、あとはカメラ等設定をしていきます。
Sceneにある適当なカメラに「Post-process Layer」コンポーネントを追加します。
追加した「Post-process Layer」にLayerを設定します。
今回は画面全体に対して行いたいので適当に追加したレイヤーを選択します。
Hierarchyから「Create Empty」を選択し、新らにGameObjectを作成します。
作成したGameObjectに「Post-process Volume」コンポーネントを追加します。
追加した「Post-process Volume」の以下を変更します。
・Layerをカメラの「Post-process Layer」に設定したものと同じものに変更します。
・画面全体に影響を与えるため「Is Global」にチェックを入れます。
・「Profile」>「New」を選択して、「Post-process Volume Profile」を作成します。
Profileを作成すると「Add effect…」が表示されるので、適宜ボタンを押して、使用したいものを追加していきます。
今回は「Color Grading」と「Bloom」を追加しています。
UIの配置と連動
Post-Processingの準備ができたので、次に動的に変更するUIを配置していきます。
今回パラメータ変更に使うのはスライダーにしました。
テキストは編集項目とスライダーの値を表示するために2つ用意します。
Hierarchyから[UI] > [Slider]を選択してスライダーを追加します。
同じく[UI] > [Text]を選択してテキストを追加します。
適宜見た目を調整して上の図のようにします。
あとはスライダー、テキストともにスクリプトからアクセスできるようにし、スライダーの値が変わった際などに、テキストに値を反映させます。
以下がコードの抜粋です。
[SerializeField] Slider SliderPrm1 = null;
[SerializeField] Slider SliderPrm2 = null;
[SerializeField] Slider SliderPrm3 = null;
[SerializeField] Slider SliderPrm4 = null;
[SerializeField] Slider SliderPrm5 = null;
[SerializeField] Slider SliderPrm6 = null;
[SerializeField] Text SliderValueText1 = null;
[SerializeField] Text SliderValueText2 = null;
[SerializeField] Text SliderValueText3 = null;
[SerializeField] Text SliderValueText4 = null;
[SerializeField] Text SliderValueText5 = null;
[SerializeField] Text SliderValueText6 = null;
void Update()
{
SliderValueText1.text = SliderPrm1.value.ToString();
SliderValueText2.text = SliderPrm2.value.ToString();
SliderValueText3.text = SliderPrm3.value.ToString();
SliderValueText4.text = SliderPrm4.value.ToString();
SliderValueText5.text = SliderPrm5.value.ToString();
SliderValueText6.text = SliderPrm6.value.ToString();
}
参考ではUpdateでテキストを変更していますが、スライダーの値が変わった時(On Value Changed)が無難かと思います。
スライダーの最大、最小値は変更したいパラメータの範囲を指定します。
今回は以下を調整可能なパラメータとしましたので、それぞれ範囲に合った最小、最大値に値を変更します。
Color Grading
・Temperature(-100 ~ 100)
・Tint(-100 ~ 100)
・Saturation(-100 ~ 100)
・Brightness(-100 ~ 100)
・Contrast(-100 ~ 100)
Bloom
・Intensity(0 ~ 20)
UIの値から動的にPost-Processingを変更
UIでパラメータ変更の準備ができましたので、
最後に変更した値を動的にPost-Processingに反映させていきます。
パラメータ変更用の各種スライダーに呼び出し関数を登録していきます。
まずは適当なスクリプトに呼び出し関数を用意します。
用意した関数をスライダーの On Value Changed に設定します。
呼び出し関数では Post Process Volume を参照して、
スライダーの値を適宜反映させるパラメータに設定します。
以下がコードの抜粋です。
[SerializeField] PostProcessVolume PPvolume = null;
public void OnChangedConfigParam()
{
ColorGrading cg = PPvolume.profile.GetSetting<ColorGrading>();
cg.temperature.value = SliderPrm1.value;
cg.tint.value = SliderPrm2.value;
cg.saturation.value = SliderPrm3.value;
cg.brightness.value = SliderPrm4.value;
cg.contrast.value = SliderPrm5.value;
Bloom bloom = PPvolume.profile.GetSetting<Bloom>();
bloom.intensity.value = SliderPrm6.value;
}
あとは再生中に変更したいパラメータをスライダーにて調整するのみとなります。
以下実行サンプルとなります。
まとめ
今回はUnityでPost-Processingを動的に変更する方法を紹介しました。
起動時にスクリプトで調整する方法はいくつかあったのですが、動的な変更についてパッと見つからなかったので、試してみました。
デバッグ用途としてはシンプルな方法だと思いますので、目を大切にしたい方のお役に立てばうれしいです。