Up to date

This page is up to date for Godot 4.2. If you still find outdated information, please open an issue.

Einführung in die Animations-Features

Der AnimationPlayer-Node erlaubt es, allerlei Animationen zu erstellen - von ganz einfachen bis hin zu recht komplexen Abläufen.

In dieser Einführung lernen Sie:

  • mit dem Animationspanel zu arbeiten

  • Propertys eines beliebigen Nodes zu animieren

  • eine simple Animation zu erstellen

In Godot können Sie alles animieren, was im Inspektor verfügbar ist, z. B. Node-Transformationen, Sprites, UI-Elemente, Partikel, Sichtbarkeit und Farbe von Materialien usw. Sie können auch Werte von Skriptvariablen ändern und sogar Funktionen aufrufen.

Einen AnimationPlayer-Node anlegen

Um die Tools zur Animation zu verwenden, benötigen wir zunächst einen AnimationPlayer-Node.

Der AnimationPlayer-Node ist der Datencontainer für Ihre Animationen. Ein AnimationPlayer Node kann mehrere Animationen enthalten, die automatisch ineinander übergehen können.

Der AnimationPlayer-Node

Der AnimationPlayer-Node

Nachdem Sie einen AnimationPlayer Node erstellt haben, klicken Sie darauf, um das Animationspanel am unteren Rand des Viewports zu öffnen.

Die Position des Animationspanels

Die Position des Animationspanels

Das Animationspanel besteht aus vier Teilen:

Das Animationspanel

Das Animationspanel

  • Steuerelemente zur Organisation von Animationen (d.h. Hinzufügen, Laden, Speichern und Löschen von Animationen)

  • Die Liste der Animations-Tracks

  • Die Zeitleiste mit Keyframes

  • Die Steuerelemente für die Zeitleiste und die Tracks, mit denen Sie z. B. die Zeitleiste zoomen und Tracks bearbeiten können.

Computeranimation basiert auf Keyframes

Ein Keyframe definiert den Wert einer Property zu einem bestimmten Zeitpunkt.

Rauten stellen Keyframes in der Zeitleiste dar. Eine Linie zwischen zwei Keyframes zeigt an, dass sich der Wert zwischen ihnen nicht ändert.

Keyframes in Godot

Keyframes in Godot

Sie legen Werte für die Propertys eines Nodes fest und erstellen Animations-Keyframes für sie. Wenn die Animation läuft, interpoliert die Engine die Werte zwischen den Keyframes, so dass sie sich im Laufe der Zeit allmählich ändern.

Zwei Keyframes genügen, um eine flüssige Bewegung zu erreichen

Zwei Keyframes genügen, um eine flüssige Bewegung zu erreichen

Die Zeitleiste legt fest, wie lange die Animation dauern soll. Sie können an verschiedenen Stellen Keyframes einfügen und ihr Timing ändern.

Die Zeitleiste im Animationspanel

Die Zeitleiste im Animationspanel

Jede Zeile im Animationspanel ist ein Animations-Track, der auf eine Normalen- oder Transform-Property eines Nodes verweist. Jeder Track speichert einen Pfad zu einem Node und seiner betroffenen Property. Der Positions-Track in der Abbildung bezieht sich zum Beispiel auf die Property Position des Sprite2D-Nodes.

Beispiel für Normalen-Animations-Tracks

Beispiel für Normalen-Animations-Tracks

Tipp

Wenn Sie die falsche Property animieren, können Sie den Pfad eines Tracks jederzeit bearbeiten, indem Sie auf ihn doppelklicken und den neuen Pfad eingeben. Spielen Sie die Animation mit dem "Von Anfang an abspielen"-Button Von Anfang an abspielen ab (oder drücken Sie Umschalt + D auf der Tastatur), um die Änderungen sofort zu sehen.

Anleitung: Erstellen einer einfachen Animation

Einrichten einer Szene

In diesem Tutorial erstellen wir einen Sprite-Node mit einem AnimationPlayer als dessen Child-Node. Wir werden das Sprite so animieren, dass es sich zwischen zwei Punkten auf dem Bildschirm bewegt.

Unser Szenenaufbau

Unser Szenenaufbau

Warnung

AnimationPlayer erbt von Node anstelle von Node2D oder Node3D, was bedeutet, dass die Child-Nodes die Transformation nicht von den übergeordneten Knoten erben, da in der Hierarchie nur ein Node vorhanden ist.

Daher ist es nicht empfehlenswert, Nodes, die eine 2D/3D-Transformation haben, als Child-Node eines AnimationPlayer-Nodes hinzuzufügen.

Das Sprite enthält eine Bildtextur. Wählen Sie für dieses Tutorial den Sprite2D-Node, klicken Sie im Inspektor auf Textur und dann auf Laden. Wählen Sie das Standard-Godot-Symbol für die Textur des Sprites.

Hinzufügen einer Animation

