キーフレーム移動コンポーネント

コンポーネントは、ゲームをビルドするためにデータとロジックを使用する基本構成要素です。 キーフレーム移動コンポーネントは、エンティティにアニメーション キーフレームを追加することで、指定されたパラメータの範囲内でエンティティがレベルをスムーズに移動できるようにする手段です。 

UEFN では、TeleportTo()、MoveTo() などの関数を使用して Verse コードでオブジェクトを移動し、ワールド内の位置を変更できます。 ただし、これらの関数の Verse コードはシミュレーションの更新ごとに評価する必要があるため、これらの関数を使用してスムーズで連続的な動きを実現することは困難である可能性があります。 オブジェクトの位置を操作して移動する代わりに、アニメーションを使用することもできます。 keyframed_movement_component は、オブジェクトが設定されたキーフレーム間を移動し、サーバーとクライアント間の遅延を発生させることなく実行されるため、スムーズなアニメーションを提供できます。 一連のレール上をスムーズに移動するトロッコを想像してみましょう。キーフレーム移動コンポーネントは、これを実現するための優れたソリューションです。 

エンティティにコンポーネントを追加するには、「エンティティとコンポーネントを操作する」を参照してください。 このコンポーネントは keyframed_movement_component としてリストされており、この名称はキーフレーム移動コンポーネントの Verse クラスと一致します。 このコンポーネントの Verse API の詳細については、「keyframed_movement_component API リファレンス」モジュールを参照してください。

コード内で KeyframedMovement モジュールを参照すると、選択したエンティティに対して実行できる処理にアクセスできるようになります。 次の例は、@editable と keyframe_movement_delta を使用してエンティティを移動する方法を示しています。 

例

エンティティを一連のキーフレーム間で移動させるには、次の手順を実行します。

1. プロジェクトでエンティティを作成します。 この操作を初めて行う場合は、「エンティティとコンポーネントを操作する」を参照してください。

2. [+ Component (+ コンポーネント)] をクリックして、mesh_component を追加します。 キューブ メッシュを選択します。

3. KeyframedMovement コンポーネントを追加します。

4. もう一度 [+ Component] をクリックし、[New Verse Component (新規 Verse コンポーネント)] を選択します。

5. move_cycle_component という名前を付けて、[Create (作成)] をクリックします。

6. Visual Studio Code で、using { /UnrealEngine.com/Temporary/SceneGraph/KeyframedMovement } を追加して、KeyframedMovement モジュールを指定します。

7. transform が機能するには、using { /Verse.org/SpatialMath } を指定します。

8. move_cycle_component クラスの先頭に、Keyframes という名前の keyframed_movement_delta の editable 配列を追加します。 keyframed_movement_delta の配列をエディタに公開することで、[Details (詳細)] パネルから直接キーフレームを作成し、アニメーションの各キーフレームに対して Transform、Duration、および Easing を設定できます。

# A Verse-authored component that can be added to entities
move_cycle_component<public> := class<final_super>(component):


    @editable
    var Keyframes:[]keyframed_movement_delta = array{}

Verse コードをビルドすると、エディタの move_cycle_component の下に [Keyframes (キーフレーム)] が表示されます。 + アイコンをクリックして、2 つの配列要素を追加します。

これで、配列の各要素の Transform、Duration、Easing を変更できるようになりました。 各配列要素は 1 キーフレームに相当します。 

最初の要素で、[Transform (トランスフォーム)] を展開し、[Forward (前方)] を 500 に設定します。 2 番目の要素で、[Left (左)] を -500 に設定します。 両方の要素について、[Duration (期間)] を 2.0 (秒) に設定し、[Easing (イージング)] を cubic_bezier_easing_function に設定します。

最初のキーフレームがワールド内のメッシュの位置を基準としているように、設定する各新しいキーフレームの値は前のキーフレームを基準としていることに注意してください。 

セッションを保存して起動すると、設定したキーフレーム間でキューブが移動しているのを確認できます。

Verse でキーフレームを作成する

Verse コードを使用してキーフレームを作成することもできます。 

1. keyframed_movement_component を取得します。

2. keyframed_movement_delta 関数を呼び出して、Transform、Duration および Easing を指定して、最初のキーフレーム Key0 を作成します。 2 番目のキーフレーム Key1 でもこのプロセスを繰り返します。

3. アニメーションを設定します。 ここで再生モードを決定することもできます。 この例では、アニメーションは pingpong になります。

4. アニメーションを再生します。 正しい構文については、以下のコードを参照してください。

  # Runs when the component should start simulating in a running game.
    # Can be suspended throughout the lifetime of the component. Suspensions
    # will be automatically canceled when the component is disposed of or the game ends.
    OnSimulate<override>()<suspends>:void =
        # TODO: Place simple suspends logic to run for this component here
        Print("OnSimulate")


        if:
            KFM:keyframed_movement_component = Entity.GetComponent[keyframed_movement_component]

完全なコード

以下は、このコード サンプルのコピー＆ペースト可能な完全なバージョンです。

using { /Verse.org }
using { /Verse.org/Native }
using { /Verse.org/Simulation }
using { /Verse.org/SpatialMath }
using { /UnrealEngine.com/Temporary/SceneGraph }
using { /UnrealEngine.com/Temporary/SceneGraph/KeyframedMovement }


# A Verse-authored component that can be added to entities
move_cycle_component<public> := class<final_super>(component):