diff --git a/tutorials/animation/img/animation_add_audiostreamplayer.png b/tutorials/animation/img/animation_add_audiostreamplayer.png index 014578fac..a666ecabe 100644 Binary files a/tutorials/animation/img/animation_add_audiostreamplayer.png and b/tutorials/animation/img/animation_add_audiostreamplayer.png differ diff --git a/tutorials/animation/img/animation_add_call_func_track.png b/tutorials/animation/img/animation_add_call_func_track.png deleted file mode 100644 index d25124824..000000000 Binary files a/tutorials/animation/img/animation_add_call_func_track.png and /dev/null differ diff --git a/tutorials/animation/img/animation_add_call_method_track.png b/tutorials/animation/img/animation_add_call_method_track.png new file mode 100644 index 000000000..7a9fc8c05 Binary files /dev/null and b/tutorials/animation/img/animation_add_call_method_track.png differ diff --git a/tutorials/animation/img/animation_add_keyframe.png b/tutorials/animation/img/animation_add_keyframe.png deleted file mode 100644 index cc11c7fb3..000000000 Binary files a/tutorials/animation/img/animation_add_keyframe.png and /dev/null differ diff --git a/tutorials/animation/img/animation_animation_panel.png b/tutorials/animation/img/animation_animation_panel.png index ff7664cb7..b6633ff62 100644 Binary files a/tutorials/animation/img/animation_animation_panel.png and b/tutorials/animation/img/animation_animation_panel.png differ diff --git a/tutorials/animation/img/animation_animation_panel_overview.png b/tutorials/animation/img/animation_animation_panel_overview.png index a296ba224..68ff65e79 100644 Binary files a/tutorials/animation/img/animation_animation_panel_overview.png and b/tutorials/animation/img/animation_animation_panel_overview.png differ diff --git a/tutorials/animation/img/animation_animation_panel_reference.png b/tutorials/animation/img/animation_animation_panel_reference.png deleted file mode 100644 index 0cfcc130d..000000000 Binary files a/tutorials/animation/img/animation_animation_panel_reference.png and /dev/null differ diff --git a/tutorials/animation/img/animation_animation_player_tree.png b/tutorials/animation/img/animation_animation_player_tree.png index 7173a3f10..cf200f633 100644 Binary files a/tutorials/animation/img/animation_animation_player_tree.png and b/tutorials/animation/img/animation_animation_player_tree.png differ diff --git a/tutorials/animation/img/animation_call_func_add_keyframe.png b/tutorials/animation/img/animation_call_func_add_keyframe.png deleted file mode 100644 index 641731710..000000000 Binary files a/tutorials/animation/img/animation_call_func_add_keyframe.png and /dev/null differ diff --git a/tutorials/animation/img/animation_call_func_keyframe.png b/tutorials/animation/img/animation_call_func_keyframe.png deleted file mode 100644 index f17262be0..000000000 Binary files a/tutorials/animation/img/animation_call_func_keyframe.png and /dev/null differ diff --git a/tutorials/animation/img/animation_call_method_keyframe.png b/tutorials/animation/img/animation_call_method_keyframe.png new file mode 100644 index 000000000..76c70ac34 Binary files /dev/null and b/tutorials/animation/img/animation_call_method_keyframe.png differ diff --git a/tutorials/animation/img/animation_convenience_buttons.png b/tutorials/animation/img/animation_convenience_buttons.png index 7e2a9765d..a4ce22422 100644 Binary files a/tutorials/animation/img/animation_convenience_buttons.png and b/tutorials/animation/img/animation_convenience_buttons.png differ diff --git a/tutorials/animation/img/animation_create_animationplayer.png b/tutorials/animation/img/animation_create_animationplayer.png index 4a49f7954..d265ea671 100644 Binary files a/tutorials/animation/img/animation_create_animationplayer.png and b/tutorials/animation/img/animation_create_animationplayer.png differ diff --git a/tutorials/animation/img/animation_create_new_animation.png b/tutorials/animation/img/animation_create_new_animation.png index cfe486598..7794f83b1 100644 Binary files a/tutorials/animation/img/animation_create_new_animation.png and b/tutorials/animation/img/animation_create_new_animation.png differ diff --git a/tutorials/animation/img/animation_illustration.png b/tutorials/animation/img/animation_illustration.png index 696e2d6c6..b5d248267 100644 Binary files a/tutorials/animation/img/animation_illustration.png and b/tutorials/animation/img/animation_illustration.png differ diff --git a/tutorials/animation/img/animation_keyframe_editor_key.png b/tutorials/animation/img/animation_keyframe_editor_key.png index 2703ccbca..223666d3b 100644 Binary files a/tutorials/animation/img/animation_keyframe_editor_key.png and b/tutorials/animation/img/animation_keyframe_editor_key.png differ diff --git a/tutorials/animation/img/animation_keyframe_editor_toggle.png b/tutorials/animation/img/animation_keyframe_editor_toggle.png deleted file mode 100644 index f797be147..000000000 Binary files a/tutorials/animation/img/animation_keyframe_editor_toggle.png and /dev/null differ diff --git a/tutorials/animation/img/animation_keyframe_editor_transition.png b/tutorials/animation/img/animation_keyframe_editor_transition.png deleted file mode 100644 index be13be7cb..000000000 Binary files a/tutorials/animation/img/animation_keyframe_editor_transition.png and /dev/null differ diff --git a/tutorials/animation/img/animation_loop.png b/tutorials/animation/img/animation_loop.png index 6b551940a..df1a849c7 100644 Binary files a/tutorials/animation/img/animation_loop.png and b/tutorials/animation/img/animation_loop.png differ diff --git a/tutorials/animation/img/animation_method_options.png b/tutorials/animation/img/animation_method_options.png new file mode 100644 index 000000000..7486705bb Binary files /dev/null and b/tutorials/animation/img/animation_method_options.png differ diff --git a/tutorials/animation/img/animation_normal_track.png b/tutorials/animation/img/animation_normal_track.png index 3ded61416..43393a7cd 100644 Binary files a/tutorials/animation/img/animation_normal_track.png and b/tutorials/animation/img/animation_normal_track.png differ diff --git a/tutorials/animation/img/animation_play_from_beginning.png b/tutorials/animation/img/animation_play_from_beginning.png index 8cf0b192d..d4436d85e 100644 Binary files a/tutorials/animation/img/animation_play_from_beginning.png and b/tutorials/animation/img/animation_play_from_beginning.png differ diff --git a/tutorials/animation/img/animation_properties_keyframe.png b/tutorials/animation/img/animation_properties_keyframe.png index af336a474..8f65440f6 100644 Binary files a/tutorials/animation/img/animation_properties_keyframe.png and b/tutorials/animation/img/animation_properties_keyframe.png differ diff --git a/tutorials/animation/img/animation_reference_animation_controls.png b/tutorials/animation/img/animation_reference_animation_controls.png deleted file mode 100644 index 7e615283e..000000000 Binary files a/tutorials/animation/img/animation_reference_animation_controls.png and /dev/null differ diff --git a/tutorials/animation/img/animation_reference_animation_management.png b/tutorials/animation/img/animation_reference_animation_management.png deleted file mode 100644 index 2d0d2bb67..000000000 Binary files a/tutorials/animation/img/animation_reference_animation_management.png and /dev/null differ diff --git a/tutorials/animation/img/animation_reference_timeline_controls.png b/tutorials/animation/img/animation_reference_timeline_controls.png deleted file mode 100644 index 4f9dde40d..000000000 Binary files a/tutorials/animation/img/animation_reference_timeline_controls.png and /dev/null differ diff --git a/tutorials/animation/img/animation_reference_timeline_zoom_level.png b/tutorials/animation/img/animation_reference_timeline_zoom_level.png deleted file mode 100644 index 50b625d0e..000000000 Binary files a/tutorials/animation/img/animation_reference_timeline_zoom_level.png and /dev/null differ diff --git a/tutorials/animation/img/animation_reference_track_control.png b/tutorials/animation/img/animation_reference_track_control.png deleted file mode 100644 index 6e02ee022..000000000 Binary files a/tutorials/animation/img/animation_reference_track_control.png and /dev/null differ diff --git a/tutorials/animation/img/animation_select_audiostreamplayer.png b/tutorials/animation/img/animation_select_audiostreamplayer.png index d6433dcf7..dd245e41e 100644 Binary files a/tutorials/animation/img/animation_select_audiostreamplayer.png and b/tutorials/animation/img/animation_select_audiostreamplayer.png differ diff --git a/tutorials/animation/img/animation_set_length.png b/tutorials/animation/img/animation_set_length.png index 00a5a9707..d9776f543 100644 Binary files a/tutorials/animation/img/animation_set_length.png and b/tutorials/animation/img/animation_set_length.png differ diff --git a/tutorials/animation/img/animation_timeline.png b/tutorials/animation/img/animation_timeline.png index 3abfa46b1..445d2a12d 100644 Binary files a/tutorials/animation/img/animation_timeline.png and b/tutorials/animation/img/animation_timeline.png differ diff --git a/tutorials/animation/img/animation_track_interpolation.png b/tutorials/animation/img/animation_track_interpolation.png index 638d43616..a44821385 100644 Binary files a/tutorials/animation/img/animation_track_interpolation.png and b/tutorials/animation/img/animation_track_interpolation.png differ diff --git a/tutorials/animation/img/animation_track_loop_modes.png b/tutorials/animation/img/animation_track_loop_modes.png index d467159e0..c84163ec7 100644 Binary files a/tutorials/animation/img/animation_track_loop_modes.png and b/tutorials/animation/img/animation_track_loop_modes.png differ diff --git a/tutorials/animation/img/animation_track_rate.png b/tutorials/animation/img/animation_track_rate.png index fc1ff5788..36efc587a 100644 Binary files a/tutorials/animation/img/animation_track_rate.png and b/tutorials/animation/img/animation_track_rate.png differ diff --git a/tutorials/animation/img/animation_track_settings.png b/tutorials/animation/img/animation_track_settings.png index 5f935b0c2..a0a111dcb 100644 Binary files a/tutorials/animation/img/animation_track_settings.png and b/tutorials/animation/img/animation_track_settings.png differ diff --git a/tutorials/animation/introduction_2d.rst b/tutorials/animation/introduction_2d.rst index 5592c836f..ce814426d 100644 --- a/tutorials/animation/introduction_2d.rst +++ b/tutorials/animation/introduction_2d.rst @@ -36,15 +36,15 @@ automatically transition to one another. The AnimationPlayer node -Click on the AnimationPlayer node in the Node tab to open the Animation -Panel at the bottom of the viewport. +After creating one click on the AnimationPlayer node in the Node tab to +open the Animation Panel at the bottom of the viewport. .. figure:: img/animation_animation_panel.png :alt: The animation panel position The animation panel position -It consists of five parts: +It consists of four parts: .. figure:: img/animation_animation_panel_overview.png :alt: The animation panel @@ -54,7 +54,6 @@ It consists of five parts: - Animation controls (i.e. add, load, save, and delete animations) - The tracks listing - The timeline with keyframes -- The keyframe editor (when enabled) - The timeline and track controls, where you can zoom the timeline and edit tracks for example. @@ -66,7 +65,8 @@ Computer animation relies on keyframes A keyframe defines the value of a property at a certain point in time. -White and blue diamond shapes represent keyframes in the timeline. +Diamond shapes represent keyframes in the timeline. A line between two +keyframes indicates that the value hasn't changed. .. figure:: img/animation_keyframes.png :alt: Keyframes in Godot @@ -112,7 +112,7 @@ Scene setup ~~~~~~~~~~~ For this tutorial, we'll going to create an AnimationPlayer node and a -sprite node as an AnimationPlayer node child. +sprite node as its child. .. figure:: img/animation_animation_player_tree.png :alt: Our scene setup @@ -120,7 +120,8 @@ sprite node as an AnimationPlayer node child. Our scene setup The sprite holds an image texture and we animate that sprite to move -between two points on the screen. As a starting point, move the sprite +between two points on the screen. For this tutorial use the default Godot +Icon as the sprites' texture. As a starting point, move the sprite to a left position on the screen. .. tip:: @@ -129,10 +130,10 @@ to a left position on the screen. required, but it is a nice way of distinguishing animated nodes from non-animated nodes in the Scene Tree. -Select the AnimationPlayer node and click on "Add animation" (|Add -Animation|) in the animation tab to add a new animation. - -Enter a name for the animation in the dialog box. +Select the AnimationPlayer node, then click the "Animation" button in the +animation editor. From the list select "New" (|Add +Animation|) to add a new animation. And Enter a name for the animation in the +dialog box. .. figure:: img/animation_create_new_animation.png :alt: Add a new animation @@ -219,8 +220,7 @@ Yay! Our animation runs: Back and forth ~~~~~~~~~~~~~~ -As you can see, the "loop" button is enabled by default and our -animation loops. Godot has an additional feature here. Like said before, +Godot has an additional feature here. Like said before, Godot always calculates the frames between two keyframes. In a loop, the first keyframe is also the last keyframe, if no keyframe is specified at the end. @@ -238,24 +238,25 @@ Track settings ~~~~~~~~~~~~~~ Each track has a settings panel at the end, where you can set the update -rate, the track interpolation, and the loop mode. +mode, the track interpolation, and the loop mode. .. figure:: img/animation_track_settings.png :alt: Track settings Track settings -The update rate of a track tells Godot when to update the property +The update mode of a track tells Godot when to update the property values. This can be: - Continuous: Update the property on each frame - Discrete: Only update the property on keyframes - Trigger: Only update the property on keyframes or triggers +- Capture: The current value of a property is remembered, and it will blend with the first animation key found .. figure:: img/animation_track_rate.png - :alt: Track rate + :alt: Track mode - Track rate + Track mode In normal animations, you usually use "Continuous". The other types are used to script complex animations. @@ -313,67 +314,56 @@ current animation. Edit keyframes -------------- -For advanced use and to edit keyframe in detail, enable the keyframe -editor (|Keyframe editor|). - -This adds an editor pane on the right side of the track settings. When -you select a keyframe, you can directly edit its values in this editor: +For advanced use and to edit keyframes in detail, You can click on them +to bring up the keyframe editor in the inspector. You can use this to +directly edit its values. .. figure:: img/animation_keyframe_editor_key.png :alt: Keyframe editor editing a key Keyframe editor editing a key -Additionally, you can also edit the transition value for this keyframe: - -.. figure:: img/animation_keyframe_editor_transition.png - :alt: Keyframe editor editing a transition - - Keyframe editor editing a transition - -This tells Godot, how to change the property values when it reaches this -keyframe. +Additionally, you can also edit the easing value for this keyframe by +clicking and dragging the easing setting. This tells Godot, how to change +the property values when it reaches this keyframe. You usually tweak your animations this way, when the movement doesn't "look right". -Advanced: Call Func tracks --------------------------- +Advanced: Call Method tracks +---------------------------- Godot's animation engine doesn't stop here. If you're already comfortable with Godot's scripting language :ref:`doc_gdscript` and :doc:`/classes/index` you know that each node type is a class and has a bunch of callable -functions. +methods. For example, the :ref:`class_AudioStreamPlayer` node type has a -function to play an audio stream. +method to play an audio stream. -Wouldn't it be great to play a stream at a specific keyframe in an -animation? This is where "Call Func Tracks" come in handy. These tracks +Wouldn't it be great to use a method at a specific keyframe in an +animation? This is where "Call Method Tracks" come in handy. These tracks reference a node again, this time without a reference to a property. -Instead, a keyframe holds the name and arguments of a function, that +Instead, a keyframe holds the name and arguments of a method, that Godot should call when it reaches this keyframe. -To let Godot play a sample when it reaches a keyframe, follow this list: +To demonstrate, we're going to use a call method track to play audio at a +specific keyframe. Normally to play audio you should use an audio track, +but for the sake of demonstrating methods we're going to do it this way. Add a :ref:`class_AudioStreamPlayer` to the Scene Tree and setup a stream using an audio file you put in your project. -.. figure:: img/animation_add_audiostreamplayer.png - :alt: Add AudioStreamPlayer - - Add AudioStreamPlayer - Click on "Add track" (|Add track|) on the animation panel's track controls. -Select "Add Call Func Track" from the list of possible track types. +Select "Add Call Method Track" from the list of possible track types. -.. figure:: img/animation_add_call_func_track.png - :alt: Add Call Func Track +.. figure:: img/animation_add_call_method_track.png + :alt: Add Call Method Track - Add Call Func Track + Add Call Method Track Select the :ref:`class_AudioStreamPlayer` node in the selection window. Godot adds the track with the reference to the node. @@ -383,114 +373,22 @@ window. Godot adds the track with the reference to the node. Select AudioStreamPlayer -Select the timeline position, where Godot should play the sample by -clicking on the timeline header. +Right click the timeline where Godot should play the sample and +click the "Insert Key" option. This will bring up a list of methods +that can be called for the AudioStreamPlayer node. Select the first +one. -Enable the Keyframe Editor by clicking on |Keyframe editor|. - -Click on "Add keyframe" near the settings of our func track (|Add -keyframe|) and select the keyframe. - -.. figure:: img/animation_call_func_add_keyframe.png - :alt: Add a keyframe to the call func track - - Add a keyframe to the call func track - -Enter "play" as the function name. - -.. figure:: img/animation_call_func_keyframe.png - :alt: Keyframe settings of a call func track - - Keyframe settings of a call func track +.. image:: img/animation_method_list.png When Godot reaches the keyframe, Godot calls the :ref:`class_AnimationPlayer` node's "play" function and the stream plays. -References ----------- +You can change its position by dragging it on the timeline, you can also +click on the keyframe and use the keyframe settings in the inspector. -Animation panel reference -~~~~~~~~~~~~~~~~~~~~~~~~~ - -.. figure:: img/animation_animation_panel_reference.png - :alt: The animation panel reference - - The animation panel reference - -The animation panel has the following parts (from left to right): - -Animation controls -^^^^^^^^^^^^^^^^^^ - -.. figure:: img/animation_reference_animation_controls.png - :alt: Animation controls - - Animation controls - -- Play animation backwards from current position -- Play animation backwards from the animation end -- Stop animation -- Play animation forwards from the animation beginning -- Play animation forwards from the current position -- Direct time selection - -Animation management -^^^^^^^^^^^^^^^^^^^^ - -.. figure:: img/animation_reference_animation_management.png - :alt: Animation management - - Animation management - -- Create a new animation -- Load animation -- Save animation -- Duplicate animation -- Rename animation -- Delete animation -- Animation selection -- Automatically play selected animation -- Edit animation blend times -- Extended animation Tools - -Timeline zoom level control -^^^^^^^^^^^^^^^^^^^^^^^^^^^ - -.. figure:: img/animation_reference_timeline_zoom_level.png - :alt: Timeline zoom level control - - Timeline zoom level control - -Timeline control -^^^^^^^^^^^^^^^^ - -.. figure:: img/animation_reference_timeline_controls.png - :alt: Timeline control - - Timeline control - -- Length of animation -- Steps of animation -- Toggle loop animation - -Track control -^^^^^^^^^^^^^ - -.. figure:: img/animation_reference_track_control.png - :alt: Track control - - Track control - -- Add track -- Move track up -- Move track down -- Delete track -- Extended track tools -- Toggle keyframe editor +.. img:: img/animation_call_method_keyframe.png .. |Play from beginning| image:: img/animation_play_from_beginning.png .. |Add Animation| image:: img/animation_add.png -.. |Keyframe editor| image:: img/animation_keyframe_editor_toggle.png .. |Add track| image:: img/animation_add_track.png -.. |Add keyframe| image:: img/animation_add_keyframe.png