2. Bewegliche Entitäten mit Animationen

Bewegungsplattformen sind für Jump‘n‘Run-Spiele üblich und fordern den Spieler heraus, präzise Sprünge zwischen den Hindernissen zu machen, um das Ziel zu erreichen.

Es gibt verschiedene Möglichkeiten, wie du Props in UEFN verschieben kannst. Du kannst Funktionen wie TeleportTo[] oder MoveTo() nutzen, um eine Transformation direkt zu verändern, oder ein anderes Gerät wie einen Objektbeweger verwenden, um ein Prop an einen zuvor festgelegten Pfad zu verschieben. Animationen bieten eine weitere nützliche Option.

Animationen haben gegenüber der Bewegung der Transformation eines Props einige Vorteile. Animationen haben normalerweise eine glattere Bewegung als die Bewegung von Objekten mit MoveTo() oder TeleportTo(), da die Netzwerklatenz des Aufrufs dieser Funktionen bei jedem game tick vermieden wird.

Animationen verfügen außerdem über einheitlichere Kollisionen mit Spielern oder anderen Objekten und du hast im Vergleich zur Verwendung eines Prop Mover eine größere Kontrolle darüber, wo und wie sich Objekte bewegen. Du kannst Animationen in einer Schleife wiedergeben oder mit dem Ping-Pong-Modus vorwärts und rückwärts laufen lassen.

Bei Animationen kannst du auch einen Interpolationstyp wählen. Der Interpolationstyp bestimmt den Abschwächungstyp bzw. die Animationskurve, der deine Animation folgt. Der lineare Interpolationstyp gibt deine Animation z. B. mit einer konstanten Geschwindigkeit wieder, während der Ease-in-Typ langsam startet und dann zum Ende hin Geschwindigkeit aufnimmt.

Durch die Auswahl des richtigen Interpolationstyps für deine Animation kannst du an verschiedenen Punkten festlegen, ob sich das Prop verlangsamen, beschleunigen oder sich linear bewegen soll. Durch das Anwenden einer Komponente zur Implementierung dieser Verhaltensweisen auf Entitäten in deinem Level kannst du bewegliche Plattformen erstellen, über die deine Spieler navigieren können.

Überlege zunächst, welche Verhaltensweisen eine bewegliche Plattform ausführen können sollte. Sie sollte von einer gegebenen Startposition aus mit der Animation beginnen und sich dann zu mehreren Punkten bewegen. Wenn sie das Ende ihrer Bewegung erreicht, sollte sie entweder zu ihrer Startposition zurückkehren oder an Ort und Stelle bleiben können.

Sie sollte diese Bewegungen über eine bestimmte Dauer ausführen und sich an jedem Punkt ihrer Bewegung entsprechend drehen und die Skalierung anpassen können. Jede dieser Verhaltensweisen erfordert spezifischen Code, aber wenn man von einer einfachen Klasse ausgeht und sie ausbaut, kann man schnell verschiedene Ideen ausprobieren. Befolge diese Schritte, um eine animationsbasierte Bewegungskomponente zu erstellen.

1. Erstelle eine neue Verse-Komponente mit dem Namen animate_to_targets_component und öffne sie in Visual Studio Code. Weitere Informationen zum Erstellung deiner eigenen Verse-Komponenten findest du unter Creating Your Own Verse Component. Füge using -Anweisungen für die /Verse.org/SpatialMath hinzu, /Verse.org/SceneGraph/KeyframedMovement, und /UnrealEngine.com/Temporary/SpatialMath -Modulen zu unterscheiden. Du wirst später deren Funktionen benötigen.

   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. Die in diesem Abschnitt des Tutorials verwendeten Tooltips sind unten enthalten. Du kannst diese über deiner Klassendefinition animate_to_targets_component kopieren und einfügen. 

   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. Füge die folgenden Felder zu deiner animate_to_targets_component-Klassendefinition hinzu:

   • Eine Float-Variable „editable_number“ mit dem Namen InitialPauseSeconds. Dies ist die Zeitspanne, die vergeht, bevor die Entität mit der Animation beginnt. Setze dies auf 10,0, damit die Entität zehn Sekunden wartet, bevor sie mit der Animation beginnt.

   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)

   • Ein „editable“ Keyframed_movement_playback_mode mit dem Namen AnimationPlaybackMode. Dies ist der Animationsmodus für die Animation der Entität. Lege diesen auf loop_keyframed_movement_playback_mode fest. Das bedeutet, dass standardmäßig, wenn die Animation beendet ist, die Entität eine Schleife ausführt und ihre Animation wieder von vorne beginnt.

   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. Speichere deinen Code und kompiliere ihn.

