Введение в возможности анимации¶

Узел AnimationPlayer позволяет создавать вам что угодно, от простой до сложной анимации.

В этом руководстве Вы узнаете:

Работа с панелью анимации
Анимация любого параметра узла
Создание простой анимации
Вызов функций с помощью Call Function Tracks

В Godot, вы можете анимировать всё, что доступно в инспекторе. Например: настройки трансформации узла, спрайты, UI элементы, параметры частиц, видимость и цвет материалов, и т.д. Вы также можете менять значения переменных и вызывать любые функции.

Создание узла AnimationPlayer¶

Чтобы использовать инструменты анимации, мы сначала должны создать узел AnimationPlayer.

Узел AnimationPlayer – это контейнер для данных ваших анимаций. Один узел AnimationPlayer может хранить множество анимаций, которые могут автоматически переходить от одной к другой.

После создания узла AnimationPlayer, кликните по нему во вкладке Node, чтобы открыть панель анимации в нижней части экрана.

Панель состоит из 4х частей:

Управление анимацией (т.е. добавить, загрузить, сохранить и удалить анимацию)
Список дорожек (треков)
Шкала времени (таймлайн) с ключевыми кадрами
Управление шкалой времени и треками, где вы можете масштабировать шкалу времени и редактировать треки.

Компьютерная анимация опирается на ключевые кадры¶

Ключевой кадр определяет значение параметра в определённой точке времени.

Ключевой кадр отображается на шкале времени в виде ромба. Линия между двумя ключевыми кадрами говорит о том, что значение в этом промежутке времени не меняется.

Движок интерполирует (изменяет) значения между ключевыми кадрами, что приводит к постепенному изменению значений с течением времени.

Два ключевых кадра — все, что нужно для получения плавного движения¶

Шкала времени позволяет вставлять ключевые кадры и изменять их время. Также шкала определяет продолжительность анимации.

Каждая строка на панели анимации — это анимационная дорожка (трек) . Трек параметра (Property) и трек трансформации (Transform) отслеживают свойства узла. Их имя или идентификатор — это путь к узлу и соответствующему свойству.

Пример стандартной анимационной дорожки¶

Совет

Если вы ошиблись и начали анимировать не тот параметр/свойство, вы можете в любое время отредактировать трек. Дважды щелкните по его имени и введите новый путь. Воспроизвести анимацию можно с помощью кнопки «Воспроизвести с начала» (Горячая клавиша по умолчанию Shift + D), чтобы сразу увидеть изменения.

Руководство: Создание простой анимации¶

Настройка сцены¶

For this tutorial, we'll create a Sprite node with an AnimationPlayer as its child. We will animate the sprite to move between two points on the screen.

Предупреждение

AnimationPlayer inherits from Node instead of Node2D or Spatial, which means that the child nodes will not inherit the transform from the parent nodes due to a bare Node being present in the hierarchy.

Поэтому не рекомендуется добавлять узлы с 2D/3D преобразованием в качестве дочерних узлов узла AnimationPlayer.

Спрайт содержит текстуру, и мы анимируем этот спрайт для перемещения между двумя точками на экране. Для этого урока используйте иконку Godot (есть в проекте по умолчанию) в качестве текстуры спрайта. В качестве отправной точки переместите спрайт в левую позицию на экране.

Выберите узел AnimationPlayer, затем нажмите кнопку «Анимация» в редакторе анимации. В списке выберите «Новый» ( Add Animation ), чтобы добавить новую анимацию. И введите имя для анимации в диалоговом окне.

Добавление трека¶

Чтобы добавить новый трек для нашего спрайта, выберите спрайт и посмотрите на панель инструментов:

Эти переключатели позволяют добавлять ключевые кадры для местоположения, поворота и масштаба выбранного узла.

Отмените выбор вращения(rot), сейчас нас интересует только анимация местоположения нашего спрайта и нажмите кнопку ключа.

As we don't have a track already set up for the transform/location property, Godot asks whether it should set it up for us. Click Create.

Наш новый трек создан и наш первый ключевой кадр находится в начале временной шкалы:

Второй ключевой кадр¶

Теперь нам нужно указать позицию, куда должен направляться наш спрайт, и сколько времени потребуется, чтобы туда добраться.

Допустим, мы хотим, чтобы переход к другой точке занял 2 секунды. По умолчанию анимация длится всего 1 секунду, поэтому измените ее на 2 в элементах управления временной шкалой(в нижней части панели анимации).

Click on the timeline header near the 2-second mark and move the sprite to the target destination on the right side.

Опять же, нажмите кнопку ключа на панели инструментов. Это создает наш второй ключевой кадр.

Запуск анимации¶

Нажмите на кнопку «Воспроизвести с начала» ().

Ура! Наша анимация работает:

Назад и вперед¶

Godot имеет дополнительную функцию. Как было сказано ранее, Godot всегда вычисляет кадры между двумя ключевыми кадрами. В цикле первый ключевой кадр также является последним ключевым кадром, если ключевой кадр не указан в конце.

If you set the animation length to 4 seconds now, the animation moves back and forth. You can change this behavior if you change the track's loop mode. This is covered in the next chapter.

Настройки трека¶

Каждый трек имеет панель настроек в конце, где вы можете установить режим обновления, интерполяцию трека и режим зацикливания.

Режим обновления дорожки сообщает Godot, когда обновлять значения свойств. Это может быть:

