Unityで基本変形(移動・回転・スケール)のアニメーションを作成する その５（アニメーションを一度だけ再生する）

本日は Unity の技術調査枠です。
基本変形(移動・回転・スケール)のアニメーションを作成する方法についてまとめます。
前回記事の続きになります。
bluebirdofoz.hatenablog.com
今回はアニメーションを繰り返さず一度だけ再生する設定についてです。

アニメーションを繰り返さず一度だけ再生する

前回作成したアニメーションコントローラの設定だと、アニメーションが繰り返され、オブジェクトが上昇し続けます。

今回はアニメーションを繰り返さず、一度だけ再生するように設定してみます。
これには２つの方法があります。

まず１つ目はアニメーションファイルの[Loop Time]を無効化する方法です。
anim ファイルを選択し、Inspector ビューから[Loop Time]のチェックを外します。

これでアニメーションは一度しか再生されなくなりました。
Unity の[再生]ボタンで動作を確認すると、アニメーションが一度だけで止まるようになっています。

次にもう１つの方法です。
効果を確認できるよう anim ファイルの[Loop Time]のチェックを戻しておきます。

２つ目はアニメーションの状態を再生次第、すぐに初期状態に戻してしまう方法です。
アニメーションコントローラを選択し、[Animator]画面を開きます。
[CubeAnimation]を 右クリック -> Make Transition で[EntryState]へ線を引きます。

前回作成した遷移とは逆方向の遷移が設定されました。
ここでトリガーの設定は行わず、[List is Empty]のままにしておきます。
これにより、[CubeAnimation]への遷移後、即座に状態が[EntryState]に戻るようになります。

これでアニメーションが一度された後は[EntryState]に戻っているため、繰り返しアニメーションが再生されなくなります。。
Unity の[再生]ボタンで動作を確認すると、同様にアニメーションが一度だけで止まるようになっています。

２つの方法は同じ動きですが、それぞれアニメーション実行後の状態が異なることになります。
必要に応じて使い分けましょう。

アニメーションの繋がり

因みに２つ目の初期状態に戻す方法をそのまま利用すると、上昇アニメーションの最後が少しカクつく印象を受けると思います。
これはアニメーションの繋がりの設定がデフォルトだと、以下のように一部重なった状態になっているためです。

上昇アニメーションの最後の部分が[EntryState]の[None]アニメーションの影響を受けているようです。

以下の通り、アニメーションが重ならないよう変更します。
1.[Exit Time]（遷移先アニメーションの実行開始タイミング）を[1]に設定する。
2.[Transition Duration]（重なりの秒数）を[0]に設定する。

これで再生を行うと、上昇アニメーションが綺麗に再生されます。

Unityで基本変形(移動・回転・スケール)のアニメーションを作成する その４（アニメーションを任意のタイミングで実行する）

本日は Unity の技術調査枠です。
基本変形(移動・回転・スケール)のアニメーションを作成する方法についてまとめます。
前回記事の続きになります。
bluebirdofoz.hatenablog.com
今回はアニメーションを任意のタイミングで実行する方法についてです。

アニメーション任意のタイミングで実行する

指定のタイミングでアニメーションを実行するにはアニメーションコントローラで State を定義する必要があります。
前回記事で作成したアニメーションコントローラを編集するため、controller ファイルを選択して[Animator]画面を開きます。

前回開設した通り、自動作成されたアニメーションコントローラにはアニメーションへの自動遷移が既に設定されています。
アニメーションを任意のタイミングで実行するため、以下の通りコントローラを修正します。
1.最初はアニメーション無しの状態に遷移する
2.トリガーに応じてアニメーションの状態に遷移する

まず、最初に遷移するアニメーション無しの状態を作成します。
作成済みのアニメーション状態を 右クリック -> Delete で削除します。

状態が何もないところで 右クリック -> Create State -> Empty で新しい状態を作成します。

State が作成出来たら分かりやすい名前に変更します。今回は[EntryState]としました。
Motion は[None]のままにしておきます。

同じ手順でもう一つ State を作成します。
こちらは任意のタイミングで実行したいアニメーションを設定します。
先ほど削除した[CubeAnimation]と同じように設定しました。

次にアニメーションを実行するトリガーを作成します。
[Animator]画面の[Parameters]タブを開きます。[＋]ボタンから[Trigger]を選択し、追加します。

作成されたトリガーの名称を設定します。
ここで指定した名称はコード上で利用するため、綴り誤りなどがないよう気を付けます。
今回は[AnimTrigger]としました。

State 間を結ぶ遷移を作成します。
[EntryState]上で右クリックして[Make Transition]を選択します。
遷移を示す線が表示されるので[CubeAnimation]と接続します。

