【Unity】Live2D(ver 2.1)の使い方

3.0が春頃にリリースされましたが、2.1の方が情報が豊富であったり安定していることもあるため、 こちらを使うこともあります。

SDK

以下よりCubismSDK 2.1 for Unityをダウンロード
http://sites.cybernoids.jp/cubism-sdk2/unity2-1

ダウンロードしたら、zipを展開したフォルダをAsset内に配置。 ただし、sampleも一緒に配置するとエラーが出るためsampleは削除します。

読み込み

mocやmtnファイルを.bytesをつけてTextAssetにする必要があります。

変換用のスクリプトを配置

以下の変換用のスクリプトをAsset内に入れておくと、Live2D関連の素材を読み込む際に自動的にTextAssetにしてくれます。

Unityで拡張子を変換するエディタ拡張 - Qiita

Live2Dのファイルを配置

各種モデルデータやアニメーションのデータをAsset内に配置します。 先ほどのスクリプトにより、TextAssetとして使用できるように変換されるはずです。

Simple Modelをコピー

SDKの中にあるサンプルの1つ「Demo」から「Simple Model」のスクリプトをコピーして適当な場所に置きます。 (sample/Demo/Assets/Scripts/SimpleModel.cs)

Hierarchyに配置

空のGameObjectを作成し、Simple ModelをAdd Component。 そこにMoc FileやTextureを設定します。 初回は再生するまで表示はされません。

パラメータを更新

パラメータは「setParamFloat」のidにLive2Dのエディタで設定したIDを指定し、valueを設定します。

live2DModel.setParamFloat(id, value);

一通り設定した後に「update」を呼びます。これを呼んだ後はアニメーション等の変更がきかなくなるため呼び出し順に注意が必要です。

live2DModel.update();

瞬きや呼吸を設定

瞬き

初期化

eyeBlink = new EyeBlinkMotion();

更新

eyeBlink.setParam(live2DModel);

ただし、目の開閉を標準パラメータで設定している必要があります。

自動瞬き機能 - Live2D Cubism 2 Manual

そうでない場合は、L2DEyeBlinkを拡張します。

呼吸

// DemoのSimpleModelより
double timeSec = UtSystem.getUserTimeMSec() / 1000.0;
double t = timeSec * 2 * Math.PI;
live2DModel.setParamFloat("PARAM_BREATH", (float)(0.5f + 0.5f * Math.Sin(t / 3.0)));

アニメーションを設定

v2でアニメーションを再生するためには少しスクリプトを記述する必要があります。 (余談ですが、v3からはAnimationClipが生成されるため、Mechanimで制御できるようになります)

流れとしては、以下の通りです。

MotionQueueManagerを用意

motionQueueManager = new MotionQueueManager();

モーションのファイル(.mtn)を[SerializedField]にセット

[SerializedField] protected TextAsset[] motionFiles;

startMotionにモーションを設定

var motion = Live2DMotion.loadMotion(motionFiles[index].bytes);
motionQueueManager.startMotion(motion);

Updateでアニメーションを更新

motionQueueManager.updateParam(live2DModel);

完了しているかどうかは「isFinished」で判定できます。

if(motionQueueManager.isFinished()){
    //...
}

モーションについて - Live2D Cubism 2 マニュアル

表情と体のアニメーションを分ける

表情のアニメーションとそれ以外のアニメーションを用意し、 それぞれを再生することで表情と体を別に再生できます。 同じポーズで表情を変えたい場合に有効。

上記「アニメーションを設定」のmotionQueueManagerを2つ用意し、 1つを表情、もう一つを表情を除いた体のアニメーションに割り当て、それぞれ設定/更新するだけです。

UnityでLive2Dの複数モーション再生 - Qiita

リップシンク

SDKのサンプル「LipSync」を見ると、 AudioSourceのボリュームからPARAM_MOUTH_OPEN_Yの値を変更していることがわかります。 詳しくはサンプルを参照(※v3でも同様にできます)。

物理演算

TextAssetのphysicsFileをセットし、読み込んだ後、Updateで更新します。

読み込み

physics = L2DPhysics.load(physicsFile.bytes);

更新

physics.updateParam(live2DModel);

体のパーツの切り替え

例えば様々な腕の動きをしたい場合、1つの腕のイラストでは限界があります。 そんな時は「pose.json」を設定し、パーツを切り替えることで対応できます。

使い方は物理演算と同じです。

読み込み

pose = L2DPose.load(poseFile.bytes);

更新

pose.updateParam(live2DModel);

03. ポーズの設定 - Live2D Cubism 2 マニュアル

タッチ判定

mousePositionなどをうまくLive2D内のPointに変換し、特定のパーツ内にあるかどうかでタッチ判定を行います。

  1. position @ScreenPoint
  2. position @WorldPoint
  3. position @LocalPoint
  4. position @Live2D内のPoint
  5. パーツIDを指定し、頂点内にあるかどうかをチェック

以下のリンクが参考になります。
How to make character respond to touch? — Live2D Community

RenderTexture

パーツ単位での透明度は設定できますが、それでは本来見えない部分が見えてしまったりと不自然になるため、 全体を1つのTextureとして扱い、透明度を変更することで自然なフェードができます。 専用カメラを用意し、RenderTextureに描画します。 ただ、OnRenderObjectはカメラ分描画処理をされてしまうため、注意が必要です。

UnityでLive2Dを簡単フェードインアウト - Qiita

参考