Aufteilen von Animationen in Segmente

Um Animationen im Code zu erstellen, verwendest du Keyframes. Animationen bestehen aus mindestens einem Keyframe und jeder Keyframe gibt die Werte eines Objekts an bestimmten Punkten in der Animation an. Durch das Erstellen einer Animation mit Keyframes kannst du mehrere Punkte festlegen, zu denen sich dein Prop bewegen, drehen und skalieren soll.

Keyframed_movement_component verwendet Keyframed_movement_delta als Keyframe-Typ. Diese Bewegungsdeltas haben drei Werte:

• Transform: Gibt die Änderungen der Transformation relativ zum vorherigen Keyframe an.

• Dauer: Die Zeit in Sekunden, die der Keyframe in Anspruch nimmt

• Easing: Die Easing-Funktion, die bei der Wiedergabe dieses Keyframes verwendet werden soll.

Da keyframed_movement_component ein Array von Keyframes nimmt und diese dann abspielt, musst du alle Keyframes auf einmal für jede Animation, die du abspielen möchtest, bereitstellen. Es gibt dazu zwei Möglichkeiten:

1. Du kannst im Code ein Array mit mehreren Keyframes erstellen und es dann an die Keyframe-Bewegungskomponente übergeben, um eine einzelne Animation abzuspielen.

2. Du kannst mehrere Arrays erstellen, die jeweils einen einzelnen Keyframe enthalten, und diese einzeln an die Keyframe-Bewegungskomponente übergeben, um mehrere Animationen nacheinander abzuspielen.

Beide Optionen haben ihre Vor- und Nachteile. Mit Arrays von einzelnen Keyframes kannst du Vorgänge zwischen Keyframes einfacher durchführen, allerdings ist für die Verarbeitung mehr Code erforderlich. Das Erstellen aller Keyframes auf einmal macht die Verwaltung einfacher, aber es ist schwieriger, Operationen während der Animation durchzuführen. Sowohl das Tutorial Animieren von Objektbewegungen als auch dieses Tutorial decken den ersten Ansatz ab, aber eine Implementierung des zweiten Ansatzes wird auch bereitgestellt.

Um individuelle Keyframes im Code zu erstellen, definierst du eine segment-Klasse. Jedes Segment repräsentiert einen Keyframe, der von keyframed_movement_component verwendet wird, den du im Editor erstellen kannst. Du kannst auch zusätzliche Daten einschließen, z. B. die Zeit, die zwischen den einzelnen Keyframes gewartet wird. Folge den nachstehenden Schritten, um deine „segment“-Klasse zu erstellen.

