2. アニメーションを使用してエンティティを移動する

移動プラットフォームは、ほとんどのプラットフォーム ゲームに共通し、プレイヤーは、ゴールに到達するためターゲット間を正確にジャンプすることが求められます。

UEFN では、小道具を動かす方法がいくつかあります。 TeleportTo[] や MoveTo() などの関数を使用して、トランスフォームを直接変更することや、小道具移動装置などの別の仕掛けを使用して小道具をプリセット パス上で動かすことができます。 ただし、アニメーションの形で別の便利なオプションもあります。

アニメーションには、小道具のトランスフォームを動かすことに関していくつかのメリットがあります。 アニメーションによる移動は通常、MoveTo() や TeleportTo() によるオブジェクトの移動よりも滑らかです。それは、ゲーム ティックごとに関数を呼び出すことによるネットワーク レイテンシーを回避できるためです。

また、アニメーションでは、プレイヤーや他のオブジェクトとのコリジョンがより一貫したものになり、小道具移動装置の仕掛けを使用する場合と比べて、オブジェクトがどこでどのように動くかをより細かく制御できます。 アニメーションを、ループして再生したり、ピンポン モードで順方向と逆方向に再生したりすることができます。

また、アニメーションでは補間タイプを選択することもできます。 補間タイプによって、アニメーションのイージングのタイプや、アニメーションが追従するアニメーション カーブが決まります。 たとえば、線形補間タイプでは、アニメーションが一定の速度で再生されますが、イーズイン タイプでは、低速で始まり、終点に近づくにつれて加速します。

使用するアニメーションに適切な補間タイプを選択することで、小道具がさまざまなポイントで、減速するか、加速するか、線形に動くかを指定できます。 この動作を実装するコンポーネントをレベルのエンティティに適用することで、プレイヤーが移動するための移動プラットフォームを作成できます。

まず、移動するプラットフォームがどのような動作を実行できるかを考えてみましょう。 特定の開始位置からアニメーションを開始し、複数のポイントに移動します。 移動の終了時には、開始位置に戻るか、その場に留まる必要があります。

特定の期間でこれらの移動を行い、移動の各ポイントで適切に回転およびスケールできるようにする必要があります。 これらの動作を実現するにはそれぞれ特定のコードが必要ですが、シンプルなクラスから始めて構築していくことで、さまざまなアイデアに素早く取り組むことができます。 アニメーションベースの移動コンポーネントを作成するには、次の手順に従います。

1. 「animate_to_targets_component」という Verse コンポーネントを新規作成し、Visual Studio Code で開きます。 独自の Verse コンポーネントを作成する方法の詳細については、「独自の Verse コンポーネントを作成する」を参照してください。 /Verse.org/SpatialMath、/Verse.org/SceneGraph/KeyframedMovement、および /UnrealEngine.com/Temporary/SpatialMath モジュールの文を使用して追加します。 これらの関数は後で必要になります

   Verse

   using { /Verse.org }
   using { /Verse.org/Native }
   using { /Verse.org/SceneGraph }
   using { /Verse.org/Simulation }
   using { /Verse.org/SpatialMath }
   using { /Verse.org/SceneGraph/KeyframedMovement }
   using { /UnrealEngine.com/Temporary/SpatialMath }
   
   # Place this component to an entity to move between preset targets.
   animate_to_targets_component<public> := class<final_super>(component):

   Copy full snippet(10 lines long)

