Animacje

Wprowadzenie

System animacji Godota jest niezwykle potężny i elastyczny.

Na początek użyjmy sceny z poprzedniego poradnika (Ekran powitalny). Celem jest dodanie do ekranu startowego, animacji „zanikającej”. Oto kopia na wszelki wypadek: robisplash.zip.

Dodaj animację gracza

Po pierwsze, dodaj do sceny węzeł AnimationPlayer do sceny jako dziecko „background” (tło - węzeł główny):

../../_images/robisplash_anim_inspector.png

Po wybraniu węzła tego typu, zostanie wyświetlony panel animacji:

../../_images/robisplash_anim_editor.png

Edytor animacji pozostaje widoczny aż do jego ręcznego ukrycia.

Tworzenie animacji

It’s time to create a new animation! Press the Animation button then select new from the menu. Name the animation „intro” when the dialog appears.

../../_images/robisplash_anim_button.png ../../_images/robisplash_anim_new.png

Now that we have an animation, the property editor enters „animation editing” mode. In this mode, a key icon appears next to every property of the property editor. In Godot, any property of an object can be animated:

../../_images/robisplash_anim_property_keys.png

Edycja animacji

Logo pojawi się w górnej części ekranu.

With the animation editor panel open, select the „logo” node and set the „Rect / Position” property to (118, -400) and press the key button next to the property to add a keyframe:

../../_images/robisplash_anim_logo_inspector_key.png

Gdy pojawi się okno dialogowe, potwierdź, że tworzysz nową ścieżkę.

The keyframe will be added in the animation player editor:

../../_images/robisplash_anim_editor_keyframe.png

Move the editor cursor forward in time by clicking here:

../../_images/robisplash_anim_editor_track_cursor.png

Change the logo position to (118, 0) and add a keyframe again. With two keyframes with different values, the animation happens.

../../_images/robisplash_anim_editor_keyframe_2.png

Naciśnij „Play selected animation from start. (Shift-D)” na panelu animacji spowoduje opadanie loga.

../../_images/robisplash_anim_editor_play_start.png

Kliknąć przycisk „Autoplay on Load”, aby ustawić automatyczne uruchamianie animacji gdy scena jest uruchamiana.

../../_images/robisplash_anim_editor_autoplay.png

W końcu, kiedy uruchomimy scenę, animacja powinna wyglądać tak:

../../_images/out.gif