今回はマウスホイールでカメラの前後移動(ドリーイン、ドリーアウト)をスクリプトで制御する方法を試してみました。
ホイール回転を取得してカメラを移動する
まずはシンプルにマウスホイールを回転してカメラの前後移動を行います
シーンの作成
これまでの記事で使用している Area Light でライティングを行った部屋のシーンを使用します。
スクリプト
前後移動のスピードを変えられるように変数 speed を用意しました
using System.Collections; using System.Collections.Generic; using UnityEngine; public class CameraDolly : MonoBehaviour { // マウスホイールの回転値を格納する変数 private float scroll; // カメラ移動の速度 public float speed = 1f; // ゲーム実行中の繰り返し処理 void Update() { // マウスホイールの回転値を変数 scroll に渡す scroll = Input.GetAxis("Mouse ScrollWheel"); // カメラの前後移動処理 //(カメラが向いている方向 forward に変数 scroll と speed を乗算して加算する) Camera.main.transform.position += transform.forward * scroll * speed; } }
完成したスクリプトを[Inspector]ウィンドウで確認。speed フィールドに初期値の1が入っています。
動作確認
マウスホイールの回転に合わせてカメラが前後移動できるようになりました。
カメラの前後移動を制限する
カメラの移動範囲の制限方法を色々方法を考えたのですが、色々調べたもののよくわからなかったので、今回はコライダーを使った当たり判定で制限することにしました。
コライダーの配置
カメラ、ドリーイン、ドリーアウトの限界にSphere コライダーコンポーネントを配置します。
[Hierarchy]ウィンドウ > [Create] > Create Empty を選択して、空オブジェクトを2つ作成。名前を次のように変更します。
- Dolly In Limit -ドリーイン限界位置のコライダー
- Dolly Out Limit ドリーアウト限界位置のコライダー
Sphere Collider コンポーネントは Is Trigger のチェックを入れておきます。
MainCamera にもコライダーを追加。[Scene]ビューでシーンを右側から見ると、コライダーを配置した状態はこのようになります。左側が Dolly Out Limit、右側が Dolly In Limit コライダーです。
カメラの設定
MainCamera には Rigidbody コンポーネントを追加します。
[Inspector]ウィンドウ > Add Componen > Physics > Rigidbody を選択。
Rigidbody コンポーネントは Use Gravity のチェックを外し、スクリプトで移動を制御するので Is Kinematic のチェックを入れておきます。
スクリプト編集
スクリプトにカメラとコライダーの衝突判定を行い、カメラと衝突したら移動を停止する処理を追加します。
衝突判定は OnTriggerEnter と OnTriggerExit のメソッドで処理。コライダーはあらかじめ変数に格納して、衝突判定時に判別を行っています。
using System.Collections; using System.Collections.Generic; using UnityEngine; public class CameraDolly : MonoBehaviour { // マウスホイールの回転値を格納する変数 private float scroll; // カメラ移動の速度 public float speed = 1f; // ドリーインの限界判定フラグ private bool dollyInLimit = false; //ドリーアウトの限界判定フラグ private bool dollyOutLimit = false; // ドリーインの限界判定コライダーを格納する変数 public Collider dollyInLimitCol; // ドリーアウトの限界判定コライダーを格納する変数 public Collider dollyOutLimitCol; // ゲーム実行中の繰り返し処理 void Update() { // マウスホイールの回転値を変数 scroll に渡す scroll = Input.GetAxis("Mouse ScrollWheel"); //ドリーインの限界でホイールスクロール値が負の場合 if (dollyInLimit && scroll > 0) { // カメラの前後移動処理を行わない(0を加算して移動停止) transform.position += transform.forward * 0; } //ドリーアウトの限界でホイールスクロール値が正の場合 else if (dollyOutLimit && scroll < 0) { // カメラの前後移動処理を行わない(0を加算して移動停止) transform.position += transform.forward * 0; } //上記以外の場合(ドリーイン、ドリーアウトの限界でない) else { // カメラの前後移動処理 //(カメラが向いている方向 forward に変数 scroll と speed を乗算して加算する) Camera.main.transform.position += transform.forward * scroll * speed; } } // コライダーとの衝突した場合の判定処理 void OnTriggerEnter(Collider other) { // 衝突したコライダーが dollyInLimitCol の場合 if (other == dollyInLimitCol) { // ドリーインの限界判定フラグを有効 dollyInLimit = true; } // 衝突したコライダーが dollyOutLimitCol の場合 else if (other == dollyOutLimitCol) { // ドリーアウトの限界判定フラグを有効 dollyOutLimit = true; } } // コライダーとの衝突が解除した場合の処理 void OnTriggerExit(Collider other) { // ドリーインの限界判定フラグを無効 dollyInLimit = false; // ドリーアウトの限界判定フラグを無効 dollyOutLimit = false; } }
コンポーネントの設定
Main Camera を選択して[Inspector]ウィンドウ > CameraDolly (Script) コンポーネントを確認。
dolly In LimitCol とdolly Out LimitCol フィールドにそれぞれコライダーを割り当てます。
UIスライダーでドリー速度を変更できるようにする
最後にドリー速度をUIスライダーで変更できるようにしました。スクリプト CameraDolly にスライダー処理を追加するのがシンプルなのですが、今回はスライダーの処理を分けて別のスクリプト ChangeSliderValue を作成して、スライダーの値をスクリプト CameraDolly に渡すようにしました。
スライダーオブジェクトの作成
[Hierarchy]ウィンドウ > [Create] > UI > Slider を選択。[Inspector]ウィンドウ > Slider (Script) を選択。Min Value とMax Value を設定。 Whole Numbers にチェックを入れて5段階に切り換えるようにしました。スクリプト編集
スクリプトは Canvas 割り当てます。[Inspector]ウィンドウ > [Add Component]をクリック。名前 ChangeSliderValue でスクリプトを作成。
using System.Collections; using System.Collections.Generic; using UnityEngine; // GUIコンポーネントの関数を使用する宣言 using UnityEngine.UI; public class ChangeSliderValue : MonoBehaviour { // スライダーコンポーネントを格納する変数 public Slider slider; // スクリプト CameraDolly コンポーネントを格納する変数 public CameraDolly cameraDolly; // ゲーム実行中の繰り返し処理 void Update() { // スライダー値をスクリプト CameraDolly の変数 speed に渡す cameraDolly.speed = slider.value; } }
コンポーネントの設定
Canvas を選択して[Inspector]ウィンドウ > Change Slider Value (Script) を確認します。
Slider フィールドに作成したスライダーオブジェクト、Camera Dolly フィールドにはスクリプト CameraDolly を割り当ててある Main Camera をドラッグ&ドロップで割り当てます。
WebGL ビルド
完成したシーンを WebGL でビルドしました。画面右下のスライダーでカメラ前後移動の速度を変更できます。
画像クリックで再生されます。(ファイルサイズ:約16MB)
参考Webサイト
今回の記事はこちらのWebサイトを参考にさせていただきました。
【Unity】マウスホイールでカメラの向きにドリーイン・ドリーアウトさせる