2. このチュートリアルのこのセクションで使用したツールチップを以下に示します。 これらを animate_to_targets_component クラス定義の上にコピーして貼り付けることができます。

   Verse

   # Editor Tool Tips
   DefaultSpeedTip<localizes><public>:message = "Default speed simulation entity moves during any segment that does not specify a speed."
   SpeedTip<localizes><public>:message = "Speed simulation entity moves during this segment."
   AnimationDurationTip<localizes><public>:message = "The duration of the animation segment in seconds."
   EasingFunctionTip<localizes><public>:message = "Movement cubic-bezier easing function during this segment."
   DefaultEasingFunctionTip<localizes><public>:message = "Default movement cubic-bezier easing function during any segment that does not specify an easing function."
   PlaybackModeTip<localizes><public>:message = "Animation playback mode\n\tOneshot: Animation plays once.\n\tPingPong: Animation plays in order and reverse order repeating.\n\tLoop: Animation repeats in a loop. Tip: To construct an animation in a closed loop, make the last segment starting position the same as the first segment starting position."
   TargetsTip<localizes><public>:message = "Entities that are targets for the parent entity."
   RandomizeTargetsTip<localizes><public>:message = "Randomize the order of the segments.\n\tNever: Always use the order specified.\n\tOnBegin: Only randomize the order on begin simulation.\n\tEveryIteration: Randomize the order of the segments every loop iteration."
   PauseTip<localizes><public>:message = "Duration simulation entity pauses at the beginning of this segment."
   
   Expand code Copy full snippet(16 lines long)

3. 以下のフィールドを animate_to_targets_component のクラス定義に追加します。

   • InitialPauseSeconds という名前の、編集可能な float 型変数。 これは、エンティティがアニメーションを開始するまでの時間です。 エンティティがアニメーションを開始する前に 10 秒間待機するように、これを 10.0 に設定します。

   Verse

   # Amount of time to pause before the animation starts.
   @editable_number(float):
       ToolTip := SpeedTip
       MinValue := option{0.0}
   var InitialPauseSeconds<public>:float = 10.0

   Copy full snippet(5 lines long)

   • 編集可能な keyframed_movement_playback_mode (名称 AnimationPlaybackMode) です。 これはエンティティのアニメーションのアニメーション モードです。 これを loop_keyframed_movement_playback_mode に設定します。 つまり、デフォルトでは、アニメーションが完了すると、エンティティはループし、最初からアニメーションを再開します。

   Verse

   # The playback mode used by this animation.
   @editable:
       ToolTip := PlaybackModeTip
   var PlaybackMode<public>:keyframed_movement_playback_mode = loop_keyframed_movement_playback_mode{}

   Copy full snippet(4 lines long)

4. コードを保存してコンパイルします。

アニメーションをセグメントに分割する

コードでアニメーションを作成するには、キーフレームを使用します。 アニメーションは 1 つまたは複数のキーフレームから作成され、各キーフレームでは、アニメーションの特定のポイントでのオブジェクトの値が指定されます。 キーフレームを使用してアニメーションを作成することで、小道具を移動、回転、またはスケールするポイントを複数指定できます。

keyframed_movement_component はそのキーフレーム タイプとして keyframed_movement_delta を使用します。 この移動デルタには次の 3 種類の値があります。

• Transform：前のキーフレームを基準としたトランスフォームの変化を指定します。

• Duration：キーフレームの所要時間 (秒) です。

• Easing：このキーフレームを再生する際に使用するイージング関数。

keyframed_movement_component はキーフレームの配列を受け取り、それらを再生するため、再生するアニメーションごとにすべてのキーフレームを一度に指定する必要があります。 次の 2 種類の方法があります。

1. コード内で複数のキーフレームの配列を作成し、それをキーフレーム移動コンポーネントに渡して単一のアニメーションを再生します。

2. 単一のキーフレームを含む複数の配列を作成し、それらを個別にキーフレーム移動コンポーネントに渡すことで、複数のアニメーションを連続して再生します。

どちらの方法にもトレードオフがあります。 単一のキーフレームの配列では、キーフレーム間の演算を簡単に実行できますが、処理するコードが多く必要になります。 すべてのキーフレームを一度に構築すると管理は容易になりますが、アニメーションの再生中に操作を実行するのは難しくなります。 「小道具の動きをアニメートする」チュートリアルとこのチュートリアルの両方で、1 番目のアプローチについて説明していますが、2 番目のアプローチの実装も用意されています。

