画像をクリックで移動する（オブジェクトの移動）。位置変更・速度追加【Unityメモ】

今回はUnity2Dゲームで、クリックした画像を動かす方法を実装していきます（オブジェクトを移動する）。

はじめに

Unityのバージョンは2021.3.14f1です。

オブジェクトをクリックで移動するのを実装します。移動の仕方や実装方法は色々ありますが、今回は位置を変更するのと、速度を与える例を見ていきます。

画像を移動（位置変更）

まずは下記のような瞬間移動のような移動方法です。

左にあった画像をクリックすると右に移る方法です。移動というよりは位置変更（場所移動）という感じですね。

位置の変更をスクリプトで実装

まずは動かしたい画像をSceneにドラッグアンドドロップします。今回使用した下記画像は「いらすとや」にあったものです。

Inspector画面にて画像にAddComponentから「BoxCollider2D」と「Move」と言う名前でスクリプトをアタッチします。

Moveスクリプトの中身は下記に変更します。

using UnityEngine;

public class Move : MonoBehaviour
{
    private void OnMouseDown()
    {
        transform.position = new Vector2(5, 0);
    }
}

OnMouseDownはコライダー上でマウスを押した時に呼び出されます。詳しくは下記公式リファレンスにて。

移動している感を出す

次に、画像を少しづつ動かして移動している風に見せます。下記のような感じですね。

再帰呼び出しを使う方法

Moveスクリプトを下記に変更します。

using UnityEngine;

public class Move : MonoBehaviour
{
    private float xPos;

    private void Start()
    {
        xPos = transform.position.x;
    }

    private void OnMouseDown()
    {
        xPos += 0.01f;
        transform.position = new Vector2(xPos, 0);
        Invoke("OnMouseDown", 0.01f);
    }

動かす関数内でInvoke関数を使って、再度動かす関数を呼び出す、再帰呼び出しをしています。これで画像の位置が少しづつ動き、移動しているように見えます。

2Dリジッドボディで移動

次に画像に速度を与えて移動させます。オブジェクトの移動と言えばこれが一般的かも。

AddComponentで「Rigidbody2D」を追加します。追加したらGravityScaleを0に。

次にスクリプトを変更して、下記のようにします。

using UnityEngine;

public class Move : MonoBehaviour
{
    private Rigidbody2D rb;
    private float speed = 3.0f;

    private void Start()
    {
        rb = GetComponent<Rigidbody2D>();
    }

    private void OnMouseDown()
    {
        rb.velocity = new Vector2(speed, 0);
    }
}

velocityは速度ですね。これでクリックしたらセットした速度で動くようになります。ちなみに、何度も画像をクリックするとドンドン加速するので、実際にはその制御なども必要です。

他にも動かし方は色々。何をどう動かすかによって当然、実装方法も変わってきますよね。「画像」という観点で見ると位置をずらすのもOKな気も。物体を動かすのなら今回のように速度を与えるほかに、AddForceで力を加える方法なども。