1. Füge eine neue Klasse mit dem Namen segment zu deiner Datei animate_to_targets_component.verse hinzu. Füge den Bezeichner <concrete> hinzu, damit diese Klasse als @editable-Wert verwendet werden kann.

   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. Füge die folgenden Felder zu deiner „segment“-Klassendefinition hinzu:

   • Eine bearbeitbare Entitätsoption mit dem Namen SegmentStartPosition. Diese Entität dient als Referenz für die Weltposition, von der aus die Entität mit der Animation beginnen soll.

   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)

   • Ein bearbeitbarer Float mit dem Namen AnimationDuration. Dies ist die Zeit, die dieses Animation-Segment zum Abspielen benötigt. Lege diesen Wert auf 2,0 fest, sodass die Wiedergabe jedes Animationssegments zwei Sekunden dauert.  

   Verse

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

   Copy full snippet(4 lines long)

   • Eine bearbeitbare Option für die Easing-Funktion mit dem Namen EasingFunction. Dies ist die Easing-Funktion, die in diesem Segment der Animation verwendet wird.  

   Verse

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

   Copy full snippet(4 lines long)

   Jede Easing-Funktion wird durch eine kubische Bézier-Kurve definiert, die aus vier Zahlen besteht, die die Art der Easing-Funktion bestimmen, die die Animation verwendet. Zum Beispiel verlangsamen die Parameter für eine Ease-in-Kurve die Animation zu Beginn und beschleunigen sie danach.

   Die Parameter für eine lineare Kurve geben die Animation mit einer konstanten Geschwindigkeit wieder. Du kannst diese Werte selbst definieren, um deine eigenen benutzerdefinierten Animationskurven zu erstellen, aber in diesem Beispiel musst du das nicht, da du die im Modul KeyframedMovement definierten verwenden wirst.

   • Eine bearbeitbare Float-Option mit dem Namen PauseSeconds. Dies ist die Zeit in Sekunden, die pausiert werden soll, bevor dieses Animationssegment gestartet wird. Du kannst dir das als die Zeit vorstellen, die eine Entität verweilt, bevor sie sich von jedem Punkt auf ihrem Pfad weiterbewegt.  

   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. Füge in deiner Klassendefinition animate_to_targets_component die folgenden Felder hinzu:

   • Ein bearbeitbares segment-Array mit dem Namen Segments. Dies verweist auf jedes Segment der Animation, das die gesamte Animation ausmacht, durch die deine Entität läuft.

   Verse

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

   Copy full snippet(4 lines long)

   • Eine bearbeitbare Easing-Funktion mit dem Namen DefaultEasingFunction. Wenn ein Animationssegment keine Easing-Funktion spezifiziert, wird dies als Standardfunktion verwendet. Lege dies auf assert_in_out_cupic_bezier_easing_function fest.  

   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. Speichere deinen Code und kompiliere ihn. Im Editor solltest du sehen, dass das Segments-Array auf Entitäten erscheint, die animate_to_targets_component angekoppelt haben.

Erstellen von Keyframes mit Code

Nachdem deine Segment-Klasse fertig ist, ist es Zeit, die Keyframes zu erstellen, die deine Segmente definieren. Du erstellst Keyframes einzeln und fügst sie zu einem Array hinzu und übergibst das Array dann an keyframed_movement_component. Dies erfordert einige mathematische Berechnungen, die du jetzt definieren wirst.

Da mathematische Operationen in verschiedenen Szenarien nützlich sind, ist es hilfreich, diese Logik in einer Utility-Datei zu platzieren, um von allen deinen Verse-Komponenten darauf zugreifen zu können. Weitere optimale Vorgehensweisen für Verse beim Arbeiten mit Entitäten findest du unter Creating Your Own Verse Component. Folge diesen Schritten, um deine Hilfsdatei zu erstellen:

1. Erstelle ein neues Modul in deiner animate_to_targets.verse-Datei mit dem Namen Utilities. Dadurch wird eine allgemeine Logik gespeichert, die du in deinem Projekt verwenden wirst.

   Verse

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

   Copy full snippet(2 lines long)