コードで個々のキーフレームを作成するには、segment クラスを定義します。 各セグメントは、エディタから作成できる keyframed_movement_component によって使用されるキーフレームを表します。 また、各キーフレーム間の待機時間など、追加のデータを含めることもできます。 以下の手順に従って、セグメント クラスを作成します。

1. segment という新クラスを、使用する「animate_to_targets_component.verse」ファイルに追加します。 <concrete> 指定子を追加して、このクラスを @editable 値として使用できるようにします。

   Verse

   # Defines a segment of animation, which includes a starting position, animation speed and duration, and easing function.
   # Each segment acts as a single animation, and multiple segments make up an animation sequence.
   segment<public> := class<concrete>:

   Copy full snippet(3 lines long)

2. セグメント クラス定義に次のフィールドを追加します。

   • 編集可能な entity オプション (名称 SegmentStartPosition)。 このエンティティは、エンティティがアニメートを開始するワールド位置の参照として機能します。

   Verse

   # An entity that represents the starting position of this entity during the animation segement.
   @editable:
       ToolTip := SourceTip
   SegmentStartPosition:?entity = false

   Copy full snippet(4 lines long)

   • 編集可能な float (名称 AnimationDuration)。 このアニメーション セグメントの再生にかかる時間の長さです。 これを「2.0」に設定すると、各アニメーション セグメントの再生に 2 秒かかります。  

   Verse

   # The duration of the animation segment.
   @editable:
       ToolTip := AnimationDurationTip
   AnimationDuration:float = 2.0

   Copy full snippet(4 lines long)

   • 編集可能なイージング関数のオプション (名称 EasingFunction)。 これは、アニメーションのこのセグメント中に使用されるイージング関数です。  

   Verse

   # The easing function to use during this segment of animation.
   @editable:
       ToolTip := EasingFunctionTip
   EasingFunction:?easing_function = false

   Copy full snippet(4 lines long)

   各イージング関数は 3 次ベジェ曲線で定義されます。この曲線は、アニメーションで使用するイージング関数の種類を表す 4 つの数値で構成されます。 たとえば、イーズイン カーブのパラメータでは、開始時にアニメーションを低速にし、その後に加速できます。

   線形カーブのパラメータでは、アニメーション再生を一定速度にできます。 これらの値を定義して独自のカスタム アニメーション カーブを作成できますが、この例では KeyframedMovement モジュールで定義されている値を使用するため、独自に定義する必要はありません。

   • 編集可能な float オプション (名称 PauseSeconds)。 このアニメーション セグメントを開始する前に一時停止する時間 (秒) です。 これは、エンティティがそのパスに沿った各ポイントから移動する前に一時停止する時間と考えることができます。  

   Verse

   # The number of seconds to pause before starting this animation segment.
   @editable:
       ToolTip := PauseTip
   PauseSeconds:?float = false

   Copy full snippet(4 lines long)

3. animate_to_targets_component クラス定義に戻り、次のフィールドを追加します。

   • segment の編集可能配列 (名称 Segments)。 これは、エンティティが実行するアニメーション全体を構成するアニメーションの各セグメントを参照します。

   Verse

   # Segments of the keyframed movement animation.
   @editable:
       ToolTip := SegmentsTip
   var Segments<private>:[]segment = array{}

   Copy full snippet(4 lines long)

   • 編集可能なイージング関数 (名称 DefaultEasingFunction)。 アニメーション セグメントでイージング関数が指定されていない場合は、これがデフォルトで使用されます。 これを ease_in_out_cubic_bezier_easing_function に設定します。  

   Verse

   # Movement easing function between two targets
   @editable:
       ToolTip := DefaultEasingFunctionTip
   var DefaultEasingFunction<public>:easing_function = ease_in_out_cubic_bezier_easing_function{}

   Copy full snippet(4 lines long)

4. コードを保存してコンパイルします。 エディタ内では、animate_to_targets_component がアタッチされたエンティティに Segments 配列が表示されます。

コードでキーフレームを作成する

セグメント クラスが完成したら、セグメントが定義するキーフレームを構築します。 キーフレームを個別に作成し、配列に追加して、その配列を keyframed_movement_component に渡します。 これにはいくつかの計算が必要ですが、ここで定義します。

