本日は Unity の小ネタ枠です。
Unityでマウスの位置にUIを追従させる方法についてです。
マウスの位置にUIを追従させる
マウスの座標は Input.MousePosition で取得可能です。
docs.unity3d.com
本関数で取得できるのはスクリーン空間のピクセル座標なのでUIオブジェクトの位置指定に利用するため、Canvas内のローカル座標に変換する必要があります。
ピクセル座標を指定のCanvas内のRectTransformの座標に変換するには RectTransformUtility.ScreenPointToLocalPointInRectangle が利用できます。
docs.unity3d.com
サンプルシーン
サンプルシーンを作って動作を確認してみます。
Hierarchy で右クリックからマウスを追従するカーソルになる[UI -> Image]を作成します。
Image に画像を設定してマウスカーソルを作成しました。これをマウス位置に追従させます。
以下のサンプルスクリプトを作成しました。
・TrackingMousePosition.cs
using UnityEngine; public class TrackingMousePosition : MonoBehaviour { /// <summary> /// マウスポインターを投影するCanvasコンポーネントの参照 /// </summary> [SerializeField] private Canvas _canvas; /// <summary> /// マウスポインターを投影するCanvasのRectTransformコンポーネントの参照 /// </summary> [SerializeField] private RectTransform _canvasTransform; /// <summary> /// マウスポインターのRectTransformコンポーネントの参照 /// </summary> [SerializeField] private RectTransform _cursorTransform; void Update() { // CanvasのRectTransform内にあるマウスの座標をローカル座標に変換する RectTransformUtility.ScreenPointToLocalPointInRectangle( _canvasTransform, Input.mousePosition, _canvas.worldCamera, out var mousePosition); // ポインターをマウスの座標に移動する _cursorTransform.anchoredPosition = new Vector2(mousePosition.x, mousePosition.y); } }
スクリプトをシーンに設定し、Canvas とマウスカーソルになる Image オブジェクトへの参照を設定します。
これで準備は完了です。
シーンを再生してマウスを Game 画面上で動かすと、マウスの位置に合わせて Image オブジェクトが追従します。