2. Füge einen neuen vector3-Typ-Alias namens VectorOnes zu deinem Utilities-Modul hinzu, der einen vector3 erstellt, bei dem Left, Up und Forward alle auf 1.0 gesetzt sind. Dieser Vektor hilft dir später, einen Teil der mathematischen Berechnungen zu vereinfachen. Wenn du also einen Typ-Alias definierst, musst du nicht wiederholt vector3{Left := 1.0, Up := 1.0, Forward := 1.0} schreiben. Da du sowohl das Modul /Verse.org/SpatialMath importiert hast als auch das Modul /UnrealEngine.com/Temporary/SpatialMath, musst du angeben, dass dies ein /Verse.org/SpatialMath vector3 ist, da beide Module eine Definition dafür enthalten.

   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. Füge eine neue Funktion mit dem Namen GetDeltaTransform() zu deinem Utilities-Modul hinzu. Diese Funktion berechnet die Differenzierung zwischen zwei Transformationen und gibt das Delta zurück. Füge den Modifikator <transacts> zu dieser Funktion hinzu, damit sie zurückgesetzt werden kann. Geben Sie /Verse.org/SpatialMath an als Modul für jede Transformieren, da du die Differenz zwischen den Entitätstransformationen berechnen wirst.

   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. Initialisiere in GetDeltaTransform ein neues /Verse.org/SpatialMath transform. Lege die Verschiebung auf die Differenz zwischen der Verschiebung der einzelnen Transformationen fest. Lege die Drehung auf das Ergebnis des Aufrufs von MakeComponentWiseDeltaRotation() fest. Da sich diese Funktion im Modul /UnrealEngine.com/Temporary/SpatialMath befindet, musst du von /Verse.org/SpatialMath- Drehungen in /UnrealEngine.com/Temporary/SpatialMath-Drehungen konvertieren. Das kannst du mit der Funktion FromRotation() tun. Rufe MakeComponentWiseDeltaRotation() auf und übergib die Drehung jeder Transformation, nachdem du sie mit FromRotation() konvertiert hast. Dann konvertiere das Ergebnis dieses Funktionsaufrufs mit FromRotation() erneut, um es wieder in eine /Verse.org/SpatialMath zu konvertieren Drehung. Lege abschließend die Skalierung auf das Ergebnis des Addierens von VectorOnes zu der Differenz zwischen der ersten und zweiten Skalierung geteilt durch die erste Skalierung fest. Dadurch wird sichergestellt, dass deine Entität während der Animation korrekt skaliert wird. Deine vollständige GetDeltaTransform()-Funktion sollte wie folgt aussehen:

   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. Füge abschließend eine Funktion namens TryGetvalueOrDefault() zu deinem Utilities-Modul hinzu und füge dieser wiederum den <transacts>-Modifikator hinzu. Diese Funktion nimmt einen Optionswert eines bestimmten Typs und einen Standardwert desselben Typs und gibt entweder den Standardwert oder das Element innerhalb von Value zurück, falls es existiert. Dies ist nützlich, wenn du überprüfen möchtest, ob ein Wert in einer Klasse tatsächlich initialisiert wurde, und garantiert, dass du einen Wert zurückgibst, wenn dies nicht der Fall ist. Prüfe in TryGetValueOrDefault(), ob Value einen Wert enthält, und gib ihn zurück. Andernfalls gibst du Default zurück. Dein vollständiges Utilities-Modul und die Funktion TryGetValurOrDefault() sollten wie folgt aussehen:

   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)

Nachdem deine mathematische Berechnung definiert ist, kannst du jetzt deine Keyframes aus Code erstellen!

Folge diesen Schritten, um deine Keyframe-Erstellungsfunktionen zu erzeugen:

1. Füge eine neue Funktion mit dem Namen ConstructKeyframe() zu deiner Klassendefinition animate_to_targets hinzu. Diese Funktion benötigt eine Quell-Entität, eine Ziel-Entität, eine optionale Easing-Funktion und eine Dauer. Sie gibt sogar ein Array von keyframed_movements_delta zurück.

   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. Hole in ConstructKeyframe() zunächst die Transformationen sowohl der Quell- als auch der Ziel-Entitäten, indem du GetGlobalTransform() aufrufst.

   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. Initialisiere ein Array mit einem einzelnen Mitglied von keyframed_movement_delta. Lege die Transformation auf das Ergebnis des Aufrufs von GetDeltaTransform() fest, übergebe die Quell- und Zieltransformationen und lege die Dauer und das Easing auf die an diese Funktion übergebenen Werte fest. Deine vollständige ConstructKeyframe()-Funktion sollte wie folgt aussehen:

   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)

Diese Funktion erstellt einzelne Keyframes, aber du benötigst mehr Logik, um vollständige Animationen zu erstellen. 

