
キャラクターにジャンプをさせるにはどうすればいいのだろう。

そうだね、今まで学んだ内容に少し手を入れるだけなんだ。
ジャンプをマスターすることで、平面移動だけでなく、空中移動や障害物を乗り越えたりと、動きの自由度が格段に上がるので、是非覚えて、使っていこう!
▼完成イメージ▼
プロジェクトは前回の続きから始めていきますので、手順に不安のある方は以下の記事内容を先に実施してから、戻ってきてください。
では、早速始めていきましょう!
ここでは、キャラクターとアニメーションは、mixamoを使用します。
キャラクターの設定
まずは、キャラクターの設定をしていきます。
キャラクター[Worker]を選択し、Inspectorウインドウの[Add Component]>[Capsule Collider]をクリックします。

続いて、キャラクター[Worker]を選択し、Inspectorウインドウの[Add Component]>[Rigidbody]をクリックします。

[Capsule Collider]は、キャラクター[Worker]の背丈に合うようにパラメータを調整し、[Rigidbody]は、[Mass]を人の重さ(kg)程度に設定しておきます。今回はジャンプなので、Rotationに制約をかけておきます。

レイヤーの追加
次にレイヤーを追加します。
キャラクター[Worker]を選択し、Inspectorウインドウの[Layer]のプルダウンメニューをクリックし、[Add Layer…]をクリックします。

[Layers]の中で、空いている[User Layer○]に、キャラクター名(任意)を入力します。

前で設定したレイヤー名をInspectorウインドウの[Layer]のプルダウンメニューから選択します。

レイヤー変更の確認画面が表示された場合は、[Yes]をクリックします。

Input Actionの設定
Input Actionでコマンドを追加していきます。
Projectウインドウのキャラクター[Worker]の配下のInput Action[WorkerActions]をクリックします。

Input Actionが開きます。[Actions]の右の[+]をクリックして、アクション[Jump]を追加します。

アクション[Jump]にコマンドを割り当てるために、[Path]のプルダウンメニューをクリックして、検索窓で”Space[Keyboard]を探して、クリックして確定します。

[Use in control scheme]で、[Keyboard&Mouse]にチェックを入れます。

完了したら、[Save Asset]をクリックしてウインドウを閉じます。
これで、キーボードのスペースキーを押すと、Jumpを呼び出すことができます。
キャラクター[Worker]を選択し、Inspectorウインドウの[Player Input]>[Events]>[Player]>[Jump]から、[+]をクリックして、以下のように設定します。

キャラクターのインストール
キャラクターを選択します。
ここでは、mixamoのアニメーションを使用します。
ログインをして、[Animations]>[jump]>任意のアニメーションを選択して、[Download]をクリックします。

[Format]を[FBX for Unity(.fbx)]に変更し、[DOWNLOAD]をクリックします。

Unityエディタに戻り、メニューの[Assets]>[Import New Asset…]でダウンロードした「〜.fbx」ファイルを選択して、取り込みます。

Projectウインドウで、インポートしたアニメーション[SideJumping]を選択して、Inspectorウインドウの[Rig]を以下のように変更します。
※[Source]は、キャラクター[Worker]のAvatorを選択します。

同様に、Inspectorウインドウの[Animation]も以下のように変更します。
※ここでは、[SideJumping]に変更しましたが、わかりやすい名前であればOKです。

アニメーションの設定
Animationウインドウを変更していきます。
[Base Layer]を選択し、右クリックで[Create Sub-State Machine]をクリックします。

[Sub-State Machine]名をわかりやすいように変更します。(任意)

作成できた[Sub-State Machine]をクリックします。

Projectウインドウの任意のアニメーション[Walking]をドラッグして[Animator]に取り込みます。取り込んだアニメータを選択して、右クリックから[Set as Layer Default State]をクリックします。

次に、ジャンプのアニメーション[SideJumping]も同様にドラッグしてAnimatorに取り込みます。

最初に取り込んだアニメーション[Walking.com]を選択して、右クリックから[Make Transition]をクリックして、アニメーション[SideJumping]をクリックします。
[Walking.com]と[SideJumping]が矢印で結ばれます。

ここまでで、動作を確認します。
[▶︎]ゲームプレイをクリックします。
[Walking.com]のアニメーションが終了した後に[SideJumping]のアニメーションが再生されます。
アニメーションを[Walking.com]から[SideJumping]に移行されるために、ブーリアン型の変数を定義します。
[+]>[Bool]をクリックします。

アニメーション[Walking.com]と[SideJumping]を繋ぐ矢印をクリックして、Inspectorウインドウの[Conditions]から[+]をクリックして、プルダウンメニューから先ほど定義したブーリアン型の変数名を選択します。

スクリプトの追加
Hierarchyウインドウの[Worker]を選択し、Inspectorウインドウで、Script[WorkerController]をクリックします。

Scriptを以下のように入力します。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.InputSystem;
public class WorkerController : MonoBehaviour
{
Vector3 moveDirection;
public float moveSpeed = 2;
public float maxForwardSpeed = 8;
public float turnSpeed = 50;
float desiredSpeed;
float forwardSpeed;
float jumpDirection;
const float groundAccel = 5;
const float groundDecel = 25;
Animator anima;
bool IsMoveInput
{
get { return !Mathf.Approximately(moveDirection.sqrMagnitude, 0f); }
}
public void OnMove(InputAction.CallbackContext context)
{
moveDirection = context.ReadValue<Vector2>();
}
public void OnJump(InputAction.CallbackContext context)
{
jumpDirection = context.ReadValue<float>();
}
void Move(Vector2 direction)
{
float turnAngle = direction.y;
float fDirection = direction.y;
if (direction.sqrMagnitude > 1f)
direction.Normalize();
desiredSpeed = direction.magnitude * maxForwardSpeed * Mathf.Sign(fDirection);
float acceleration = IsMoveInput ? groundAccel : groundDecel;
forwardSpeed = Mathf.MoveTowards(forwardSpeed, desiredSpeed, acceleration * Time.deltaTime);
anima.SetFloat("ForwardSpeed", forwardSpeed);
transform.Rotate(0, turnAngle * turnSpeed * Time.deltaTime, 0);
}
void Jump(float direction)
{
if (direction > 0)
{
anima.SetBool("SideJumping", true);
}
}
void Start()
{
anima = this.GetComponent<Animator>();
}
void Update()
{
Move(moveDirection);
Jump(jumpDirection);
}
}
動作確認
カメラのアングルを調整します。
Hierarchyウインドウの[CM vcam]を選択し、Inspectorウインドウで、任意のアングルに調整します。

[▶︎]ゲームプレイで動作を確認します。
スペースキーを押した時に、ジャンプのアニメーションに移行していれば完成です。
※Loop処理しているので、一度ジャンプのアニメーションに移行するとエンドレスでジャンプします。
以上です。お疲れ様でした。