JoyStickを画面に表示してプレイヤーを動かす(モバイル)|Unityゲーム制作

Unityの2DゲームでJoyStickをゲーム画面に実装してプレイヤーを動かしてみます。主にモバイルゲームで利用するコントローラーのイメージですね。

はじめに

Unityのバージョンは「2021.3.14f1」で作成しています。ゲーム画面にJoyStickを表示して操作することでプレイヤーを動かしていきます。

下記の画像を利用していきます。(実際には全く同じサイズの白色の画像を利用しています)Unityに取り込んでおきます。

実装開始

JoyStickでプレイヤーを動かす前に、InputSystemでプレイヤーを動かしていきます。

InputSystemでプレイヤーの移動

「2DObject」→「Sprites」→「Circle」を追加して、名前を「Player」にします。

PackageManagerから「InputSystem」をインストールします。

インストール後、Playerオブジェクトに「PlayerInput」を追加します。

PlayerInputの「CreateActions…」を選択して、ファイル名を「Player」にして保存します。

スクリプトの作成

下記スクリプトを作成します。InputSystemを利用して、キーボード入力、ゲームパット入力を受け付けています。

using UnityEngine;
using UnityEngine.InputSystem;

public class Player : MonoBehaviour
{
    private float speed = 10.0f;
    private Rigidbody2D rb;
    private Vector2 movement;

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

    private void FixedUpdate()
    {
        rb.MovePosition(rb.position + movement.normalized * speed * Time.fixedDeltaTime);
    }

    private void OnMove(InputValue value)
    {
        movement = value.Get<Vector2>();
    }
}

Playerオブジェクトに「Rigidbody2D」を追加して、GravityScaleを0に。作成したスクリプトも追加します。

実行して、キーボードを入力すると下記のように動きます。

JoyStickを実装

次にJoyStickを画面に表示して操作できるようにしていきます。

まずは「PackageManager」のInputSystemのsampleから「On-ScreenControls」をインポートします。

「UI」→「Image」を追加して名前をjoystickに変更します。

SourceImage(画像)をjoystickの外側の画像に変更して、位置を好きな場所にします。

配下に、インポートした「On-ScreenControls」のStickプレハブを追加します。SourceImage(画像)をjoystickの内側の画像に変更します。

配下のTextは削除しておきます。

この状態で実行してjoystickを動かすと下記のようにプレイヤーが動きます。

補足

内側の画像の動く範囲は「MovementRange」で調節することができます。今回はデフォルトでいい感じなのでそのままです。内側のステックの移動範囲を変更する場合は、値を変更します。

動かない、動きが変な場合は、PlayerInputの「DefaultSchme」や「Auto-Switch」を変更すると最適化されることがあります。

タイトルとURLをコピーしました