1. Füge eine neue Funktion mit dem Namen ConstructAndPlayAnimations() zu deiner Klassendefinition animate_to_targets hinzu. Diese Funktion nimmt ein Array von Segmenten und den Animationswiedergabemodus und verwendet sie, um eine vollständige Animation zu erstellen und abzuspielen. Füge den Modifikator <suspends> zu dieser Funktion hinzu, damit sie asynchron ausgeführt werden kann.

   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. Definiere in ConstructAndPlayAnimations() eine neue Logikvariable mit dem Namen ShouldBreakOut und initialisiere sie mit False. Bei den drei Keyframe-Bewegungswiedergabemodi musst du jeden einzeln behandeln. Du verwendest einen Schleifenausdruck, um fortlaufend Animationen zu erstellen, um die Ping-Pong-Schleifenmodi zu verarbeiten, aber der One-Shot-Modus sollte aus der Schleife der ersten Iteration ausbrechen. Prüfe, ob der Animations-Wiedergabemodus der One-Shot-Modus ist, und wenn ja, setze ShouldBreakOut auf 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. Hole als Nächstes in einem if-Ausdruck die keyframed_movement_component der Entität in einer Variable KeyframedMovementComponent.  Hole dann die Start-Transformation der Animation in einer Variable namens StartingTransform, indem du das erste Element im InSegments-Array holst und dann dessen globale Transformation.

   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. Schließlich positionierst du die Entität an ihrer Startposition, indem du ihre globale Transformation auf die Starttransformation festlegst und versetze sie für die Dauer von InitialPauseSeconds in den Ruhezustand, bevor die Animation abgespielt wird.

   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. Jetzt ist es Zeit, das Array von Keyframes zu erstellen, aus dem du die Animation aufbauen wirst. Initialisiere zunächst ein neues Variablen-Array von keyframed_movement_delta mit dem Namen Keyframes. Iteriere als Nächstes in einem for-Ausdruck durch jedes Segment im InSegments-Array und hole sowohl das Segment als auch seinen Index in einer lokalen Variable namens 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. Hole nun die Dämpfungsfunktion, die für diesen Keyframe verwendet wird, in einer lokalen Variable namens Easing, indem dutryGetValueOrDefault() aufrufst und Segment.EasingFunction und DefaultEasingFunction übergibst. Hole außerdem die Dauer des Animationssegments in einer lokalen Variablen Duration aus Segment.AnimationDuration. Wenn alle deine Werte vorhanden sind, konstruiere in einem if-Ausdruck den Keyframe, indem du jeden Wert an ConstructKeyframe[] übergibstund das Ergebnis dem Keyframes-Array hinzufügst. When alle deine Keyframes erstellt sind, setzt du das Array von Keyframes auf die Keyframe-Bewegungskomponente, indem du SetKeyframes() aufrufst und das Keyframes -Array und den PlaybackMode übergibst.

   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. Wenn dein Keyframes-Array gesetzt ist, ist es an der Zeit, sie abzuspielen. Deine Animation muss in einer Schleife laufen, sollte aber nach der ersten Iteration stoppen, wenn der Animationsmodus auf One-Shot eingestellt ist. Es muss auch das Pausieren bei jedem Keyframe verarbeiten, wenn das Segment PauseSeconds hat. Um dies zu verarbeiten, richte einen Schleifenausdruck mit einem for-Ausdruck darin ein. Im for -Ausdruck wird jeder Keyframe im Keyframes -Array durchlaufen und zusätzlich der Index jedes Keyframes in einer Variablen KeyframeIndex abgerufen.

   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. Innerhalb des for -Ausdrucks rufst du das Segment ab, das diesem Keyframe zugeordnet ist, indem du mit KeyframeIndex in das Array InSegments indizierst. Wenn das Segment dann PauseSeconds hat, rufe Sleep() für diese Zeit auf. Rufe danach KeyframedMovement.Play() auf, warte anschließend auf das KeyframeReachedEvent und rufe KeyframedMovement.Pause() auf. Dadurch wird die Animation bei jedem Keyframe für eine Zeitspanne von PauseSeconds pausiert, bevor sie abgespielt wird, auf den nächsten Keyframe gewartet und erneut pausiert wird. Schließlich prüfe am Ende des Schleifenausdrucks, ob ShouldBreakOut true ist, und wenn ja, brich die Schleife ab.

   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. Deine fertige Funktion ContstructAndPlayAnimations() sollte wie folgt aussehen:

   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)

Im nächsten Schritt erstellst du ein Prefab deiner animierten Entität und instanziierst es im Level!

Nächster Schritt

• 

  3. Erstellen deines Plattformers mit Prefabs

  Verwende Scene Graph und Verse, um deinen eigenen Plattformer zu erstellen.