使用机器人框架 SDK 中的 RenderedAdaptiveCards 自定义自适应卡片外观

Question

我正在使用 Microsoft Bot Framework 开发 Bot。我正在使用自适应卡片向用户显示航班，但它们的外观有很多限制。我正在尝试通过使用我自己的 hostconfig.json 创建一个自适应卡片渲染器，然后将我的自适应卡片的 Html 附加回聊天 [=，从而从我的机器人框架中的一个对话框中渲染自适应卡片17=]。但它不起作用:(

    public static Attachment CreateFlight(Flight flight)
    {
        var renderedAdaptiveCard = AdaptiveCardRenderer
            .RenderCard(new AdaptiveCard
            {
                Body = new List<AdaptiveElement>
                {
                    new AdaptiveContainer {Items = CreateFlightAdaptiveElements(flight)}
                },
                Actions = new List<AdaptiveAction>
                {
                    new AdaptiveShowCardAction
                    {
                        Card = new AdaptiveCard
                        {
                            Body = new List<AdaptiveElement>
                            {   

                            },
                            Actions = new List<AdaptiveAction>
                            {
                                new AdaptiveSubmitAction
                                {
                                    Title = "Select",
                                    Data = flight.Segments.Select(x => $"{x.Airline} {x.FlightNo}")
                                        .Aggregate((i, j) => i + "/" + j),

                                }
                            },
                            BackgroundImage = new Uri($"{DomainUrl}/Images/ac_background.jpg")
                        },
                        Title = "Select"
                    },

                },
                BackgroundImage = new Uri($"{DomainUrl}/Images/ECEFF1.png")
            });

        var attachment = new Attachment
        {   
            ContentType = "application/html",
            Content = renderedAdaptiveCard.Html
        };

        return attachment;
    }

我是不是在尝试一些在这里不可能做的事情？如何更改我的机器人的默认灰色外观？我的主要渠道是 Skype、Slack 等，所以我没有计划将其集成到网络聊天中。请在这方面帮助我。

Answer 1

Adaptive Cards 背后的想法是允许每个通道以特定于该通道的方式呈现卡片。一张卡片 "adapts" 到任何可能支持它的环境。虽然自适应卡片提供了很大的灵活性，但机器人只能做这么多，因为它最终是负责渲染卡片的渠道。

Card Authors describe their content as a simple JSON object. That content can then be rendered natively inside a Host Application, automatically adapting to the look and feel of the Host.

For example, Contoso Bot can author an Adaptive Card through the Bot Framework, and when delivered to Skype, it will look and feel like a Skype card. When that same payload is sent to Microsoft Teams, it will look and feel like Microsoft Teams. As more host apps start to support Adaptive Cards, that same payload will automatically light up inside these applications, yet still feel entirely native to the app.

Users win because everything feels familiar. Host apps win because they control the user experience. And Card Authors win because their content gets broader reach without any additional work.

您可能知道，RenderedAdaptiveCard type is meant to be used in client-side code. That means it can help you if you want to make your own channel for example, but it's not really meant to be used in a bot. Your code isn't working because there is no HTML attachment type and most channels don't support HTML at all. You can find more information in this question and this GitHub issue。

希望您可以使用可用的工具（例如图像和链接）实现您正在寻找的外观。

使用机器人框架 SDK 中的 RenderedAdaptiveCards 自定义自适应卡片外观

Customizing Adaptive Card appearance using RenderedAdaptiveCards inside bot framework SDK

html-rendering

botframework

adaptive-cards