今回は、当たり判定付きのカメラが使える Cinemachine について説明します。
Cinemachine の説明は、ググったら色々な方のブログが出てくると思いますので省略します。
ところで、自キャラを女騎士さんで作るって言ってたの忘れて、鎧のおっさんで作り始めてしまいました。基本的には同じ方法で動きます。
キャラクタの準備
Scene 内に Plane と Cube だけで、キャラクターがいない状態から説明します。以前配置したキャラクターが画面内にある場合は、そのまま使ってもかまいません。説明の通り進める場合は、Hierarchy タブで該当するキャラクターを選択して削除してください。Cube は無くても問題ありません。
キャラクタを配置
Project タブで、Assets > Asset Packs > Knight > prefabs を選択します。そのフォルダ内の knightprefab を Scene 内にドラッグアンドドロップします。

以下の画像のように、左の Hierarchy タブ で knightprefab を選択した状態で、右の Inspector タブの Transform で右クリックし、Reset を選択します。

その後適当な位置に移動します。私の場合、Reset した場所に Cube があったので、(x, y, z) = (2, 0, 1) に移動しました。
LookTarget の設定
Cinemachine の FreeLook カメラが注視する場所を作成します。
新しく作らずにどこかのボーンを注視するように設定しても良いのですが、ボーンを指定するとローリングした際にボーンが上下するため、カメラが細かく上下に移動することになります。ずっと見ていると気持ち悪くなりますので、別にカメラ用の視点オブジェクトを追加します。
まず、Hierarchy タブの knightprefab の下の画像のカーソル位置の > をクリックして prefab を開きます。

次の画像のように Scene タブ内は暗くなり、Hierarchy タブ内は、たくさんの階層構造がひょじされます。

Hierarchy タブ内の階層構造を以下の状態まで閉じます。

階層構造の下の方で右クリックし、Create Empty を選択します。

GameObject という名前で作成されるので、LookTarget と名前を変更します。

Hirarchy タブで LookTarget を選択した状態で、右の Inspector タブ内の Transform で右クリックし、Reset を選択します。

矢印を引っ張って合わせるか、Transform の Position に直接値を入れて、首から頭の上くらいの適当な高さにLookTarget を設定します。
私は、以下の数値にしました。

Scene タブ内だとこの位置になっています。

Hierarchy タブの下の画像のオレンジの部分をクリックして Prefab を抜けます。

Hierarchy タブのLookTarget を選択した時に Scene タブ内のキャラクタに以下のように矢印が出ていればOKです。

余計なコンポーネントの削除
キャラクターに余分なコンポーネントが付いているので、外しておきます。
Hirarchy タブ内で、knightprefab を選択した状態で、右の Inspector タブを見ます。以下の Rotator (Script) と書いてある行の右端の点が3つ並んでいるところをクリックします。

そこで Remove Component を選択します。

同様に、Character Controller を削除します。(本当はCharacter Controllerを外す必要はないのですが、女騎士さんで同じ手順でできるようにするため1回外します)

Inspector が以下のようにCharacter Controller と Rotetor がグレーアウトされていれば OK です。

Transform 内の値は一緒である必要はありません。現時点でTag の部分は、Untagged になっていると思います。あとで上の画像のように設定するので、今はどちらになっていても問題ありません。
女騎士さんでやっている場合も、Transform と Animator だけにしておけば、OKです。
Cinemachine のインストール
Cinemachine は、以前はアセットストアから入手していましたが、今は Package Manger からインストールするようになっています。
Cinemachine のインストール
以下のようにして、Package Manager を開きます。

以下のように、「All packages」にして、Cinemachine を選択し、Install ボタンを押します。

Cinemachine Example Scene はインポートしないようにします。

FreeLook Camera の追加
Cinemachine をインストールすると メニューバーに Cinemachine という項目が増えています。そこからCreate FreeLook Camera を選択します。

FreeLook カメラを追加すると、以下のように CM FreeLook1 が追加されます。

Inspector に CinemachineFreeLook が入っています。(設定は後述)

ちなみに、Main Camera には、CinemachineBrain が追加されます。つけた覚えがないと言って消さないようにしてください。

FreeLook Camera の設定
CM FreeLook1 を選択した状態で、以下のように knightprefab と LookTarget を Follow と Look At にドラッグアンドドロップします。

Follow と LookAt が以下のようになっていれば OK です。ドラッグアンドドロップがうまくできない場合は、Follow と LookAt の右端にある ⦿ をクリック、その中から検索して選択することもできます。

