Отрисовка карточек внутри приложения

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

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

Пакеты SDK для адаптивных карточек

Платформа Установка Строить Документация Состояние
JavaScript установка npm Источник документы Состояние сборки
.NET WPF Установка Nuget Источник документы Состояние сборки
HTML-код .NET Установка Nuget Источник документы Состояние сборки
Windows UWP Установка Nuget Источник документы Состояние сборки
WinUI 3 Установка Nuget Источник документы Состояние сборки
Андроид Maven Central Источник документы Состояние сборки
iOS CocoaPods Источник документы Состояние сборки

Создание экземпляра рендерера

Следующим шагом является создание экземпляра AdaptiveCardRendererобъекта.

Подключение событий действия

По умолчанию действия будут отображаться как кнопки на карточке, но приложение должно сделать их поведение таким, как ожидается. Каждый пакет SDK имеет эквивалент OnAction события, которое необходимо обрабатывать.

  • Action.OpenUrl — откройте указанный urlобъект.
  • Action.Submit — возьмите результат отправки и отправьте его источнику. Как вы отправляете это к источнику карты — зависит только от вас.
  • Action.ShowCard — вызывает диалоговое окно и отображает подкарту в этом диалоговом окне. Обратите внимание, что это необходимо обрабатывать только в том случае, если ShowCardActionMode задано значение popup.

Отобразить карточку

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

Настройка

Существует несколько способов настройки того, что выводится на экран.

Конфигурация хоста

HostConfig — это общий кроссплатформенный объект конфигурации, который управляет основным стилем и поведением карточек в приложении. Он определяет такие вещи, как размеры шрифта, интервал между элементами, цветами, число поддерживаемых действий и т. д.

Нативная стилизация платформы

Большинство фреймворков пользовательского интерфейса позволяют стилизовать отображаемую карточку с помощью стилей родного интерфейса. Например, в HTML можно указать CSS-классы для HTML-элементов, а в XAML можно передать пользовательский ResourceDictionary для тонкого управления выходными данными.

Настройка отрисовки для каждого элемента

Каждый пакет SDK позволяет переопределить отрисовку любого элемента или даже добавить поддержку совершенно новых элементов, которые вы определили. Например, вы можете изменить Input.Date рендерер, чтобы сгенерировать свой собственный элемент управления, сохраняя остальные выходные данные рендерера. Кроме того, можно добавить поддержку определяемого пользовательского Rating элемента.