Share via

Visualizador de cartão adaptável da Microsoft

  • Artigo

Observação

O Visualizador de Cartão Adaptável está disponível na versão prévia do desenvolvedor público.

O Visualizador de Cartões Adaptáveis da Microsoft permite visualizar Cartões Adaptáveis ao refinar os designs. Ele funciona com o Teams Toolkit, permite visualizar Cartões Adaptáveis criados para bot do Teams e extensão de mensagem. Você pode abrir uma visualização lado a lado para observar alterações ao vivo e alternar entre temas diferentes.

A captura de tela mostra a Visual Studio Code de extensão do Visualizador de Cartão Adaptável.

Explorar o Visualizador de Cartões Adaptáveis

O Adaptive Card Previewer fornece soluções mais rápidas e confiáveis para visualizar designs de Cartão Adaptável. O Visualizador de Cartão Adaptável dá suporte aos seguintes recursos:

  • Integração do Kit de Ferramentas do Teams: habilita a instalação do JIT (Just-in-Time) do Adaptador de Cartão Adaptável ao atualizar cartões adaptáveis gerados de um projeto do Teams Toolkit.

    A captura de tela mostra uma visualização de exemplo de um Cartão Adaptável ao atualizar um Cartão Adaptável.

  • Visualização instantânea: permite visualizar Cartões Adaptáveis no editor de Visual Studio Code por meio do CodeLens ou da Paleta de Comandos.

    Você pode selecionar a sugestão de Cartão Adaptável de Visualização no arquivo de modelo cartão adaptável para visualizar o Cartão Adaptável no painel direito.

    O gráfico mostra como a visualização é exibida na extensão de visualização do Cartão Adaptável em Visual Studio Code.

  • Separação de dados: permite separar dados do layout em um idioma de modelo de Cartão Adaptável. Use o comando Adaptive Card: New Data File para adicionar um arquivo de dados para um modelo, que gera um arquivo vazio em que você pode associar dados ao modelo de Cartão Adaptável.

  • Configuração de tema padrão: permite que você defina um tema padrão por meio das configurações de extensão Visual Studio Code Visualizador de Cartão Adaptável: Tema Padrão.

    A captura de tela mostra como configurar o tema padrão por meio Visual Studio Code configurações de extensão.

  • Alternar temas: permite alternar entre temas claros, escuros e de alto contraste para visualizar seus Cartões Adaptáveis.

    O gráfico mostra a visualização de Cartão Adaptável em temas claros, escuros e de alto contraste.

Vantagens

O Visualizador de Cartão Adaptável oferece os seguintes benefícios:

  • Atualizações rápidas: permite visualizar designs de Cartão Adaptável em seu ambiente de desenvolvimento integrado, elimina a necessidade de alternar entre ferramentas constantemente. Você pode criar um bot ou uma extensão de mensagens com o Teams Toolkit, abrir o arquivo de metadados do Cartão Adaptável e usar o CodeLens ou um comando específico para visualizar o cartão. Qualquer atualização ou alterações no cartão são refletidas instantaneamente por meio do recurso Recarga Dinâmica na versão prévia.

  • Visualizações confiáveis: usa a mesma pilha de renderização que o Teams e o Outlook para garantir que os resultados de visualização precisos e consistentes estejam alinhados com o cartão renderização real.

Limitações

O Visualizador de Cartão Adaptável não dá suporte aos seguintes recursos do Cartão Adaptável:

Perguntas frequentes

Por que temos que usar uma nova extensão no Visual Studio Code? Essa extensão não pode ser integrada ao Teams Toolkit para Visual Studio Code?

O Adaptive Card Previewer é uma extensão autônoma porque usa um pacote de origem fechada para renderizar os Cartões Adaptáveis para garantir uma lógica de renderização consistente com a plataforma teams. O Teams Toolkit é um projeto de código aberto e não inclui dependências em pacotes que os desenvolvedores de terceiros não podem acessar.
 

Essa extensão dá suporte a todos os recursos do Cartão Adaptável na plataforma do Teams?

Não. Há várias limitações que a extensão Adaptive Card Previewer não dá suporte.
 

Confira também

Projetar os Cartões Adaptáveis