作成したトランザクションの線を選択し、遷移のトリガーを設定します。
[＋]ボタンをクリックし、先ほど作成した[AnimTrigger]を設定します。

これでアニメーションコントローラの修正は完了しました。
次に任意のタイミングでトリガーをキックするスクリプトを Create -> C# Script で作成します。

以下のようなキーボードの[Z]キーでトリガーを実行するコードを作成しました。
・TriggerKick.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

// スクリプトを追加するオブジェクトに必要なコンポーネントの列記
[RequireComponent(typeof(Animator))] 
public class TriggerKick : MonoBehaviour {
    /// <summary>
    /// Animatorコンポーネント
    /// </summary>
    private Animator animator;

    /// <summary>
    /// 起動時の初期化
    /// </summary>
    void Start () {
        // Animatorコンポーネントの取得
        animator = GetComponent<Animator>();
    }

    /// <summary>
    /// 定期実行
    /// </summary>
    void Update()
    {
        // Zキー押下で実行する
        if (Input.GetKey(KeyCode.Z))
        {
            // トリガーを実行する
            animator.SetTrigger("AnimTrigger");
        }
    }
}

スクリプトをアニメーションコントローラが設定された Animator コンポーネントを持つオブジェクトに設定します。

以上で設定は完了です。
Unity の[再生]ボタンをクリックし、動作確認を行ってください。
キーボードの[Z]キーを押下したタイミングでアニメーションが開始するようになります。

コントローラの状態は Animator コンポーネントを設定したオブジェクトごとに保持されます。
前回同じコントローラを流用した別オブジェクトはスクリプトを設定していないため、静止したままです。

クリップスタジオで輝度反転を行う

本日は CLIPSTUDIO の調査枠です。
CLIPSTUDIOでクリップスタジオで輝度反転を行う方法をまとめます。
前回記事の応用です。
bluebirdofoz.hatenablog.com

CLIPSTUDIOには「階調の反転」機能がありますが、輝度の反転機能がありません。
以下の手順を行うことで、輝度のみの変換が行えます。

輝度反転を行うレイヤーに対して階調反転を行います。
変換を行いたいレイヤーを選択した状態でメニューから 編集 -> 色調補正 -> 階調の反転 を選択します。

すると輝度が変換されますが、階調の反転では同時に色相も反転しています。
色相を元に戻すため、メニューから 編集 -> 色調補正 -> 色相・彩度・明度 を選択します。

[色相]の値を[180]に設定して色相を反転します。[OK]ボタンをクリックして反映します。

これで輝度のみを反転した画像ができました。

HoloLens では黒色が透過色となるため、この輝度反転や前回の輝度が低い箇所の透過処理は覚えておくと役立つことが多いです。
試しに透過処理を行った星空を HoloLens で投影してみました。

キャプチャだと画像が荒いため、壁のシミみたいになっていますが、実際に装着していると奥行を感じられて良い感じです。

クリップスタジオの「輝度を透明度に変換」で輝度が低い部分を透明化する

本日は CLIPSTUDIO の調査枠です。
CLIPSTUDIOの「輝度を透明度に変換」で輝度が低い部分を透明化する方法を調べます。

CLIPSTUDIOには「輝度を透明度に変換」機能があります。
これを使うと、輝度が高い部分（例えば白色の部分）をその高さに応じて透明化することができます。

使い方は変換を行いたいレイヤーを選択した状態でメニューから 編集 -> 輝度を透明度に変換 を選択します。

すると以下のように輝度が高い部分が透明化され、下位レイヤ―の色が見えるようになります。

今回はこの機能を応用して輝度が低い部分（例えば黒色の部分）を透明化します。
方法としては「階調の反転」機能で一度輝度を反転させ、「輝度を透明度に変換」機能を利用します。

透明化を行うレイヤーに対して階調反転を行います。
レイヤーを選択した状態でメニューから 編集 -> 色調補正 -> 階調の反転 を選択します。

階調が反転されたら、レイヤーに対して「輝度を透明度に変換」機能を利用します。
レイヤーを選択した状態でメニューから 編集 -> 輝度を透明度に変換 を選択します。

輝度の透明化が行われたら、次は再び「階調の反転」機能を利用します。
レイヤーを選択した状態でメニューから 編集 -> 色調補正 -> 階調の反転 を選択します。

これで元画像の輝度が低い部分が透明化された画像が作成できました。

背景レイヤを消して PNG など透明度が保存できるファイル形式で画像を保存します。

公式チュートリアル「MR and Azure 304」の記事をまとめる

本日はまとめ枠です。
公式チュートリアル「MR and Azure 304」を実施した記事についてまとめておきます。

Chapter 1

bluebirdofoz.hatenablog.com

Chapter 2

bluebirdofoz.hatenablog.com

Chapter 3 ～ 5

