Renderizando cartões dentro do seu aplicativo

É fácil renderizar Adaptive Cards dentro do seu aplicativo. Fornecemos SDKs para todas as plataformas comuns, bem como fornecemos uma especificação detalhada para criar seu próprio renderizador de cartão adaptável.

1. Instale um SDK de renderizador - para sua plataforma de destino.
2. Crie uma instância de renderizador - configurada com os manipuladores de eventos de estilo, regras e ação do seu aplicativo.
3. Apresente um cartão na interface de utilizador nativa - automaticamente estilizado para a sua aplicação.

SDKs de cartões adaptáveis

Plataforma	Instalar	Construir	Documentos	Situação
JavaScript		Fonte	Documentos
.NET WPF		Fonte	Documentos	de status da compilação
HTML do .NET		Fonte	Documentos	de status da compilação
Windows UWP		Fonte	Documentos
WinUI 3		Fonte	Documentos
Android		Fonte	Documentos	de status da compilação
iOS		Fonte	Documentos	de status da compilação

Criar uma instância do renderizador

A próxima etapa é criar uma instância de AdaptiveCardRenderer.

Ligue eventos de ação

Por padrão, as ações serão renderizadas como botões no cartão, mas cabe ao seu aplicativo fazer com que elas se comportem como você espera. Cada SDK tem o equivalente a um OnAction evento que você deve manipular.

• Action.OpenUrl - abra o URL especificado url.
• Action.Submit - pegue o resultado do envio e envie-o para a fonte. A forma como o envia para a fonte do cartão depende inteiramente de si.
• Action.ShowCard - invoca uma caixa de diálogo e processa o sub-cartão nessa caixa de diálogo. Observe que você só precisa lidar com isso se ShowCardActionMode estiver definido como popup.

Renderizar um cartão

Depois de adquirir os dados do cartão, basta chamar o renderizador e passar o cartão. Você receberá de volta um objeto de interface do usuário nativo composto pelo conteúdo do cartão. Agora basta colocar essa interface do usuário em algum lugar em seu aplicativo.

Personalização

Há várias maneiras de personalizar o que é renderizado.

HostConfig

Um HostConfig é um objeto de configuração compartilhado e multiplataforma que controla o estilo e o comportamento básicos dos cartões dentro do seu aplicativo. Ele define coisas como tamanhos de fonte, espaçamento entre elementos, cores, número de ações suportadas, etc.

Estilo de plataforma nativo

A maioria das estruturas de interface do usuário permite que você estilize a placa renderizada usando o estilo nativo da estrutura da interface do usuário. Por exemplo, em HTML você pode especificar classes CSS para o HTML, ou em XAML você pode passar um ResourceDictionary personalizado para controle refinado da saída.

Personalizar a renderização por elemento

Cada SDK permite que você substitua a renderização de qualquer elemento ou até mesmo adicione suporte para elementos totalmente novos que você definir. Por exemplo, você pode alterar o Input.Date renderizador para emitir seu próprio controle personalizado enquanto ainda mantém o restante da saída do renderizador. Ou você pode adicionar suporte para um elemento personalizado Rating que você definir.