SDKs de modelagem de cartão adaptável

Os SDKs de Modelagem de Cartão Adaptável facilitam o preenchimento de um modelo de cartão com dados reais em qualquer plataforma com suporte.

Leia isso para obter uma visão geral da Modelagem de Cartão Adaptável

Alterações significativas a partir de maio de 2020

1. A sintaxe de associação foi alterada de {...} para ${...}.
   • Por exemplo: "text": "Hello {name}" torna-se "text": "Hello ${name}"
2. A API JavaScript não contém mais um EvaluationContext objeto. Basta passar seus dados para a expand função. Consulte a página do SDK para obter detalhes completos.
3. A API do .NET foi reprojetada para corresponder mais de perto à API JavaScript. Por favor, veja abaixo para obter detalhes completos.

JavaScript

A biblioteca adaptivecards-templating está disponível no npm e via CDN. Consulte o link do pacote para obter a documentação completa.

npm

npm install adaptivecards-templating

CDN

<script src="https://unpkg.com/adaptivecards-templating/dist/adaptivecards-templating.min.js"></script>

Uso

O exemplo a seguir pressupõe que você também instalou a biblioteca de cartões adaptáveis para renderizar o cartão.

Se você não planeja renderizar o cartão, poderá remover o código parse e render.

import * as ACData from "adaptivecards-templating";
import * as AdaptiveCards from "adaptivecards";
 
// Define a template payload
var templatePayload = {
    "type": "AdaptiveCard",
    "version": "1.0",
    "body": [
        {
            "type": "TextBlock",
            "text": "Hello ${name}!"
        }
    ]
};
 
// Create a Template instance from the template payload
var template = new ACData.Template(templatePayload);
 
// Expand the template with your `$root` data object.
// This binds it to the data and produces the final Adaptive Card payload
var cardPayload = template.expand({
   $root: {
      name: "Matt Hidinger"
   }
});
 
// OPTIONAL: Render the card (requires that the adaptivecards library be loaded)
var adaptiveCard = new AdaptiveCards.AdaptiveCard();
adaptiveCard.parse(cardPayload);
document.getElementById('exampleDiv').appendChild(adaptiveCard.render());

.NET

dotnet add package AdaptiveCards.Templating

Uso

// Import the library 
using AdaptiveCards.Templating;

var templateJson = @"
{
    ""type"": ""AdaptiveCard"",
    ""version"": ""1.2"",
    ""body"": [
        {
            ""type"": ""TextBlock"",
            ""text"": ""Hello ${name}!""
        }
    ]
}";

// Create a Template instance from the template payload
AdaptiveCardTemplate template = new AdaptiveCardTemplate(templateJson);

// You can use any serializable object as your data
var myData = new
{
    Name = "Matt Hidinger"
};

// "Expand" the template - this generates the final Adaptive Card payload
string cardJson = template.Expand(myData);

Funções Personalizadas

Funções personalizadas podem ser adicionadas à Biblioteca de Expressões Adaptáveis, além das funções predefinidas.

No exemplo abaixo, a função personalizada stringFormat é adicionada e a funtion é usada para formatar uma cadeia de caracteres.

string jsonTemplate = @"{
    ""type"": ""AdaptiveCard"",
    ""version"": ""1.0"",
    ""body"": [{
        ""type"": ""TextBlock"",
        ""text"": ""${stringFormat(strings.myName, person.firstName, person.lastName)}""
    }]
}";

string jsonData = @"{
    ""strings"": {
        ""myName"": ""My name is {0} {1}""
    },
    ""person"": {
        ""firstName"": ""Andrew"",
        ""lastName"": ""Leader""
    }
}";

AdaptiveCardTemplate template = new AdaptiveCardTemplate(jsonTemplate);

var context = new EvaluationContext
{
    Root = jsonData
};

// a custom function is added
AdaptiveExpressions.Expression.Functions.Add("stringFormat", (args) =>
{
    string formattedString = "";

    // argument is packed in sequential order as defined in the template
    // For example, suppose we have "${stringFormat(strings.myName, person.firstName, person.lastName)}"
    // args will have following entries
    // args[0]: strings.myName
    // args[1]: person.firstName
    // args[2]: strings.lastName
    if (args[0] != null && args[1] != null && args[2] != null) 
    {
        string formatString = args[0];
        string[] stringArguments = {args[1], args[2] };
        formattedString = string.Format(formatString, stringArguments);
    }
    return formattedString;
});

string cardJson = template.Expand(context);

Resolução de problemas

Pergunta. Por que estou obtendo um AdaptiveTemplateException ao chamar expand()?
Um. Se sua mensagem de erro se parecer com '<item> ofensivo' na linha, '<número> de linha' está malformado para o par '$data: '".
Verifique se o valor fornecido para "$data" é json válido, como número, booliano, objeto e matriz, ou segue a sintaxe correta para a linguagem Modelo Adaptável, e a entrada existe no contexto de dados no número de linha.

Pergunta. Por que estou encontrando uma ArgumentNullException ao chamar expand()?
Um. Se sua mensagem de erro for semelhante a" Verifique se o contexto de dados pai está definido ou insira um valor não nulo para '<item> ofensivo' na linha, '<número> de linha'".
Indica que não existe contexto de dados para a associação de dados solicitada. Verifique se o contexto de dados raiz está definido, se existir, verifique se qualquer contexto de dados está disponível para a associação atual, conforme indicado pelo número de linha.

Pergunta. Por que a data/hora no formato RFC 3389, por exemplo, "2017-02-14T06:08:00Z" quando usada com o modelo não funciona com funções TIME/DATE?
Um. O sdk do .NET nuget versão 1.0.0-rc.0 exibe esse comportamento. esse comportamento é corrigido nas versões subsequentes. O comportamento padrão do desserializador do json.Net altera o formato de data e hora, e essa alteração está desabilitada para as versões subsequentes. Use a função formatDateTime() para formatar a cadeia de caracteres de data/hora para RFC 3389, como visto neste exemplo, ou você pode ignorar as funções TIME/DATE e apenas usar formatDateTime(). Para obter mais informações sobre formatDateTime(), acesse aqui.