【unity】スムースカメラxピクセルパーフェクトのキャラ移動を実装せよ!!Pro Camera 2Dでなめらかな移動を実現する!

unity2021.1.7f1にて解説。

この記事でPro Camera 2Dのセットアップが完了したゲームクリエイターの皆様。ボンジューゥ。砂塒です。

あなたのゲーム世界に無事スムースカメラが設定されたお祝いは、フランス革命後のパリの夜に咲いた大輪の花火のような大きな盛り上がりを見せたことと思う。

その喜びを胸に、今日も新しいミッションに取り掛かりたい。

え?Pro Camera 2D持ってない?
こちらからどうぞ🤲

ということで、今回のテーマは

・キャラクターをスムースカメラxピクセルパーフェクトを維持しながら、キーボードで操作できるようにする方法 with Pro Camera 2D

である。

ただの移動チュートリアルなら星の数ほど解説されている。
しかし、

①ピクセルパーフェクトを維持する。
②スムースカメラを適用する。

この条件で、トップダウン2Dゲームの移動を実装する情報には中々お目にかかれない。(個人的見解だが)

ならば自分が書いてしまえ。というわけである。

なお、先にも述べたが、このポストはこの記事を読んでカメラの設定が完了した方向けだ。
しかし単にゲームオブジェクトの移動を実装する方法が知りたい方にも有益である。

是非参考にしてほしい。

では始めよう。

1.移動に必要なコンポーネントをアタッチする

まずは、プレイヤーキャラクターの移動に必要なコンポーネントをアタッチすることろから始める。
必須コンポーネントは2つだ。

・Rigidbody 2D

・Player Controller(C#スクリプト)

である。

まずはRigidbody2Dからアタッチしよう。


a.2Dリジッドボディのアタッチと設定

🚩①ヒエラルキーでプレイヤーを選択する。

🚩②インスペクターの「コンポーネントを追加」をクリックする。

🚩③検索窓に「rigid」と入力する。

🚩④リストから「2Dリジッドボディ」を選択する。


インスペクターにRigidbody2Dを追加したら、以下の設定を行う。

🚩①重力スケール > 0に設定。

🚩②補間 > 補間に設定

🚩③Constraintsをクリックする。

🚩④回転を固定(Z) > チェックを入れる。

以上の設定は、トップダウンの2Dゲームを作る際のお約束である。


b.コントローラースクリプトのアタッチ

続いてキー入力を検知して、ゲームオブジェクトの位置を変化させるためのコンポーネントをアタッチしたい。しかし、そのようなコンポーネントはunityにはデフォルトで用意されていない。よって、自分で用意することになる。

オリジナルの挙動を持ったコンポーネントは、C#スクリプトを記述することで作ることができるわけだ。

🚩①プロジェクト内で右クリックする。

🚩②作成 > C#スクリプトを選択する。

🚩③ブルーライン状態で生成されたC#スクリプトに名前を付ける。
> 名前は<PlayerController>とする

※スクリプトの作成時には以下を意識すること。

  • ブルーライン状態で確実に名前をつけること。
  • 各単語の先頭が大文字で後は小文字になるように(Pascal 形式で命名)すること。

次は、作成したスクリプトをプレイヤーへアタッチする。

🚩①ヒエラルキーでプレイヤーを選択する。

🚩②作成したPlayerControllerをインスペクターにドラッグする。

次はPlayerControllerに実際にソースコードを記述していく工程に移る。


2.C#スクリプトの記述

a.IDEの起動

ゲーム制作の醍醐味。落胆と歓喜のるつぼ。C#によるプログラミングへようこそ。
C#のコーディングは外部エディターや、Visual StudioなどのIDEで行う。

では、起動しよう。

🚩プロジェクト内の「PlayerController」をダブルクリックする。

もしくは

🚩①ヒエラルキーでプレイヤーを選択

🚩②インスペクターの「PlayerController」コンポーネント内、スクリプトPlayerControllerをダブルクリックする。

これでIDEが起動する。


b.コーディング

これが、移動を実装するためのソースコードである。
ベストは、すべて自分で手打ち入力することだ。
己の血肉になる速度とコーディングに対する理解度と解像度が、コピペと比べて段違いで高くなる。

しかし、コピペの方があなたの貴重な時間を圧縮できるのも確か。
好きな方を選んでほしい。

ソースコードの右上のバインダーアイコンをクリックすると、ソースコードをコピーできる。

🚩下記のソースコードを、自分のPlayerControllerへ入力する。

入力が終わったら、保存してunityへ戻ろう。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PlayerController : MonoBehaviour
{
  public Rigidbody2D myRB;

  public float moveSpeed;

  public float moveX;
  public float moveY;

  public Vector2 moveDir;


  void FixedUpdate()
  {
    moveX = Input.GetAxisRaw("Horizontal");
    moveY = Input.GetAxisRaw("Vertical");

    moveDir = new Vector2(moveX,moveY).normalized;

    myRB.velocity = moveDir * moveSpeed;

  }
}

c.Rigidbody2Dのmy RBへのアタッチ

unityに戻ったら、playerControllerのmy RBへ、自身のRigidbody2Dをアタッチする。

🚩①ヒエラルキーでプレイヤーを選択する。

🚩②インスペクターのRigidbody2Dを、PlayerControllerのMy RBへドラッグする。


次にPlayerControllerのMove Speedの値を変更する。

🚩①ヒエラルキーでプレイヤーを選択する。

🚩②インスペクターのPlayerControllerのMove Speedを1.5にする。
※移動速度は画像インポート時のPPU設定に大きく係わる。
移動が速すぎる・遅すぎる場合は、値を適宜変更してみよう。


3.動かしてみる

もう、動く。

テストプレイをしてみよう!

🚩再生ボタンをクリックする。

ドットのゆがみがなく、スムースなカメラ移動

いかがだろうか。
ちゃんとピクセルパーフェクトを維持したまま、スムースなカメラとともにキャラクターが移動しただろうか。

もし上手く動かない場合や、エラーが出るなら、上記手順に不備がないか、しっかりと確認しよう。

4.まとめ

今回は実装することにウエイトおいて解説を行った。
中には、「なぜこの設定をするのか?」「ソースコードの意味がわからない。」という疑問をお持ちの方もいるかもしれない。

そんな方のために、いずれ技術解説パートをいずれ追加したいと考えている。

あなたがunityからUE6に乗り換えるまでには執筆できたらいいな。

でも、それはまた別の話。🎮

BOOTHでドット絵素材のお店やってまーす。

下のハートボタンは、砂塒のやる気スイッチに直結している。
押すなよ~!絶対に押すなよ~!

・・・押してよぉぉぉぉ~!!!

コメントを残す