UE5.5 GameplayCameras プラグインを触ってみた

# はじめに

ワールドに置いた定点カメラを切り替える仕組みを作ります。
ThirdPerson や FirstPerson を切り替えるのは公式ドキュメントの方にあるのでそちらにお任せしようと思います。

今までは`Set View Target with Blend` ノードなどを使って切り替えることができたと思いますが、今回は GameplayCameras プラグインを使って実装します。

公式ドキュメントはこちら
[Gameplay Camera System Overview](https://dev.epicgames.com/documentation/ja-jp/unreal-engine/gameplay-camera-system-overview)

[Gameplay Camera System Quick Start](https://dev.epicgames.com/documentation/ja-jp/unreal-engine/gameplay-camera-system-quick-start)

# 環境

Windows11
UE 5.5.0

# GameplayCameras プラグインについて

:::note warn

5.5 では Experimantal なので今後機能や UI が変わる可能性があります。
:::

このプラグインはカメラアセットとして用意されている専用のエディタで、カメラの制御を定義し、このカメラアセットを複数の GameplayCamera コンポーネントに適用することでカメラの動作を複数のアクターで再利用することができます。

## 1. カメラアセットの作成
まずプラグインを有効にしましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/24669c3d-bd6f-f0d8-faea-2913645897b3.png)

カメラアセットを作成します。
コンテンツブラウザ右クリックから作成します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/11f3a1ab-d114-b915-c63c-23f4588bc166.png)

`Single Camera Director` を選択します。アセット名は `CA_TestCamera` としました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/f3e79686-b498-5d24-ce55-82c2c3fbb872.png)

作成したカメラアセットを開きます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/1311dc5b-bee2-a7ed-0123-a706d440d0e4.png)

軽くエディタの解説をします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/bb00865e-7d5e-4db8-2690-62c22e036a7d.png)

上記のカメラアセットのエディタのタブの中で以下の三つの項目によってカメラの動作を定義していきます。

- Director（Director ブループリントの設定）
- Rigs（Camera Rig を定義する）
- Shared Transition と Transition（どの Camera Rigでも使える共有遷移と各 Camera Rig の遷移の定義する）

それぞれ解説します。

### Camera Rig
ノードベースでカメラの動作を定義したもの。
一つのカメラアセット内に複数のカメラリグを定義することができる。

例えば、ThirdPerson の視点、FirstPerson の視点、カスタムの視点などのような感じ

### Director
ゲーム中のある時点でどの Camera Rig が有効になるかを管理する。
以下の4種類が用意されています。


| ディレクターの種類        | 説明                                                                                       |
|:----------------------------|:------------------------------------------------------------------------------------------|
| BlueprintCameraDirector     | 特定のCamera Rigを選択するロジックを BP で記述できます。                               |
| SingleCameraDirector        | 単一の選択されたCamera Rigのみ有効化され、BP や選択ロジックの記述はできません。       |
| StateTreeCameraDirector     | StateTreeを利用して、どのCamera Rigを有効化するかを決定します。                              |
| PriorityQueueCameraDirector | 複数のサブディレクターを持ち、最も優先度の高いディレクターが Camera Rig を決定します。         |
# Transition

各 Camera Rig の開始および終了の遷移方法を定義できます。
Shared Transition というもので複数の Camera Rig で共有の遷移を利用することもできます。
現状は以下の4種類が用意されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/d1f60f0b-b6e4-c1c1-a6ee-7cb0e19df04f.png)


早速実装していきます。
Camera Rigs からすでにある Rig をリネームして `SingleCamera` としました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/af4fe3fe-04f1-2b1f-91f5-060857fd4d08.png)

次に Rigs タブを開いて以下のようにノードを組みます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/dccead6e-f907-10f5-b36e-ff9b0faac174.png)
次に各ノードの設定についてみていきます。

Occlusion Material ノードはカメラの視界を遮るオブジェクトなどに半透明などのマテリアルを適用してプレイヤーの視界を確保することができます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/e6e65ea0-655d-a457-5f20-f4efd0eb609c.png)

ここでは Blend Mode を Translucent にして以下のノードを組んだマテリアルを用意して適用します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/a73a93c6-4386-2e3f-baf3-1a99d987d9ac.png)

FOV はデフォルトの90のままでいきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/26e01cfd-e099-c870-6ca7-3490948cc208.png)

次はディレクターの設定です。
Camera Rig は今回一つしか作らないので先ほど作成した Camera Rig の SingleCamera を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/d3ce4e26-ce20-f8ba-30a2-50f25aaf18c2.png)

次に Transition の設定をします。以下のようにノードを組みます。
設定などはデフォルトのままです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/bc243cda-fc6c-9a64-2b7d-2049ddbd1e0b.png)

これでカメラアセットの作業が終わったのでビルドボタンを押して保存しましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/952de0c9-e6e6-e15c-55ac-44a67e47ecfa.png)

# 2. カメラアクターの作成
カメラアセットができたらカメラアセットを適用するカメラアクターを作ります。
`GameplayCameraActor` を継承したブループリントアセットを作ります。
アセット名を`BP_CamraActor`としました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/4f66b9cd-85ee-d207-b5fd-34864378a1ba.png)

アセットを開いて、クラスのデフォルトの詳細欄から先ほど作成したカメラアセットを設定します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/7e804eba-6600-9da2-d0c2-56daf2fcf738.png)


レベルを作成し、BP_CamraActor を以下のように配置しました。
真ん中の壁はカメラオクルージョンを試すために配置しています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/57a1a173-6265-4b4e-af1e-affdc86eb127.png)

次にカメラ切り替えロジックを組みます。
レベルブループリントを開き、以下のように組みました。
R と T キーを交互に押すことによってカメラの切り替えを実現しています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/0945976f-a399-a1c6-f221-12444309a65e.png)


実行してみます。
カメラの切り替えとオクルージョンが効いていますね。
![original-min.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2953062/2144f784-0d70-fb15-442d-90cbcbf66893.gif)

# おわり

従来は Character にアタッチされているカメラコンポーネントを取得したりして色々処理を書いていたと思いますが、ここら辺がカメラアセットに置き換わり、カメラノードで処理が書きやすくなって再利用もできてとても強力なので、将来的にはメインで使っていきたいですね～
ここまで読んでいただきありがとうございました。