*当ブログではアフェリエイト広告を利用しています。

unity

【Unity】Unityでドット絵キャラを動かしてみる!

momeq
モー
モー

今回は、unityを使ったドット絵キャラの動かし方をみていきます。

ニャー
ニャー

unityでは2Dでも3Dでも動かせるけど、初めての場合は、2Dから動かしてユニティの動かし方を学ぶのが良いんだにゃ。

<今回作成したもの↓>

今回のテーマは2Dドット絵キャラの動かし方です。個人的にはunityを始めて一番最初に通る関門だと思っています。

  1. ドラクエなどのRPG風動かし方
  2. マリオなどのアクションゲーム風動かし方
ドット絵キャラの動かし方は2パターン
  • ドラクエなどのRPG風動かし方
  • マリオなどのアクションゲーム風動かし方

1は、マップを平坦にみるので、上下左右を自由に動けるのに対し、2は基本的には左右、上下は重力によりジャンプしたり、落下してのアクションといった感じですね。

今回動かしたのは、1のRPG風の動かし方です。重力や当たり判定などが必要ないので、比較的簡単なため、初めての方の練習にはちょうど良いと思います。

それではみていきましょう。

作成環境と動かすドット絵

作成環境

  • 使用ソフト:Unity version 2021.3.4f1 LST
  • 作成環境:MacBook (2020)
  • ドット絵作成:Asepriteで作成後、GIFで書き出し、PNGに分割したもの
モー
モー

一応作成環境なんかから説明しておきますね。Unityは最新版ではなくLTS版を使用しています。

ニャー
ニャー

ドット絵は、有料版のAsepriteを使用しているんだにゃ。経験浅いからまだまだなんだけど、書いてみると面白いから、気になる人は使ってみると良いにゃ!

ドット絵

モー
モー

今回使用したのは、次のドット絵です。

16✖️16ピクセルで作っているから、ちょっと小さいんだにゃ。でも、ちゃんと歩いているように見えるかにゃ?

アニメーション作成

アニメーションの作成は、簡単です。

まずは、使いたいドット絵をAssetsウィンドからSceneビューへまとめてドラック&ドロップするだけ!簡単にアニメーションができます。

そうすると、アニメーションに名前をつけて保存ができるようになります。

保存をするとシーン上にアニメーションがついたキャラクターが登場し、アセット上にAnimationファイルとAnimatorファイルができます!

あとは、同様に前向き、横向きのアニメーションを作成します。

次に、アニメーターウィンドウを開き、その中に、それぞれのAnimationファイルを入れます。

アニメーターウィンド内で矢印を引っ張って切り替えもできるのですが、今回は、動きに合わせてアニメーションの切り替えをしたいので、スクリプトを書いていきます。

スクリプトについて

アニメーションや移動のスクリプトの書き方はいろいろありますが、今回は次のスクリプトを使用して、「neko_front」にアタッチしています。

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

public class Player : MonoBehaviour
{

    // どのアニメーションを使うかを入れる
    public string upAnime = "";
    public string downAnime = "";
    public string leftAnime = "";
    public string rightAnime = "";

    // 歩くスピード
    public float speed = 2.0f;

    // 今のアニメーション
    string modeNow = "";

    // 歩く方向と位置
    float vx = 0;
    float vy = 0;

    void Start()
    {
        // 初めは前を剥いた状態からスタート
        modeNow = downAnime;
    }

    void Update()
    {
        // 方向を常に0に戻す(戻さないと、ずっとその方向に進んでしまう)
        vx = 0;
        vy = 0;

        // 押した方角に移動し、アニメーションを指定する
        if(Input.GetKey("up")){
            modeNow = upAnime;
            vy = speed;
        }
        if(Input.GetKey("down")){
            modeNow = downAnime;
            vy = -speed;
        }
        if(Input.GetKey("left")){
            modeNow = leftAnime;
            vx = -speed;
        }
        if(Input.GetKey("right")){
            modeNow = rightAnime;
            vx = speed;
        }
    }

    void  FixedUpdate(){
        // 移動
        this.transform.Translate( vx/50, vy/50, 0);
        // アニメーションの切り替え
        this.GetComponent<Animator>().Play(modeNow);   
    }
}
モー
モー

基本的には、コードを見てもらえればと思いますが、概要は次のとおりです。

  1. Input.GetKey()でコマンド入力を受け付ける
  2. 押された方向により、キャラクターの位置とアニメーション遷移を行う。
  3. 位置の変更は、transform.Translateを変更する
  4. アニメーションはGetComponent().Play()で遷移させる。

最後に、スクリプトを適用しているneko_frontのinspectorウィンドに表れているパブリック変数に、各アニメーターの名前を入れれば、動きに合わせてアニメーションが遷移します。

記事URLをコピーしました