自适应卡片中的轮播图

Question

请指导我在MS Bot框架中创建轮播自适应卡片。我正在使用.Net SDK。我尝试使用自适应卡片设计工具进行设计，但无法实现。

- Joel Abraham

---

除了已经给出的答案，我想让你明白，虽然自适应卡片本身旨在标准化，以便在每个平台上都能以相同的方式工作，但“附件旋转木马”是特定于通道的，并且与自适应卡片关系不大。 - Kyle Delaney

Answer 1

您的问题并不够具体，我无法理解您在哪方面遇到了问题，但我可以为您提供一个创建卡片轮播图的基本概述。我的代码是 nodejs，但它应该足够相似，可以让您有一个想法。

您需要 CardFactory 和 MessageFactory 来首先生成卡片，然后生成轮播图（它以卡片数组作为输入）。

// First create an empty array for your carousel
var cardArray = [];

// Populate the array with your cards (can use any method, I used a for loop)
for (var idx = 0; idx < dataForCards.length; idx++) {
   // Create the adaptive card
   var adaptiveCard = CardFactory.adaptiveCard({

   // YOUR CARD DEFINITION HERE

   });
   // Push the card to the array for the carousel
   cardArray.push(adaptiveCard);
}
// Send the array as a carousel
await step.context.sendActivity(MessageFactory.carousel(cardArray));

- billoverton

Answer 2

好的，Adaptive Card 设计师可以帮助您创建单个卡片的模板。在您的情况下，根据您的列表在循环中从创建的模板创建附件，并将生成的每个附件添加到 Activity.Attachments 中。

if(listOfReservationCardsData.Any())
        {
            foreach (var checkInStatusCardData in listOfReservationCardsData.OrderBy(l => Convert.ToDateTime(l.StartDate)))
            {
                listOfAttachments.Add(CreateAdaptiveCardAttachment(filePath, data));
            }
        }

        if (listOfAttachments.Any())
        {
            turnContext.Activity.AttachmentLayout = AttachmentLayoutTypes.Carousel;
            turnContext.Activity.Attachments = listOfAttachments.Take(5).ToList();
            await turnContext.SendActivityAsync(turnContext.Activity, cancellationToken);
        }


private static Attachment CreateAdaptiveCardAttachment(string filePath, object data)
    {
        var adaptiveCardJson = File.ReadAllText(filePath);
        // Create a Template instance from the template payload
        AdaptiveCardTemplate template = new AdaptiveCardTemplate(adaptiveCardJson);

        string cardJson = template.Expand(data);

        var adaptiveCardAttachment = new Attachment()
        {
            ContentType = "application/vnd.microsoft.card.adaptive",
            Content = JsonConvert.DeserializeObject(cardJson),
        };
        return adaptiveCardAttachment;
    }

- Naresh Podishetty

Answer 3

这可以是一个例子：

IEnumerable<AdaptiveCard> cards;    
await context.Context.SendActivityAsync((Activity)MessageFactory.Carousel(cards.Select(c => new Attachment
                    {
                        ContentType = AdaptiveCard.ContentType,
                        Content = c,
                    })));

- WueF

---

但是，“cards.Select”会抛出未分配变量的错误？ - Joel Abraham