UnityでLive2D #Unity

下書きだったのが邪魔なので公開に修正。
情報古いかも

とりあえず手っ取り早く動作確認

公式サイトからSDKのUnityの奴をダウンロード。
サンプルのDemoをUnityで開く

Editorフォルダを作成してSampleApp1のプロジェクトの中にある

Live2DImporter.cs を持ってくる。

これがmoc ファイルを moc.byteに自動変換してくれるスクリプト。

これがないと手動で.byteをつけないといけなかったりでmacで意外にもはまったのでこれはもう私の中で必須。

そのあとは
Modelerで書き出したmocファイルと画像ファイルなど一式と、アニメーションやviewerで作成した物理挙動のjasonなどを
Resoucesフォルダなどに入れる

そしてSampleシーンのLive2DModelのインスペクターを自分のモデルに差し替えるだけで動く

新規プロジェクトに作成

新規のプロジェクトにモデルと入れてみます
SDKの中のframework とdllを丸っとプロジェクトにいれて、
Live2DImporter.csもEditorフォルダに入れる

頭をなでたい

そして前回同様mocファイルなどをインポート。
そしてScriptは自前のものを作りたいので、作成します。
Demoのプロジェクトにあった、SimpleModel.csをベースに修正していくと楽です。
このファイルだけで物理挙動、マウスに合わせての挙動、自動目ぱち、呼吸などをやってくれます。
それぞれとめるのも簡単なので必要な時だけ自動で動くようにパラメーター化しておくといいかもです。

とりあえず頭を撫でられるようにしたいので、modelファイルをいじります
hit_areas の設定を追加します。
今回は頭のみしかあたり判定つけてないのでこれだけ。
physicsの定義もなかったのでついでに追加。


{
    "type": "Live2D Model Setting",
    "name": "AyumeguModel",
    "model": "AyumeguModel.moc",
    "physics":"physics.json",
    "textures": [
        "AyumeguModel/texture_00.png"
    ],
    "hit_areas":
    [
        {"name":"head", "id":"D_REF.HEAD"}
    ],
}

IDはモデラーでモデリングした時のIDを指定します。nameは適宜。
例えば右手、左手は両方handという感じで処理する場合はnameは両方共handと指定する感じです。

処理の方はサンプルだとSampleApp1のものがそうです。
ここの必要なScriptを持ってきてカスタマイズするのが早いです。
Scriptsフォルダ配下のsampleとutilsのスクリプトを一式持ってきます。
あとはEditorフォルダの Live2DImporter.cs CreateCanvas.csの二つも持ってきます。

メニューにLive2Dが追加されるのでLive2d->Create Live2D Canvas

これで一式設定されたものができるのでこれのインスペクタのL App Model ProxyのPathを自分のmodelファイルのパスにします。
私の場合はLive2DModels/AyumeguModel/AyumeguModel.model.json

これで実行すればパスがあっていれば表示されるはずです。
左が前の。右が今作ったモデル。デフォルトだとマウス追従はしない。

ちなみにこれだとバッチリMeshが作られます。画像のパスを間違えて指定すればわかると思いますがこんな感じに。

また、あたり判定の設定やよばれる関数の設定はLAppDefine.csをいじります。
headはもともとあるので今回は修正せずそのまま行っちゃいます。

頭をなでよう！

Cameraなどにとりあえずsampleフォルダの中のMyGameControllerをつけます
これがUpdateでマウス操作によるイベントを呼ぶやつなのでこれがないとタッチしても動かないです。

頭を撫でた時のよばれる関数などは
LAppDefine.csにもうすでに頭を撫でた時の関数があるのでこのままで動きます


  public const string MOTION_GROUP_FLICK_HEAD = "flick_head"; // 頭を撫でた時

また、よばれる関数はLAppModel.csにあります。
フリックした時がFlickEvent、タップした時がTapEventが呼ばれるのでその中でそれぞれのあたり判定などやってます。
なので部位により処理を分けるときはここに分岐を追加してあげます。
今回のあゆめぐちゃんはモーションは用意してないのでStartRandomMotionとかを呼んでいるところ周りを一式コメントアウトしないとエラーを吐きますが、モーションを設定している人はここで呼び出したいアニメーションなど設定できます。

頭のイベントはフリックとタップともにもともと設定してあるのでちょっと処理を変えてみます。
なでなでしたらよだれをたらし、　タップで口がへのじになるようにしてみます。

LAppModel.csのFlickEventをこんな風に直しました。


public void FlickEvent(float x, float y)
    {
        if (HitTest(LAppDefine.HIT_AREA_HEAD, x, y))
        {

        live2DModel.loadParam();// 前回セーブされた状態をロード
        live2DModel.setParamFloat("PARAM_MOUTH", 2); //口をへの字に
        live2DModel.saveParam();// 状態を保存

        //StartRandomMotion(LAppDefine.MOTION_GROUP_FLICK_HEAD, LAppDefine.PRIORITY_NORMAL);
    }
}

loadParamとSaveParamを呼ばないとパラメータの変更が反映されなかったのでこれを呼ぶようにしています。
同じように、TapEventの方も修正

ちなみに、カメラがデフォルトのMainCameraを使っていない場合、Canvasとかその場合幾つか修正するところがあります
・MyGameController.csのCameraがGameObject.Findしているのでそこを修正
・LAppView.csがCamera.mainで指定されているのでそこを修正。

これでクリックとフリックで挙動が変わるようになりました＾＾

はいここまで。