Непрерывный: Обновляйте свойство на каждом кадре.
Дискретный: Обновляйте свойство только на ключевых кадрах.
Триггер: Обновляйте свойство только на ключевых кадрах или триггерах. Триггеры - это тип ключевых кадров, используемых свойством current_animation свойства AnimationPlayer, и дорожками воспроизведения анимации.
Захват: Если время первого ключевого кадра больше, чем 0.0, текущее значение свойства запоминается и смешивается с первым ключом анимации. Например, вы можете использовать режим Capture для перемещения узла, расположенного где угодно, в определённое место.

Для нормальной анимации используется режим «Непрерывная». Другие режимы используются для сложных анимаций.

Интерполяция говорит Godot, как рассчитать значения кадра между ключевыми кадрами. Поддерживаются следующие режимы интерполяции:

Ближайший(Nearest): установить значение ближайшего ключевого кадра
Линейный(Linear): установить значение на основе вычисления линейной функции между двумя ключевыми кадрами
Кубическая(Cubic): установить значение на основе вычисления кубической функции между двумя ключевыми кадрами

Кубическая интерполяция приводит к более естественному движению, плавный переход между ключевыми кадрами. Это обычно используется для анимации персонажа. Линейная интерполяция создает ощущение роботизированного движения.

Godot поддерживает два режима обработки зацикливания, которые влияют на анимацию:

Обрезание Перехода Зацикливания: при выборе этого варианта анимация останавливается после последнего ключевого кадра для этой дорожки. Когда первый ключевой кадр будет достигнут снова, анимация вернется к своим значениям.
Обработка Перехода Зацикливания: Godot рассчитывает анимацию после последнего ключевого кадра, чтобы снова достичь значений первого ключевого кадра.

Ключевые кадры для других свойств¶

В Godot можно анимировать не только свойства трансформации. Любое свойство может иметь трек с ключевыми кадрами.

If you select your sprite while the animation panel is visible, you get a small keyframe button for all the sprite's properties. Click on this button and Godot automatically adds a track and keyframe to the current animation.

Редактирование ключевых кадров¶

Для редактирования ключевых кадров вы можете щелкнуть по ним, чтобы открыть редактор ключевых кадров в инспекторе. Вы можете использовать это для редактирования значений выбранного ключевого кадра.

Редактор ключевых кадров для редактирования ключа¶

Кроме того, вы можете также изменить значение параметра easing(замедление) для этого ключевого кадра, щелкнув и перетащив параметр. Это говорит Godot, как изменять значения свойства, когда анимация достигает этого ключевого кадра.

Используйте такой способ для настройки своей анимации, когда движение выглядит "не очень".

Дополнительно: Трек Вызова Метода¶

Движок анимации Godot на этом не останавливается. Если вы уже знакомы с языком сценариев Godot doc_gdscript`и :doc:/classes/index`, вы знаете, что каждый узел в сцене является экземпляром класса и имеет множество методов которые можно вызывать.

Например, тип узла AudioStreamPlayer имеет метод для воспроизведения аудиопотока.

Разве не здорово было бы вызывать метод на определенном ключевом кадре анимации? Вот где «Трек Вызова Метода» пригодятся. Эти треки ссылаются на узел, но на этот раз без ссылки на свойство. Вместо этого ключевой кадр содержит имя и аргументы метода, который Godot должен вызывать при достижении этого ключевого кадра.

В качестве демонстрации, мы собираемся использовать «Трек Вызова Метода» для воспроизведения аудио на определенном ключевом кадре. Обычно для воспроизведения аудио вы должны использовать “Трек Аудио Дорожки”, но для демонстрации мы собираемся сделать это следующим образом.

Добавляет AudioStreamPlayer в дерево сцены и устанавливает поток используемого аудиофайла, который вы поместили в свой проект.

Нажмите кнопку "Добавить дорожку" ( Add track ) на панели управления дорожками анимации.

Выберите "Добавить дорожку метода вызова" из списка возможных типов дорожек.

Выберите узел AudioStreamPlayer в окне выбора. Godot добавляет дорожку со ссылкой на узел.

Щелкните правой кнопкой мыши на временной шкале, где Godot должен воспроизвести образец, и выберите опцию "Вставить ключ". Появится список методов, которые могут быть вызваны для узла AudioStreamPlayer. Выберите первый из них.

../../_images/animation_method_options.png

Когда Godot достигает ключевого кадра, Godot вызывает функцию "play" узла AudioStreamPlayer и поток воспроизводится.

Вы можете изменить его положение, перетащив его на временной шкале, вы также можете щелкнуть на ключевом кадре и использовать настройки ключевого кадра в инспекторе.

../../_images/animation_call_method_keyframe.png

Using RESET tracks¶

Вы можете настроить специальную анимацию RESET, содержащую "позу по умолчанию". Это используется для обеспечения восстановления позы по умолчанию при сохранении сцены и повторном ее открытии в редакторе.

Для существующих дорожек можно добавить анимацию под названием "RESET" (с учетом регистра), а затем добавить дорожки для каждого свойства, которое вы хотите сбросить. Единственный ключевой кадр должен быть в момент времени 0, и задайте ему желаемое значение по умолчанию для каждой дорожки.

Если свойство AnimationPlayer Reset On Save установлено в true, сцена будет сохранена с эффектами анимации сброса (как если бы она была искана по времени 0.0). Это влияет только на сохраненный файл - треки свойств в редакторе остаются на своих местах.

Если вы хотите сбросить дорожки в редакторе, выберите узел AnimationPlayer, откройте нижнюю панель Animation, затем выберите Apply Reset в выпадающем меню редактора анимации Animation.

При добавлении дорожек для новых анимаций редактор попросит вас автоматически создать дорожку сброса при использовании значка ключевого кадра рядом со свойством в инспекторе. Это не относится к дорожкам, созданным в версиях Godot до 3.4, поскольку функция дорожки сброса анимации была добавлена в 3.4.