Анимации композиции

API-интерфейсы Windows.UI.Composition позволяют создавать, анимировать и преобразовывать объекты композиции, а также применять к ним различные манипуляции в унифицированном уровне API. Анимации композиции — это эффективный и удобный способ выполнения анимаций в пользовательском интерфейсе приложения. Они были разработаны с нуля, чтобы ваши анимации могли выполняться с частотой 60 кадров в секунд независимо от потока пользовательского интерфейса и у вас была необходимая гибкость для создания удивительных возможностей взаимодействия с пользователем, используя не только привязку ко времени, но также входные данные и другие свойства для запуска анимаций.

Перемещение в Windows

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

CompositionAnimations, являясь основным стандартным блоком платформы пользовательского интерфейса Windows, предоставляет мощный и эффективный способ создания возможностей перемещения в пользовательском интерфейсе приложения. Механизм анимации был разработан с нуля, чтобы гарантировать, что ваше движение выполняется со значением 60 кадров/с, независимо от потока пользовательского интерфейса. Эти анимации предназначены для обеспечения гибкости для создания инновационных возможностей движения на основе времени, входных данных и других свойств.

Примеры движения

Вот несколько примеров движения в приложении.

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

Пример подключенной анимации

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

Пример эффекта параллакса со списком и фоновым изображением

Использование CompositionAnimations для создания движения

Для создания движения в пользовательском интерфейсе разработчики могут обращаться к анимациям в XAML или визуальном слое. Анимации на визуальном уровне предоставляют разработчикам ряд преимуществ:

  • Производительность— вместо традиционной анимации, привязанной к потоку пользовательского интерфейса, анимации на платформе пользовательского интерфейса Windows работают на независимом потоке со скоростью 60 кадров/с, обеспечивая плавное перемещение.
  • Модель шаблонов — анимации на уровне пользовательского интерфейса Windows являются шаблонами, то есть могут использовать одну анимацию для нескольких объектов и настраивать свойства или параметры, не беспокоясь о препятствовании предыдущему использованию.
  • Настройка — уровень пользовательского интерфейса Windows не только упрощает создание красивого пользовательского интерфейса, но и с полным набором типов анимации, позволяет создавать новые и удивительные возможности с градиентом настроек.

Как разработчик, создающий интерфейс на уровне пользовательского интерфейса Windows, вы имеете доступ к различным концепциям анимации, чтобы оживить ваши проекты. Вы можете использовать любую из этих концепций для анимации свойства или компонента подканала (если применимо) любого объекта CompositionObject.

Примечание

Не все свойства объекта CompositionObject являются анимируемыми. Чтобы определить, является ли свойство анимируемым, обратитесь к документации по отдельному объекту CompositionObject.

Примечание

Термин subchannel относится к компонентной форме свойства. Например, подканал X или XY свойства Vector3 Offset.

Концепция анимации Описание
Перемещение на основе времени с помощью KeyFrameAnimations KeyFrameAnimations используются для непосредственного управления всем процессом перемещения в течение определенного периода времени. Разработчики описывают начало, конец, интерполяцию и длительность движения в традиционном ключе.
Относительное движение с помощью ExpressionAnimations ExpressionAnimations используется для описания того, как движение свойства одного объекта должно управляться относительно свойства другого объекта. Разработчики определяют математическое уравнение, определяющее связь на основе ссылок.
Неявные анимации Эти анимации основаны на триггерах и определяются отдельно от основной логики приложения. Неявные анимации используются для описания того, как и когда происходит анимация в ответ на прямые изменения свойств.
Движение на основе входных данных с анимацией ввода Анимация ввода охватывает набор сценариев, которые позволяют разработчикам описывать движение на основе манипуляций с помощью сенсорного ввода или других модальностей ввода. Эти анимации управляются на основе активных пользовательских данных или жестов.
Движение на основе физики с помощью NaturalMotionAnimations NaturalMotionAnimations используются для описания естественных и знакомых процессов движения, основанных на реальном движении, управляемом силой. Вместо определения времени разработчики определяют характеристики движения (например, коэффициент демпфирования для Спрингс).