上から順に設定していきます。

ここまでのところは設定の変更なしです。
Lens の Near Clip Plane の値を小さくするとカメラが自キャラにめり込みづらくなるのですが、あまり値を小さくすると画面がちらつくようになります。特にいじらないのが無難です。
次の部分の説明に移ります。

ここで一番重要なのは、Y Axis の Input Axis Name と X Axis の Input Axis Name です。これを前回設定したPS4のコントローラーの右スティックの名前にしてください。私と同じ設定になっているなら、それぞれ、”Vertical Stick-R” と “Horizontal Stick-R” にします。
お好みで Invert を設定します。ゲームをする際にカメラ設定をいじる方は、ここを調整する必要があります。一般的な設定は、Y も X も両方ともInvert のチェックを外した状態です。
あとは、Accel Time と Decel Time を 0 にします。これは、カメラの動き始めをゆっくりにする時間の設定です。キビキビ動いてほしいので、私は 0 にします。
Orbits の Biding Mode でカメラの動きを決めます。私が確認したのは「World Space」と「Simple Follow With World Up」だけです。

次回以降になりますが、移動ができるようにした後、横にスティックを入れたときの動きが変わります。
私の作るスクリプトでは、Word Space にした場合、スティックを横に倒すとキャラの横をカメラが並走します。したがって、いつまでもキャラが真横に歩きます。
Simple Follow With World Up にしておくと、スティックを右に倒した場合に、カメラが微妙に遅れてついていくので、少しずつ右に回っていきます。ダークソウルはこちらに近い動きをしています。文章だとよく分からないと思いますので、とりあえず、デフォルト値になっているこちらにしておいてください。(時間に余裕があれば、動画をつけます)

続いて、Orbits 内の TopRig, MiddleRig, BottomRig の Height と Radius ですが、カメラがどのくらいの位置を移動するかを設定します。
画像では、デフォルト値からいじっていますが、デフォルト値ままで良いと思います。
ちなみに空を飛べるようにするプロトタイプを作った時は、Topから順に (6, 8) (2.5, 6) (-3.5, 6) にしていました。
次は濃いグレー内のTopRig, MiddleRig, BottomRig についてです。

Aim を Hard Loo At にしています。Aimは理解していないのですが、設定値が少ないのでこれが一番軽いのではないかと思ってこれを選んでいます。

ここまでが、標準のFreeLook カメラの設定です。
コライダーの追加
カメラに当たり判定をつけて、壁にめり込まないようにします。
以下のように Add Extension の (select) から CinemachineCollider を選択します。


Ignore Tag で Player を指定しておきます。これを設定しておかないと、高速で移動する際にカメラがガタガタ前後動いてしまいます。原因はよく分かっていないのですが、注視点から Ray が飛ぶときにキャラの頭部のポリゴンにあたっているのではないかと思っています。ここで Player を設定し、自キャラの Tag を Player にしておけば、この問題は発生しません。

ひととおり設定したのが以下の画面。Minimum Distance From Target をデフォルト値より少し大きくしてあります。

Player Tag の設定
前述のタグの設定を自キャラにも行います。
まず、Hierarchy で knightprefab を選択します。

Inspector タブの Tag を Player に変更します。


以上で Cinemachine の設定は完了です。
動作確認
正しく設定できていれば、次の動画のようにカメラをコントローラーの右スティックで動かせるはずです。
動画中で、カメラが Cube の裏に入りそうになると自動的に自キャラに側に寄って、 Cube を回避しているのが確認できると思います。
動かなければ
もし全く動かないようであれば、以下の場所を確認してみてください。
- 前回設定した Input Manger の Horizontal Stick-R, Vertical Stick-R の Axis が 3 と 6 になっていること
- Input Manger で設定している Horizontal Stick-R, Vertical Stick-R の名称が、CM FreeLook1 の Y Axis の Input Axis Name と X Axis の Input Axis Name 一字一句違わないこと。念のためコピペしてみる。
- コントローラーが有線でつないである(私は、たまにつなぎ忘れます)
- Game タブにフォーカスが当たっている(Scene がフォーカスされていると動きません)
他は、思いつかないです。
Cube の回避ができない場合。
- CM FreeLook1 に CinemachineCollider が付いていること
- Cube に Collider が付いていること
以上です。
次回は、キャラを動かしていきます。