数学演算はさまざまなシナリオで役立つため、そのロジックをユーティリティ ファイルに配置して、Verse のどのコンポーネントからでもアクセスできるようにすると便利です。 エンティティを使用する場合の Verse のベスト プラクティスの詳細については、「独自の Verse コンポーネントを作成する」を参照してください。 以下の手順に従って、ユーティリティ ファイルを作成します。

1. 「animate_to_targets.verse」ファイルに Utilities という名前の新しいモジュールを作成します。 このフォルダには、プロジェクト全体で使用する共通のロジックが格納されます。

   Verse

   # Module containing utility functions.
   Utilities<public> := module:
   

   Copy full snippet(2 lines long)

2. VectorOnes</code> という名前の新しい vector3 型エイリアスを Utilities モジュールに追加します。これは、Left、<code class="inline-code">Up、Forward がすべて 1.0 に設定されている vector3 を作成します。 一部の数学演算が容易になるように後でこのベクターを使用します。その型エイリアスを定義することで、vector3{Left := 1.0, Up := 1.0, Forward := 1.0} を繰り返し記述する必要がなくなります。 /Verse.org/SpatialMathおよび /UnrealEngine.com/Temporary/SpatialMath モジュールの両方をインポートしたため、これが /Verse.org/SpatialMath vector3 であることを指定する必要があります。両方のモジュールにその定義が含まれているためです。

   Verse

   # Utility function for the identity of component-wise vector multiplication.
   VectorOnes<public>()<transacts>:(/Verse.org/SpatialMath:)vector3 = (/Verse.org/SpatialMath:)vector3{Left := 1.0, Up := 1.0, Forward := 1.0}

   Copy full snippet(2 lines long)

3. GetDeltaTransform() という新しい関数を Utilities モジュールに追加します。 この関数は、2 つのトランスフォームの差を計算し、デルタを返します。 この関数に <transacts> モディファイヤを付加して、ロールバックできるようにします。 /Verse.org/SpatialMath を各トランスフォームのモジュールとして指定します。エンティティ トランスフォーム間の差分を計算するためです。

   Verse

   # Get the delta transform between two given transforms.
   GetDeltaTransform<public>(TransformOne:(/Verse.org/SpatialMath:)transform, TransformTwo:(/Verse.org/SpatialMath:)transform)<transacts>:(/Verse.org/SpatialMath:)transform=

   Copy full snippet(2 lines long)

4. GetDeltaTransform, で、新しい /Verse.org/SpatialMath transform を初期化します。 Translation を、各トランスフォームの平行移動の差分に設定します。 回転をMakeComponentWiseDeltaRotation()を呼び出した結果にsetします。 この関数は/UnrealEngine.com/Temporary/SpatialMathディレクトリにあるため、/Verse.org/SpatialMath から変換する必要があります回転を /UnrealEngine.com/Temporary/SpatialMath 回転に変換します。 これを行うには、FromRotation() 関数を使用します。 FromRotation() で変換した後に、各トランスフォームの回転を渡して MakeComponentWiseDeltaRotation() を呼び出します。 次に、この関数呼び出しの結果を再度 FromRotation() を使用して変換し、/Verse.org/SpatialMath に変換し直します。回転させています 最後に、Scale を、最初のスケールで除算した 1 つ目のスケールと 2 つ目のスケールの差分に VectorOnes を加算した結果に設定します。 これにより、アニメート中にエンティティが正しくスケールされます。 完成した GetDeltaTransform() 関数は次のようになります。

   Verse

   # Get the delta transform between two given transforms.
   GetDeltaTransform<public>(TransformOne:(/Verse.org/SpatialMath:)transform, TransformTwo:(/Verse.org/SpatialMath:)transform)<transacts>:(/Verse.org/SpatialMath:)transform=
       (/Verse.org/SpatialMath:)transform:
           Translation := TransformTwo.Translation - TransformOne.Translation
           Rotation := FromRotation(MakeComponentWiseDeltaRotation(
               FromRotation(TransformTwo.Rotation), 
               FromRotation(TransformOne.Rotation)))
           Scale := VectorOnes() + ((TransformTwo.Scale - TransformOne.Scale) / TransformOne.Scale)

   Copy full snippet(8 lines long)