Wählen Sie den AnimationPlayer-Node und klicken Sie im Animationseditor auf "Animation"-Button. Wählen Sie in der Liste "Neu" (Animation hinzufügen), um eine neue Animation hinzuzufügen. Geben Sie im Dialogfeld einen Namen für die Animation ein.

Fügen Sie eine neue Animation hinzu

Fügen Sie eine neue Animation hinzu

Verwalten einer Animationsbibliothek

Um die Wiederverwendbarkeit zu gewährleisten, wird die Animation in einer Liste in der Ressource Animationsbibliothek registriert. Wenn Sie eine Animation zu AnimationPlayer hinzufügen, ohne bestimmte Einstellungen festzulegen, wird die Animation in der [Globalen] Animationsbibliothek registriert, die AnimationPlayer standardmäßig besitzt.

Verwalten von Animationen

Verwalten von Animationen

Wenn mehrere Animationsbibliotheken vorhanden sind und Sie versuchen, eine Animation hinzuzufügen, wird ein Dialogfeld mit Optionen angezeigt.

Eine neue Animation mit der Bibliothek-Option hinzufügen

Eine neue Animation mit der Bibliothek-Option hinzufügen

Hinzufügen eines Tracks

Um einen neuen Track für unser Sprite hinzuzufügen, wählen Sie es aus und werfen Sie einen Blick auf die Toolbar:

Komfort-Buttons

Komfort-Buttons

Mit diesen Schaltern und Buttons können Sie Keyframes für die Position, Rotation und Skalierung des ausgewählten Nodes hinzufügen. Da wir nur die Position des Sprites animieren wollen, stellen Sie sicher, dass nur der Positions-Schalter ausgewählt ist. Die ausgewählten Schalter sind blau.

Klicken Sie auf den Schlüssel-Button, um den ersten Keyframe zu erstellen. Da wir noch keinen Track für die Property Position eingerichtet haben, bietet Godot an, diesen für uns zu erstellen. Klicken Sie auf Erstellen.

Godot erstellt einen neuen Track und fügt unseren ersten Keyframe am Anfang der Zeitleiste ein:

Der Sprite-Track

Der Sprite-Track

Der zweite Keyframe

Wir müssen die Endposition unseres Sprites festlegen und wie lange es braucht, um dorthin zu gelangen.

Angenommen, wir möchten, dass die Bewegung zwischen den Punkten zwei Sekunden dauert. Standardmäßig ist die Animation so eingestellt, dass sie nur eine Sekunde dauert. Ändern Sie daher die Animationslänge in den Steuerelementen auf der rechten Seite der Kopfzeile der Zeitleiste des Animationspanels auf 2.

Animationslänge

Animationslänge

Bewegen Sie nun das Sprite nach rechts, an seine endgültige Position. Sie können das Verschieben-Werkzeug in der Toolbar verwenden oder den X-Wert der Position im Inspektor einstellen.

Klicken Sie auf die Kopfzeile der Zeitleiste in der Nähe der Zwei-Sekunden-Marke im Animationspanel und klicken Sie dann auf die Schlüssel-Button in der Symbolleiste, um den zweiten Keyframe zu erstellen.

Die Animation starten

Klicken Sie auf den "Von Anfang an spielen" (Von Anfang an abspielen)-Button.

Hurra! Unsere Animation läuft:

Die Animation

Die Animation

Hin und her

Godot hat eine interessante Funktion, die wir in Animationen verwenden können. Wenn Animations-Looping eingestellt ist, aber kein Keyframe am Ende der Animation angegeben ist, ist der erste Keyframe auch der letzte.

Das bedeutet, dass wir die Animationslänge jetzt auf vier Sekunden verlängern können, und Godot wird auch die Frames vom letzten Keyframe bis zum ersten berechnen und unser Sprite hin und her bewegen.

Animations-Looping

Animations-Looping

Sie können dieses Verhalten ändern, indem Sie den Loop-Modus der Spur ändern. Dies wird im nächsten Kapitel behandelt.

Track-Einstellungen

Jeder Track hat am Ende ein Einstellungs-Panel, in dem Sie den Aktualisierungsmodus, die Track-Interpolation und den Loop-Modus einstellen können.

Track-Einstellungen

Track-Einstellungen

Der Aktualisierungsmodus eines Tracks teilt Godot mit, wann die Propertys aktualisiert werden sollen. Dies kann sein:

  • Kontinuierlich: Aktualisiert die Eigenschaft bei jedem Bild

  • Diskret: Aktualisiert die Eigenschaft nur bei Keyframes

  • Capture: Wenn die Zeit des ersten Keyframes größer als 0.0 ist, wird der aktuelle Wert der Property gespeichert und mit dem ersten Animations-Key überblendet. Sie können den Capture-Modus zum Beispiel verwenden, um einen Node, der sich an einer beliebigen Stelle befindet, an einen bestimmten Ort zu verschieben.

Track-Modus

Track-Modus

In der Regel werden Sie den Modus "Kontinuierlich" verwenden. Die anderen Typen werden verwendet, um komplexe Animationen zu erstellen.

