6
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【非プログラマ対象】UnityでLive2Dの売り子アプリを、コードを触らずに作りたいひとを鍛え直してコードを触らせる Cubism SDK 入門 その3

Last updated at Posted at 2019-12-10

##はじめに
コードからメカニムの状態遷移を制御する初歩的な内容です。

前回
その1
その2

コードでAnimator Controllerの変数を操作する

スクリプトの用意

SDK チュートリアル 「当たり判定の設定」 にあるCubismHitTest.csを参考に改造してみました。
(クラス名は筆者が適当に付けたものです)
初心者向けに、これでもか! というほどコメントを盛り込んでいます。

CubismHitAreaDitector.cs
using UnityEngine;
using Live2D.Cubism.Framework.Raycasting;

public class CubismHitAreaDitector : MonoBehaviour
{
    // アニメーターをコンポーネントを入れておく為の器
    Animator anim;
    // 同様にキュビズムレイキャスター型を入れておく為の器
    CubismRaycaster raycaster;

    // 起動時に1回だけ呼ばれる
    private void Start()
    {
        // 自分にアタッチされているAnimatorコンポーネントを取得、
        // 以後「anim.」で色々呼べる
        anim = GetComponent<Animator>();
        // 自分にアタッチされている CubismRaycaster コンポーネントを取得  ,
        // 以後「raycaster.」で色々呼べる
        raycaster = GetComponent<CubismRaycaster>();
    }

    // 秒間60回くらいぐるぐる回ってUpdate()内に書かれた処理が実行される
    private void Update()
    {
        // もし、左クリック(0ボタン)を押し下げた瞬間じゃなかったら(「!」は否定)
        if (!Input.GetMouseButtonDown(0))
        {
            // Update(){  }から抜けて早々にお帰り頂く(↓以下の処理は実行されない)
            return;
        }

        // -----クリックした瞬間なら以下の処理を実行-------
        
        // クリックした箇所のアートメッシュを最大4つまで取得して覚えておける器を用意
        var results = new CubismRaycastHit[4];
        // マウス座標に向かってメインカメラから出るレーザー光線にする
        var ray = Camera.main.ScreenPointToRay(Input.mousePosition);
        // レーザーを飛ばしてヒット数と結果を取得
        var hitCount = raycaster.Raycast(ray, results);

        // ヒットしたアートメッシュの数だけfor文を回してIDをチェック
        for (var i = 0; i < hitCount; i++)
        {  
            // i番目の検出結果のアートメッシュ名を取得
            var hitID = results[i].Drawable.name;
            Debug.Log("クリックしたアートメッシュIDは" + hitID + "です。");
            if (hitID == "HitAreaHead")
            {
                // アニメーターの指定トリガー型変数をONにする
                anim.SetTrigger("HeadTouch");
            }
            if (hitID == "HitAreaBust")
            {
                anim.SetTrigger("BustTouch");
            }
        }// forの閉じ括弧
    }// Update()の閉じ括弧
}// classの閉じ括弧
 // 初心者は閉じ括弧の数を間違えやすいので、対応する括弧を常に意識すること! 同じ階層の括弧は縦に揃える

まずはこの
CubismHitAreaDitector
というクラス名をコピーしてください。

image.png

Scriptsフォルダ内で右クリック→Create→C# Scriptを選択し、
image.png
貼り付けます
image.png
Enterで確定したら
image.png
ダブルクリックするか右クリックからOpenで開きます。
正しくインストールされていれば、VisualStudioが立ち上がる筈です。

↑先程のCubismHitAreaDitector.csの中身を全部コピーして貼り付けてください。

※余談 注意!!

「全部コピーして貼ってね!」っと言うと、
極稀に作ったときに元から書いてある初期コード↓
image.png
を残したまま追加で貼り付けをされる方がいらっしゃいます。
元からあるコードは全部消して貼り付けてください。
※「class CubismHitAreaDitector」という記述が同一プロジェクト内で2箇所あると、クラスの二重定義でエラーになってしまいます。

また、Visual Studio上で保存するのを忘れないようにしてください(「*」マークは未保存)。
コメント 2020-06-09 123525.png
C# のスクリプトは保存しないとUnity側には反映されないので注意しましょう。

コンポーネントを追加する(1月10日追記)

hiyoriちゃんのオブジェクトのルート(1番の親オブジェクト)に今作ったCubismHitAreaDitectorコンポーネントを追加します。

InspectorのAdd Componentボタンを押して追加しましょう。
(↓の方にあるgifアニメ参照)

他に必要なコンポーネントを追加する

公式参考資料

SDK チュートリアル 当たり判定の設定 を参考にしています。

Cubism Raycaster

hiyoriちゃんのオブジェクトのルート(1番の親オブジェクト)にコンポーネントを追加します。
Raycaster.gif
hiyoriのオブジェクトを選択し、InspectorのAdd Componentボタンを押して、
**「Cubism Raycaster」**を追加します。
※よく似た名前の「Cubism Raycastable」と間違えないでください。

Cubism Raycastable

ヒットを検出したい当たり判定用のアートメッシュのオブジェクトを選択し、
Add Componentで**「Cubism Raycastable」**を追加します。
「レイキャスト可能なもの」という意味です。
Raycastable.gif

複数当たり判定がある場合は、shiftやCtrlで複数選択して、まとめてAdd Component可能です。

実行

実行すると、頭をタッチしたときに当たり判定用のアートメッシュを検出、
Trigger型変数をオンにして、頭タッチのステートに遷移する筈です。
HeadTouchByCode.gif
※Trigger型変数は一瞬でオフになるため、エディタ上ではオンになっている瞬間が視えないですが、他の型の変数だと変化がわかります。

余談 他の変数の操作例


anim.SetInteger("Hp", 4);  // 整数
anim.SetFloat("Speed", 10.0f);  // 小数
anim.SetBool("IsJumping", true);  // 真偽

###応用
これまでの話を理解できていれば、胸タッチも追加できる筈です。
(hiyori_m09の怒っているモーションにしてみました)
image.png

改造してみましょう。

次回

頭をグリグリ動かしたり、パラメータを直接いじる予定…

更新履歴

2020年01月10日 CubismHitAreaDitectorをAddComponentする記述が抜けていたのを追記
2019年12月10日 取り敢えず投稿

6
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?