5. 最後に、TryGetvalueOrDefault() という名前の関数を Utilities モジュールに追加し、<transacts> モディファイアを追加します。 この関数は、ある型の option 値および同じ型のデフォルト値を受け取り、そのデフォルト値か、存在する場合は Value 内のアイテムを返します。 これは、クラス内の値が実際に初期化されているかどうかを確認したい場合に便利です。また、初期化されていない場合は、必ず何らかの値を返すことを保証します。 TryGetValueOrDefault() 内で、Value に値が含まれるかどうかをチェックして、値を返します。 存在しない場合、Default を返します。 完成した Utilities モジュールと TryGetValurOrDefault() 関数は次のようになります。

   Verse

   # Module containing utility functions.
   Utilities<public> := module:
       
       
       # Utility function for the identity of component-wise vector multiplication.
       VectorOnes<public>()<transacts>:(/Verse.org/SpatialMath:)vector3 = (/Verse.org/SpatialMath:)vector3{Left := 1.0, Up := 1.0, Forward := 1.0}
       
       
       # Get the delta transform between two given transforms.
       GetDeltaTransform<public>(TransformOne:(/Verse.org/SpatialMath:)transform, TransformTwo:(/Verse.org/SpatialMath:)transform)<transacts>:(/Verse.org/SpatialMath:)transform=
   
   Expand code Copy full snippet(24 lines long)

演算を定義したら、コードからキーフレームをビルドできます。

次の手順に従って、キーフレーム作成関数を作成します。

1. ConstructKeyframe() という新しい関数を animate_to_targets クラス定義に追加します。 この関数は、ソース エンティティ、ターゲット エンティティ、オプションのイージング関数、期間を受け取ります。 keyframed_movements_delta の配列も返します。

   Verse

   # Construct a single keyframe that animates between the Source and Destination entity using the given easing function over a set duration.
   ConstructKeyframe<private>(Source:entity, Destination:entity, Easing:?easing_function, Duration:float)<transacts><decides>:[]keyframed_movement_delta=

   Copy full snippet(2 lines long)

2. まず、ConstructKeyframe() 内で GetGlobalTransform() を呼び出して、変換元エンティティと変換先エンティティの両方のトランスフォームを取得します。

   Verse

   # Construct a single keyframe which animates between the Source and Destination entity using the given easing function over a set duration.
   ConstructKeyframe<private>(Source:entity, Destination:entity, EasingFunction:easing_function, Duration:float)<transacts><decides>:[]keyframed_movement_delta=
       var SourceTransform:(/Verse.org/SpatialMath:)transform = Source.GetGlobalTransform()
       var DestinationTransform:(/Verse.org/SpatialMath:)transform = Destination.GetGlobalTransform()

   Copy full snippet(4 lines long)

3. keyframed_movement_delta の単一メンバーで配列を初期化します。 Transform を、変換元と変換先のトランスフォームを渡して GetDeltaTransform() を呼び出した結果にセットし、期間とイージングを、この関数に渡された値にセットします。 完全な ConstructKeyframe() 関数は次のようになります。

   Verse

   # Construct a single keyframe which animates between the Source and Destination entity using the given easing function over a set duration.
   ConstructKeyframe<private>(Source:entity, Destination:entity, EasingFunction:easing_function, Duration:float)<transacts><decides>:[]keyframed_movement_delta=
       var SourceTransform:(/Verse.org/SpatialMath:)transform = Source.GetGlobalTransform()
       var DestinationTransform:(/Verse.org/SpatialMath:)transform = Destination.GetGlobalTransform()
       array:
           keyframed_movement_delta:
               Transform := Utilities.GetDeltaTransform(SourceTransform, DestinationTransform)
               Duration := Duration
               Easing := EasingFunction

   Copy full snippet(9 lines long)

