簡単にモーションをブレンドして使えるBlend Tree【Unity】【Blend Tree】 - (:3[kanのメモ帳]

(:3[kanのメモ帳]

個人ゲーム開発者kan.kikuchiのメモ的技術ブログ。月木更新でUnity関連がメイン。

(:3[kanのメモ帳]


本ブログの運営者kan.kikuchiが個人で開発したゲームです!


簡単にモーションをブレンドして使えるBlend Tree【Unity】【Blend Tree】


このエントリーをはてなブックマークに追加


この記事でのバージョン
Unity 5.3.4f1 Personal


はじめに

今回はUnityの便利システムの一つ、Blend Treeを使って

簡単にモーションをブレンドしてみる感じの記事です。


イメージとしては以下のような感じ。

なお、体が回転しているように見えますが、アニメーションが合成されているだけで、

Unityちゃんのrotationをコードから変えるということはしていません。


f:id:kan_kikuchi:20160729134706g:plain



f:id:kan_kikuchi:20160727134802p:plain
この記事はユニティちゃんライセンス条項の元に提供されています。


Blend Treeとは

そもそもBlend Treeとはなんぞやという話ですが。

複数のアニメーションを、それらすべての部分部分を異なる度合いで組み込むことによって、滑らかにブレンド(混合)できるようにするものです。


という感じのものです。


例えば前に歩くモーションと右に歩くモーションがあった際に、

それぞれを50%づつブレンドすることで、右前方にあるくモーションを表現する。

みたいな感じに使えます。


参考に以下が左から、

右、前方+右のブレンド、前方

のモーションを再生したものです。


f:id:kan_kikuchi:20160729141103g:plain

ブレンドしたやつがうまいこと右前方に体を向けているのがわかると思います。


Blend Treeの設定方法

ではでは、Blend Treeの設定方法です。

まずAnimator Controllerを作成、ここではAnimatorControllerとリネームしています。


f:id:kan_kikuchi:20160728133548j:plain


作成したAnimator Controllerを選択した状態で、AnimatorWindow を開き、


f:id:kan_kikuchi:20160728133624p:plain


AnimatorWindow上で右クリックした後、

Create State > From New Blend Tree を選択するとBlend Treeが作成できます。

なお、Entryから矢印が自動で設定されるます。


f:id:kan_kikuchi:20160728133659p:plain
f:id:kan_kikuchi:20160728133707p:plain


Blend Treeをクリックすると画面が変わり、Blend Treeの設定が行えるようになるので、

Inspector上から、BlendTypeを2D Simple Directionalにします。


f:id:kan_kikuchi:20160728133733j:plain


なお、BlendTypeについては以下を参照のこと。



次にAnimatorWindowのParametaタブでXとZのパラメータ(Float)を作成します。


f:id:kan_kikuchi:20160728133834p:plain
f:id:kan_kikuchi:20160728133851p:plain


さらにモーションをInspectorのAdd Motion Fieldで設定

今回は待機と前後左右歩行の計5つを以下のように設定します。

ついでにPrametersにXとZを設定します。


f:id:kan_kikuchi:20160728134114p:plain
f:id:kan_kikuchi:20160728134055j:plain


ここで設定したXとZによってモーションがブレンドされるようになります。

例えばXとZが共に0.5の場合、

Xが1のWALK00_Rが50%、Zが1のWALK00_Fが50%ずつで再生される。

といった具合です。


とりあえず設定は完了です。

これをUnityちゃんに設定すると待機モーションだけが再生される状態です。


f:id:kan_kikuchi:20160728134429j:plain
f:id:kan_kikuchi:20160728134435p:plain


Blend Treeを操作

設定が完了したのでBlend Treeをスクリプトから操作してみます。

操作といっても、さきほどAnimatorWindowのParametaで設定したXとZの数値を変更するだけ。

変更方法も以下のようにAnimatorのSetFloatを使うだけ!簡単!

GetComponent<Animator> ().SetFloat ("X"1); 


あとは移動する方向に合わせてXとZを-1~1の範囲で設定してやれば、

いい感じのアニメーションが再生されるはずです。


問題は移動する方向ですが、今回は以前作成したジョイスティックを使います。

使い方や設定方法は以下の記事を参照の事、簡単に使えるはずです。


f:id:kan_kikuchi:20160722133057g:plain


そのジョイスティックを使ってユニティちゃんを移動させつつ、

BlendTreeも操作するコードが以下の通り

using UnityEngine;
using System.Collections;

public class UnityChan : MonoBehaviour {

  //先ほど作成したJoystick
  [SerializeField]
  private Joystick _joystick = null;

  //移動速度
  private const float SPEED = 0.1f;

  private void Update () {
    Vector3 pos = transform.position;

    pos.x += _joystick.Position.x * SPEED;
    pos.z += _joystick.Position.y * SPEED;

    transform.position = pos;

    GetComponent<Animator> ().SetFloat ("X", _joystick.Position.x);
    GetComponent<Animator> ().SetFloat ("Z", _joystick.Position.y);
  }

}


これをユニティちゃんにAddし、ジョイスティックも設定、

ついでにカメラをユニティちゃんの子に設定します。


f:id:kan_kikuchi:20160729134640j:plain


すると……


f:id:kan_kikuchi:20160729134706g:plain


移動する方向に合わせていい感じにアニメーションがブレンドされるように!


おわりに

今回紹介したBrend Tree、便利な上に結構前からあるはずなんですが、

なぜかいままで知りませんでした……。


なお、Blend Treeは2Dでも使えます。



ブレンドこそされませんが、かなり簡単にアニメーションを切り替えられるので楽です(:3っ)∋〜