Die Track-Interpolation teilt Godot mit, wie die Frame-Werte zwischen den Keyframes berechnet werden sollen. Diese Interpolationsmodi werden unterstützt:

  • Nearest: Legt den nächsten Keyframe-Wert fest

  • Linear: Legt den Wert basierend auf einer linearen Funktionsberechnung zwischen den beiden Keyframes fest

  • Kubisch: Legt den Wert basierend auf einer Berechnung der kubischen Funktion zwischen den beiden Keyframes fest

  • Linearer Winkel (erscheint nur in der Property Rotation): Linearer Modus mit Rotation auf kürzestem Weg

  • Kubischer Winkel (erscheint nur in der Property Rotation): Kubischer Modus mit Drehung auf kürzestem Weg

Track-Interpolation

Track-Interpolation

Bei der kubischen Interpolation ist die Animation an Keyframes langsamer und zwischen den Keyframes schneller, was zu einer natürlicheren Bewegung führt. Kubische Interpolation wird häufig für die Animation von Charakteren verwendet. Bei der linearen Interpolation werden Änderungen in einem festen Tempo animiert, was zu einem eher roboterhaften Effekt führt.

Godot unterstützt zwei Loop-Modi, die sich auf die Animation auswirken, wenn sie auf Looping eingestellt ist:

Loop-Modi

Loop-Modi

  • Clamp-Loop-Interpolation: Wenn diese Option ausgewählt ist, wird die Animation nach dem letzten Keyframe für diesen Track angehalten. Wenn der erste Keyframe wieder erreicht wird, wird die Animation auf ihre Werte zurückgesetzt.

  • Wiederhol-Loop-Interpolation: Wenn dies ausgewählt ist, berechnet Godot die Animation nach dem letzten Keyframe, um die Werte des ersten Keyframes wieder zu erreichen.

Keyframes für andere Propertys

Godots Animationssystem ist nicht auf Position, Rotation und Skalierung beschränkt. Sie können jede Property animieren.

Wenn Sie Ihr Sprite auswählen, während das Animationspanel sichtbar ist, zeigt Godot einen kleinen Keyframe-Button im Inspektor für jede Property des Sprites an. Klicken Sie auf einen dieser Buttons, um einen Track und Keyframe zur aktuellen Animation hinzuzufügen.

Keyframes für andere Propertys

Keyframes für andere Propertys

Keyframes bearbeiten

Sie können auf einen Keyframe in der Animationszeitleiste klicken, um seinen Wert im Inspektor anzuzeigen und zu bearbeiten.

Keyframe-Editor zum Bearbeiten eines Keys

Keyframe-Editor zum Bearbeiten eines Keys

Sie können hier auch den Easing-Wert für einen Keyframe bearbeiten, indem Sie auf die Easing-Kurve klicken und sie ziehen. Dadurch wird Godot mitgeteilt, wie die animierte Property interpoliert werden soll, wenn sie diesen Keyframe erreicht.

Sie können Ihre Animationen auf diese Weise optimieren, bis die Bewegung "richtig" aussieht.

RESET-Tracks verwenden

Sie können eine spezielle RESET-Animation einrichten, so dass sie die "Default-Pose" enthält. Diese wird verwendet, um sicherzustellen, dass die Default-Pose wiederhergestellt wird, wenn Sie die Szene speichern und erneut im Editor öffnen.

Bei vorhandenen Tracks können Sie eine Animation mit dem Namen "RESET" (Groß- und Kleinschreibung beachten) hinzufügen und dann Tracks für jede Property, die Sie zurücksetzen möchten, hinzufügen. Der einzige Keyframe sollte zum Zeitpunkt 0 sein, und ihr den gewünschten Default-Wert für jeden Track geben.

Wenn die Property Reset On Save des AnimationPlayers auf true gesetzt ist, wird die Szene mit den Effekten der zurückgesetzten Animation gespeichert (als ob sie zur Zeit 0.0 angesprungen worden wäre). Dies betrifft nur die gespeicherte Datei - die Property-Tracks im Editor bleiben, wo sie waren.

Wenn Sie die Tracks im Editor zurücksetzen möchten, wählen Sie den AnimationPlayer-Node aus, öffnen Sie das untere Panel Animation und wählen Sie im Dropdown-Menü Bearbeiten des Animationseditors die Option Zurücksetzen anwenden.

Beim Hinzufügen von Tracks zu neuen Animationen fordert der Editor Sie auf, automatisch einen RESET-Track zu erstellen, wenn Sie das Keyframe-Icon neben einer Property im Inspektor verwenden. Dies gilt nicht für Spuren, die mit Godot-Versionen vor 3.4 erstellt wurden, da die Funktion zum Zurücksetzen von Animationen erst in 3.4 hinzugefügt wurde.

Bemerkung

RESET-Tracks werden auch als Referenzwert für Blending verwendet. Siehe auch Für besseres Blending.