この関数により個別のキーフレームが作成されますが、完全なアニメーションを作成するには、さらにロジックが必要になります。 

1. ConstructAndPlayAnimations() という新しい関数を animate_to_targets クラス定義に追加します。 この関数はセグメントの配列とアニメーション再生モードを受け取り、それらを使用してフルアニメーションを作成し再生します。 この関数が非同期で実行できるようにするために、この関数に <suspends> モディファイヤを追加します。

   Verse

   # Construct and play an animation from an array of animation segments.
   ConstructAndPlayAnimations<private>(InSegments:[]segment, AnimationPlayback:keyframed_movement_playback_mode)<suspends>:void=

   Copy full snippet(2 lines long)

2. ConstructAndPlayAnimations() で、「ShouldBreakOut」という新しい logic 変数を定義し、それを false に初期化します。 3 つのキーフレーム移動の再生モードがあるため、それぞれを個別に処理する必要があります。 loop 式を使用してアニメーションを継続的に構築し、往復ループ モードを処理しますが、ワンショット モードでは、最初のイテレーションでループから抜け出す必要があります。 アニメーション再生モードがワンショット モードかどうかを確認し、そうであれば ShouldBreakOut を true に設定します。

   Verse

   # Construct and play an animation from an array of animation segments.
   ConstructAndPlayAnimations<private>(InSegments:[]segment, AnimationPlayback:keyframed_movement_playback_mode)<suspends>:void=
           
       var ShouldBreakOut:logic = false
       # If this is a oneshot animation, break out of loop after it plays once.
       if (oneshot := oneshot_keyframed_movement_playback_mode[AnimationPlayback]):
           set ShouldBreakOut = true

   Copy full snippet(7 lines long)

3. 次に、if 式で、変数 KeyframedMovementComponent でエンティティの keyframed_movement_component を取得します。次に、InSegments 配列の最初の要素を取得して、アニメーションの開始トランスフォームを変数 StartingTransform に取得し、そのグローバル トランスフォームを取得します。

   Verse

   # Position this entity in the correct starting position.
   if:
       KeyframedMovementComponent := Entity.GetComponent[keyframed_movement_component]
       StartingTransform :=
           FirstSegment := InSegments[0].SegmentStartPosition?.GetGlobalTransform()

   Copy full snippet(5 lines long)

4. 最後に、エンティティのグローバル トランスフォームを開始トランスフォームに設定して、エンティティを開始位置に配置し、アニメーションを再生する前に InitialPauseSeconds の間スリープします。

   Verse

   # Position this entity in the correct starting position.
   if:
       KeyframedMovementComponent := Entity.GetComponent[keyframed_movement_component]
       StartingTransform :=
       FirstSegment := InSegments[0].SegmentStartPosition?.GetGlobalTransform()
   
   then:
       Entity.SetGlobalTransform(StartingTransform)
       # Sleep for initial pause.
       Sleep(InitialPauseSeconds)

   Copy full snippet(10 lines long)

5. アニメーションの元となるキーフレームの配列を構築します。 まず、Keyframes という名前の、keyframed_movement_delta の新しい変数配列を初期化します。 次に、for 式で InSegments 配列の各セグメントをイテレートし、Index というローカル変数にセグメントとそのインデックスの両方を取得します。

   Verse

   # Build the array of keyframes to play the animation from.
   var Keyframes:[]keyframed_movement_delta = array{}
   for:
       Index -> Segment:InSegments
       SourceEntity := Segment.SegmentStartPosition?
       DestinationEntity := InSegments[Index + 1].SegmentStartPosition?

   Copy full snippet(6 lines long)