bluebirdofoz.hatenablog.com

Chapter 6

bluebirdofoz.hatenablog.com

Chapter 7

bluebirdofoz.hatenablog.com

Chapter 8 ～ 10

bluebirdofoz.hatenablog.com

公式チュートリアル「MR and Azure 304 8～10章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 304: Face recognition」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 8 ～ Chapter 10(最終章)」です。

Chapter 8：Building the solution

アプリケーションのテストを行うには、HoloLensにロードする必要があります。
ビルド作業を行う前に、次のことを確認してください。
・第3章で説明したすべての設定が正しく設定されています。
・FaceAnalysis スクリプトは、メインカメラオブジェクトに添付されています。

・認証キーと人物グループIDの両方がFaceAnalysisスクリプト内で設定されています。

Unityセクションで必要なものは全て完成したので、ビルドを行います。
1-2.メニューから File -> Build Settings を選択します。

3-5.「Unity C# Projects」をチェックし、「Build」を実行します。

6-7.Unityのビルドが完了すると、File Explorer が開きます。
ビルドフォルダを開き、新しいプロジェクトソリューションを開きます。

Chapter 9：Deploying your application

アプリケーションを HoloLens に展開します。
1-3.ビルドで出力された sln ファイルを開きます。
構成を「Release」「x86」「リモートコンピュータ(HoloLensのIPアドレス)」に変更します。

4-6.メニューから デバッグ -> デバッグなしで実行 でアプリを HoloLens にインストールして実行します。

Chapter 10：Using the application

1.HoloLensを着けてアプリを起動します。
2.アプリを起動した状態で Face API で登録した人物を見てください。このとき、以下に注意してください。
・対象の人の顔が遠過ぎず、はっきりと見える。
・周りの照明が暗すぎない。
3.タップジェスチャーを行い、人物の画像をキャプチャします。
4.アプリケーションが解析要求を送信するので、応答を受け取るのを待ちます。
5.その人物が正常に認識された場合、その人物の名前がUIテキストとして表示されます。

※ PCディスプレイに映画のシーンを表示して実施してみました。[John]と表示されます。

6.数秒ごとにタップジェスチャを使用してキャプチャプロセスを繰り返すことができます。

※ 別のシーンで実施すると[Hans]を識別しました。これで誰が悪者が一目瞭然です。

以上で HOLOGRAMS 304 は終了です。

公式チュートリアル「MR and Azure 304 7章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 304: Face recognition」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 7」です。

Chapter 7：Create the ImageCapture class

ImageCaptureクラスの目的はキャプチャする画像を分析し、その中の顔を識別して既知の人物かどうかを判断することです。
Azure顔認識サービスと通信するために必要なメソッドを利用します。
既知の人物が見つかった場合、このクラスはその名前をシーン内のUIテキストとして表示します。

1.Script フォルダを開きます。
2.フォルダ内で右クリックして、Creapte -> C# Script を選択します。
Script の名称は ImageCapture に設定します。

3.新しいスクリプトをダブルクリックしてVisual Studioで開きます。
4.以下の通り、スクリプトを編集します。
・ImageCapture.cs

using System;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.Experimental.XR;
using UnityEngine.UI;
using UnityEngine.XR;
using UnityEngine.XR.WSA.Input;

public class Gaze : MonoBehaviour
{
    internal GameObject gazedObject;
    public float gazeMaxDistance = 300;

    void Update()
    {
        // Uses a raycast from the Main Camera to determine which object is gazed upon.
        // メインカメラからのレイキャストを使用して、どのオブジェクトが注視されているかを判断します。
        Vector3 fwd = gameObject.transform.TransformDirection(Vector3.forward);
        Ray ray = new Ray(Camera.main.transform.position, fwd);
        RaycastHit hit;
        Debug.DrawRay(Camera.main.transform.position, fwd);

        if (Physics.Raycast(ray, out hit, gazeMaxDistance) && hit.collider != null)
        {
            if (gazedObject == null)
            {
                gazedObject = hit.transform.gameObject;

                // Set the gazedTarget in the Behaviours class
                // Behaviorsクラスでの注視ターゲットを設定します
                Behaviours.instance.gazedTarget = gazedObject;
            }
        }
        else
        {
            ResetGaze();
        }
    }

    // Turn the gaze off, reset the gazeObject in the Behaviours class.
    // 注視をオフにし、Behaviorsクラスの注視オブジェクトをリセットします。
    public void ResetGaze()
    {
        if (gazedObject != null)
        {
            Behaviours.instance.gazedTarget = null;
            gazedObject = null;
        }
    }
}

5.Visual Studio で変更を保存して Unity に戻ります。

Chapter 7 はここまでです。
次回は Chapter 8 ～ 10 を実施します。