#12 AvaloniaUI - Как использовать Keyframe Анимации
00:01 Введение в анимацию ключевых кадров в Avalonia • Анимация ключевых кадров позволяет изменять свойства элемента управления в соответствии с временной шкалой. • Ключевые кадры определяются в стилях пользовательского интерфейса Avalonia и задают промежуточные значения свойств. • Значения свойств между ключевыми кадрами устанавливаются в соответствии с профилем функции ослабления по умолчанию — интерполяция по прямой линии. 01:08 Примеры использования анимации • Пример простой анимации затухания цвета с использованием XAML. • Создание коллекции стилей и добавление стиля с помощью селектора. • Определение свойства, которое нужно анимировать, с помощью элемента setter. 02:52 Настройка анимации • Добавление анимационного элемента и установка атрибута длительности. • Определение ключевых кадров: нулевой и стопроцентный процент очереди. • Анимация значений непрозрачности от нуля до единицы. 04:56 Анимация двух свойств • Изменение примера для анимации двух свойств: непрозрачности и вращения прямоугольника. • Добавление четырёх итераций анимации. • Изменение свойства для поворота прямоугольника под углом преобразования. 06:31 Задержка анимации • Добавление задержки к началу анимации с помощью атрибута «задержка». • Пример с задержкой в 10 секунд. • Изменение задержки на 5 секунд. 07:23 Повторение анимации • Настройка количества итераций анимации. • Использование значения «infinite» для бесконечного повторения. • Демонстрация бесконечной анимации. 08:22 Направление воспроизведения • Изменение направления воспроизведения анимации с помощью атрибута направления воспроизведения. • Доступные параметры: вперёд, назад, альтернативное обратное. 09:41 Режим заполнения • Определение режима заполнения анимации. • Значения режима заполнения: none, вперёд, назад, оба. • Пример с режимом заполнения «обратный». 10:32 Функция ослабления • Функция ослабления определяет, как свойство изменяется с течением времени во время анимации. • По умолчанию используется линейная функция. • Примеры других функций: «лёгкость отскока», «вход», «выход». 11:23 Заключение • Подведение итогов урока по анимации. • Призыв к подписке и лайкам.
00:01 Введение в анимацию ключевых кадров в Avalonia • Анимация ключевых кадров позволяет изменять свойства элемента управления в соответствии с временной шкалой. • Ключевые кадры определяются в стилях пользовательского интерфейса Avalonia и задают промежуточные значения свойств. • Значения свойств между ключевыми кадрами устанавливаются в соответствии с профилем функции ослабления по умолчанию — интерполяция по прямой линии. 01:08 Примеры использования анимации • Пример простой анимации затухания цвета с использованием XAML. • Создание коллекции стилей и добавление стиля с помощью селектора. • Определение свойства, которое нужно анимировать, с помощью элемента setter. 02:52 Настройка анимации • Добавление анимационного элемента и установка атрибута длительности. • Определение ключевых кадров: нулевой и стопроцентный процент очереди. • Анимация значений непрозрачности от нуля до единицы. 04:56 Анимация двух свойств • Изменение примера для анимации двух свойств: непрозрачности и вращения прямоугольника. • Добавление четырёх итераций анимации. • Изменение свойства для поворота прямоугольника под углом преобразования. 06:31 Задержка анимации • Добавление задержки к началу анимации с помощью атрибута «задержка». • Пример с задержкой в 10 секунд. • Изменение задержки на 5 секунд. 07:23 Повторение анимации • Настройка количества итераций анимации. • Использование значения «infinite» для бесконечного повторения. • Демонстрация бесконечной анимации. 08:22 Направление воспроизведения • Изменение направления воспроизведения анимации с помощью атрибута направления воспроизведения. • Доступные параметры: вперёд, назад, альтернативное обратное. 09:41 Режим заполнения • Определение режима заполнения анимации. • Значения режима заполнения: none, вперёд, назад, оба. • Пример с режимом заполнения «обратный». 10:32 Функция ослабления • Функция ослабления определяет, как свойство изменяется с течением времени во время анимации. • По умолчанию используется линейная функция. • Примеры других функций: «лёгкость отскока», «вход», «выход». 11:23 Заключение • Подведение итогов урока по анимации. • Призыв к подписке и лайкам.