Использование визуального слоя в настольных приложениях

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

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

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

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

Пользовательский интерфейс, созданный с помощью визуального слоя

Создание визуально привлекательного пользовательского интерфейса в любом приложении Windows

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

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

Функции визуального слоя

Кисти

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

Яйцо, созданное с помощью Создателя материалов

Яйцо, созданное с помощью демонстрационного приложения Material Creator.

Эффекты

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

Свет и материал

Освещение и материалы, представленные в галерее примеров композиционного интерфейса Windows.

Анимации

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

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

Пример движения, продемонстрированный в галерее примеров композиций интерфейса Windows.

Сохраняйте существующую базу кода и применяйте постепенно

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

Примеры и руководства

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

Win32

Windows Forms

WPF

Ограничения

Хотя многие функции визуального слоя работают одинаково при размещении в классическом приложении, как и в приложении UWP, некоторые функции имеют ограничения. Ниже приведены некоторые ограничения, которые следует учитывать:

  • Цепочки эффектов зависят от Win2D для описания эффектов. Пакет NuGet Win2D не поддерживается в настольных приложениях, поэтому необходимо перекомпилировать его из исходного кода .
  • Чтобы выполнить тестирование попаданий, необходимо выполнить вычисления границ, йдя по визуальному дереву самостоятельно. Это то же, что и визуальный слой в UWP, за исключением того, что в этом случае нет элемента XAML, который можно легко привязать к тестированию попаданий.
  • Визуальный слой не имеет примитива для отрисовки текста.
  • При совместном использовании двух разных технологий пользовательского интерфейса, таких как WPF и визуальный слой, они отвечают за рисование собственных пикселей на экране, и они не могут совместно использовать пиксели. В результате содержимое визуального слоя всегда отображается поверх другого содержимого пользовательского интерфейса. (Это известно как проблема пространства интерфейса.) Возможно, потребуется выполнить дополнительное программирование и тестирование, чтобы содержимое визуального слоя изменялось с помощью пользовательского интерфейса узла и не заслоняло другое содержимое.
  • Содержимое, размещенное в классическом приложении, не изменяет размер или масштабируется автоматически для DPI. Дополнительные шаги, возможно, потребуются, чтобы ваше содержимое корректно реагировало на изменения DPI. (Дополнительные сведения см. в руководствах по конкретной платформе.)

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

Справочник по API

  • Last updated on