How to use Adaptive Cards on Teams Messaging Extension?

问题

I'm developing a Teams Message Extension and I'm using ThumbnailCard to display my results, however I wanted to use a custom adaptive card. Is that possible?

var resultCardList = GetAttachments(title);

var response = new ComposeExtensionResponse(new ComposeExtensionResult("list", "result"));
      response.ComposeExtension.Attachments = resultCardList.ToList();
      return response;

foreach (var contract in contractItems)
        {
          var lastModified = (DateTime)contract["Modified"];
          var justificativa = contract["JustificativaContrato"];
          var card = new ThumbnailCard
          {
            Title = $"{contract.Client_Title} - {lastModified.ToShortDateString()} {lastModified.ToLongTimeString()}",
            Text = $"Justificativa: {justificativa}",
            Tap = new CardAction { Type = "openUrl", Value = $"{Tenant}{ContractList.DefaultEditFormUrl}?ID={contract.Id}" },
            Images = new List<CardImage> { new CardImage("http://lorempixel.com/640/480?rand=" + DateTime.Now.Ticks.ToString()) }
          };

          cardList.Add(card
              .ToAttachment()
              .ToComposeExtensionAttachment());
        }

        return cardList;

I've tried to use the below method to generate the Adaptive Card and just add it to the list:

private static Microsoft.Bot.Connector.Attachment CreateAdaptiveCardAttachment()
    {
      // combine path for cross platform support
      string[] paths = { ".", "Cards", "welcomeCard.json" };
      string fullPath = Path.Combine(paths);
      var adaptiveCard = System.IO.File.ReadAllText(@"Cards\welcomeCard.json");
      return new Microsoft.Bot.Connector.Attachment()
      {
        ContentType = "application/vnd.microsoft.card.adaptive",
        Content = JsonConvert.DeserializeObject(adaptiveCard),
      };
    }

回答1:

The messaging extension does not allow sending adaptive cards like that. It requires using the "MessagingExtensionResult" of the framework and just the card sent in the response. The documentation is a bit lacking here.

When you get a call from the messaging extension its action is of type "composeExtension/query"

Create the general "result" list like this:

var invokeResponse = new MessagingExtensionResponse();
var results = new MessagingExtensionResult
{
    AttachmentLayout = "list",
    Type = "result",
    Attachments = new List<MessagingExtensionAttachment>(),
};

For each result in the list you need to create a MessagingExtensionAttachment like this: (Note: Cards need to have a preview!)

results.Attachments.Add(new MessagingExtensionAttachment
{
    ContentType = "application/vnd.microsoft.teams.card.adaptive",
    Content = JsonConvert.DeserializeObject(cardData),
    Preview = new Attachment
    {
        ContentType = "application/vnd.microsoft.card.thumbnail",
        Content = new AttachmentContent
        {
            text = "Project: " + task.ProjectName,
            title = task.Name,
        },
    }
});

Finally send the result as "InvokeResponse"

            return new InvokeResponse
            {
                Body = invokeResponse,
                Status = 200,
            };

While "content" of the attachment is the full adaptive card. You can find an example for the response in json here: https://docs.microsoft.com/de-de/microsoftteams/platform/concepts/messaging-extensions/search-extensions#response-example

You can freely mix card types based on that, but i never got that working tho...as of now you need to limit to one specific card type as far as i know.

All above is if you're using Microsoft.Bot.Builder.Teams

Microsoft.Bot.Connector.Teams

Microsoft.Bot.Schema.Teams

in the latest versions.

来源：https://stackoverflow.com/questions/57116935/how-to-use-adaptive-cards-on-teams-messaging-extension

标签

microsoft-teams

adaptive-cards