6. ここで、Segment.EasingFunction と DefaultEasingFunction を渡して TryGetValueOrDefault() を呼び出すことで、Easing という名前のローカル変数にこのキーフレームに使用されているイージング関数を取得します。 さらに、Segment.AnimationDuration からローカル変数の Duration でアニメーション セグメントの期間を取得します。 すべての値を配置したら、if 式で、それぞれの値を ConstructKeyframe[] に渡してキーフレームを作成し、結果を Keyframes 配列に追加します。 すべてのキーフレームがビルドされたら、SetKeyframes() を呼び出して Keyframes 配列と PlaybackMode を渡してキーフレーム移動コンポーネントにキーフレームの配列を設定します。

   Verse

   # Build the array of keyframes to play the animation from.
   var Keyframes:[]keyframed_movement_delta = array{}
   for:
       Index -> Segment:InSegments
       SourceEntity := Segment.SegmentStartPosition?
       DestinationEntity := InSegments[Index + 1].SegmentStartPosition?
   do:
       Easing := Utilities.TryGetValueOrDefault(Segment.EasingFunction, DefaultEasingFunction)
       Duration := Segment.AnimationDuration
       # Construct each keyframe and add it to the array.
   
   Expand code Copy full snippet(15 lines long)

7. キーフレームの配列を設定したら、再生を開始します。 アニメーションはループで実行する必要がありますが、アニメーション モードがワンショットに設定されている場合、最初のイテレーションの後に停止する必要があります。 また、セグメントにPauseSecondsがある場合、各キーフレームで一時停止を処理する必要があります。 これを処理するには、内部に for 式を含む ループ 式を設定します。 for 式内で、Keyframes 配列内の各キーフレームをイテレートし、さらに変数 KeyframeIndex で各キーフレームのインデックスを取得します。

   Verse

   KeyframedMovementComponent.SetKeyframes(Keyframes, PlaybackMode)
   
   # Loop playing the animation from the keyframed_movement_component, pausing at each
   # keyframe for a specified duration. Will break out of the loop if the animation mode
   # is set to oneshot.
   loop:
       for(KeyframeIndex -> Keyframe:Keyframes):

   Copy full snippet(7 lines long)

8. for 式内で、KeyframeIndex を使って InSegments 配列をインデックス処理することで、このキーフレームに関連付けられたセグメントを取得します。 次に、セグメントにPauseSecondsがある場合は、その期間だけSleep()を呼び出します。 その後、KeyframedMovementComponent.Play() を呼び出し、続いて KeyframeReachedEvent を待機して KeyframedMovementComponent.Pause() を呼び出します。 これにより、各キーフレームでアニメーションを PauseSeconds の時間だけ一時停止した後に、再生して次のキーフレームを待機し、再び一時停止します。 最後に、loop 式の最後で ShouldBreakOut が true であるかどうかをチェックして true であれば、ループを抜けます。

   Verse

   # Loop playing the animation from the keyframed_movement_component, pausing at each
   # keyframe for a specified duration. Will break out of the loop if the animation mode
   # is set to oneshot.
   loop:
       for(KeyframeIndex -> Keyframe:Keyframes):
           if:
               SegmentReached := InSegments[KeyframeIndex]
           then:
               Sleep(SegmentReached.PauseSeconds)
               KeyframedMovementComponent.Play()
   
   Expand code Copy full snippet(14 lines long)

9. 完成した ContstructAndPlayAnimations() 関数は次のようになります。

   Verse

   # Construct and play an animation from an array of animation segments.
   ConstructAndPlayAnimations<private>(InSegments:[]segment, AnimationPlayback:keyframed_movement_playback_mode)<suspends>:void=
           
       var ShouldBreakOut:logic = false
       # If this is a oneshot animation, break out of loop after it plays once.
       if (oneshot := oneshot_keyframed_movement_playback_mode[AnimationPlayback]):
           set ShouldBreakOut = true
       
       
       # Position this entity in the correct starting position.
   
   Expand code Copy full snippet(51 lines long)

次のステップでは、アニメーション エンティティのプレハブを作成し、レベルでインスタンス化します。

次

• 

  3. プレハブを使ってプラットフォーマーを作成する

  Scene Graph と Verse を使用して、独自のプラットフォーマーを作成します。