🔰DOPath - パスを使った曲線アニメーション

👉曲線アニメーションを作る

DOPathまたはDOLocalPathを使うとパスを使ってカーブするトゥイーンを作ることができます。

transform.DOLocalPath(
    new[]
    {
        new Vector3(4f, -1.2f, 0f),
        new Vector3(10f, 0f, 0f),
        new Vector3(5, 1.5f, 0),
    },
    3f, PathType.CatmullRom);

👉DOPathの文法

※DOPath、DOLocalPath共に引数の内容は同じです。

移動する座標配列にトゥイーン開始座標は不要です。

👉閉じたパス指定

transform.DOLocalPath(
    new[]
    {
        new Vector3(4f, -1.2f, 0f),
        new Vector3(10f, 0f, 0f),
        new Vector3(5, 1.5f, 0),
    },
    3f, PathType.CatmullRom)
    // SetOptionsで閉じたパスを指定
    .SetOptions(true);

SetOptions(true）を指定することで閉じたパスのトゥイーンを作成できます。閉じたパスにすることで、トゥイーンを開始した座標に戻ることができます。

👉パスの確認方法

Gizmosでパスの軌跡を描画できます。

ゲームビュー

シーンビュー

ソースコードでGizmosのカラー設定

Gizmosの線の色はDOPath / DOLocalPathの
引数のgizmoColorにColorを設定してください。

transform.DOLocalPath(
    new[]
    {
        new Vector3(4f, -1.2f, 0f),
        new Vector3(10f, 0f, 0f),
        new Vector3(5, 1.5f, 0),
    },
    3f, PathType.CatmullRom, 
    // 赤色を設定
    gizmoColor:Color.red)
    .SetOptions(true);

👆サンプルではColor.redを指定して赤色を描画しています。

👉PathTypeとPatyModeで制御する

DOPath / DOLocalPathにはPathTypeとPathModeという設定があります。曲線の作り方とトゥイーンする対象の向きを指定するパラメーターです。

PathType

PathTypeは曲線の種類を選びます。

PathMode

PathModeはDOPath / DOLocalPathと同時に使える DOLookAtの挙動を設定します。

PathType、PathModeともに重要な設定項目なのですが、、、😰正直、僕にとっては分かりづらいパラメーターでした。

Chapter 26📕DOPathの種類とモードの完全理解に詳しくまとめてみましたので、興味ある方は確認してみてください。

次のチャプターではコルーチンやTaskと連携したDOTweenの使用方法を学びます。