Визуальный уровень

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

Важные основные положения:

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

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

Что такое визуальный уровень?

Основные функции визуального уровня:

1. Содержимое: облегченная компоновка пользовательского нарисованного содержимого.
2. Эффекты: система эффектов пользовательского интерфейса в режиме реального времени, эффекты которой можно анимировать, цепочки и настраивать.
3. Анимации: выразительные, не зависящие от платформы анимации, выполняемые независимо от потока пользовательского интерфейса

Содержимое

Размещение содержимого, его преобразование и доступ к нему обеспечивает система анимации и эффектов с использованием визуальных элементов. В основе иерархии классов находится класс Visual — упрощенный прокси-сервер с гибким потоком в процессе приложения для визуального состояния в компоновщике. Подклассы Visual включают ContainerVisual , позволяющие дочерним элементам создавать деревья визуальных элементов и SpriteVisual , которые содержат содержимое и могут быть окрашены сплошными цветами, пользовательским нарисованным содержимым или визуальными эффектами. Вместе эти типы Visual составляют визуальную древовидную структуру для двумерного пользовательского интерфейса и позволяют создавать наиболее видимые элементы FrameworkElements XAML.

Дополнительные сведения см. в обзоре визуальных объектов композиции.

Произведенный эффект

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

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

Дополнительные сведения см. в обзоре эффектов композиции.

Анимации

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

Дополнительную информацию см. в обзоре анимации композиции.

Работа с приложением UWP XAML.

Получить доступ к визуальному элементу, созданному платформой XAML, и к поддержке видимого элемента FrameworkElement можно с помощью класса ElementCompositionPreview в Windows.UI.Xaml.Hosting. Обратите внимание, что визуальные элементы, созданные для вас платформой, имеют определенные ограничения, касающиеся настройки. Это связано с тем, что платформа управляет смещением, преобразованием и временем жизни. Однако можно создавать собственные визуальные элементы и вкладывать их в существующий элемент XAML через ElementCompositionPreview или путем добавления в существующий ContainerVisual в визуальной древовидной структуре.

Дополнительные сведения см. в обзоре использования визуального уровня с помощью XAML.

Работа с классическим приложением

Вы можете использовать визуальный уровень для улучшения внешнего вида, функциональности и функциональности классических приложений WPF, Windows Forms и C++ Win32. Вы можете перенести острова содержимого, чтобы использовать уровень визуальных элементов и сохранить остальную часть пользовательского интерфейса в существующей платформе. Это означает, что вы можете вносить значительные изменения в пользовательский интерфейс приложения, не внося значительных изменений в существующую базу кода.

Дополнительные сведения см. в статье Using the Visual layer in desktop apps (Использование визуального уровня в классических приложениях).

Дополнительные ресурсы

• Полная справочная документация по API
• Примеры расширенного пользовательского интерфейса и композиции в Windows Composition примеры на сайте GitHub
• Windows.UI.Composition Sample Gallery
• @windowsui twitter-канал
• Ознакомьтесь со статьей Кенни Керра (Kenny Kerr) на MSDN, которая посвящена этому API: Graphics and Animation — Windows Composition Turns 10 (Графика и анимация — композиция в Windows 10)