如何使用 C# 添加通过卡片内的提示选项显示的自定义选项并在 BOT V4 中使用 C# 在选择单击时触发操作？

Posted 2023-03-13

【中文标题】如何使用 C# 添加通过卡片内的提示选项显示的自定义选项并在 BOT V4 中使用 C# 在选择单击时触发操作？

【英文标题】：How to add custom choices displayed through Prompt options inside Cards & trigger actions on choice click in BOT V4 using c#?

【发布时间】：2019-10-10 08:25:22

【问题描述】：

我正在使用带有多个瀑布类型对话框的 c# bot framework v4 sdk 开发一个聊天机器人，其中一个对话框类将通过提示选项显示一组选项按钮。

现在，我想知道提示选项中的这些选项或提示选项中的这些选项是否一起显示在一张卡片中，无论是英雄卡片还是丰富卡片，在机器人框架 v4 中使用 c# 和瀑布对话框。 这样，如果我在显示的卡片中选择一个选择按钮，则应在下一步中触发相应的选项。

通常，在正常情况下，我们会在下一步中做出响应，然后根据需要继续操作，但我想知道是否有一种方法可以在卡片中显示这些选择按钮，以便在单击时我可以执行下一步的相应行动？

或者这不能完成并且期望是错误的？

如果有办法，由于我是编码和机器人新手，您能否提供详细的分步指南来说明如何实现它？

可能是我的问题没有详细说明，所以为了解释我的查询，让我用一个瀑布对话框 1 的例子来解释一下：

我已经知道的：

第 1 步：使用提示选项显示自定义选择选项

第 2 步：基于第 1 步中单击的选择，通过导航到另一个对话框或根据需要执行此第 2 步本身中的功能来执行相关过程

我想实现或知道如何实现

第 1 步：将之前显示的自定义选项选项并排显示为单独的按钮，而不是以 HERO CARD 或 RICH Card 或任何其他卡片的形式显示。

第 2 步：按照我们在上面第 2 步中的说明，正常接受单击的选择。

请注意，这些自定义选项有时是动态的，因此我无法通过使用固定选项设计卡片来对其进行硬编码以显示它。我可以在正常提示选项中动态获得选择，但我不知道如何将它们放入 HERO CARDS 等卡片中，但仍可用作正常选择选项。

如果有办法，请提供详细的分步指南，因为我是代码和机器人的新手。还是这是一个错误的期望，无法做到？

如果我的查询仍然含糊不清或无法理解，请告诉我。

感谢和问候 柴坦阳

【问题讨论】：

我想我明白你想知道什么。 this diagram 看起来像你想要的吗？

嗨，马特，不完全一样。就像我知道如果单击任何选择选项按钮并执行相应的选项相关过程时如何导航到瀑布中的下一步，实际上我想要询问或实现的是有一种方法可以显示通过提示选项显示的这些选择按钮在丰富的卡片或英雄卡片或任何其他卡片中，仍然可以作为正常选择选项按钮单击，即导航到下一步以继续相应的过程。这可能吗？如果是，那么如何实现它请提供分步详细指南，因为我是 BOT 和代码的新手。

好吧，我相信 Hero 和 Rich 卡正在被替换以支持使用 Adaptive Cards。 This question 似乎与您想要的相似，并展示了使用具有动态值的自适应卡片。它看起来也像一个新的 AdaptiveCard 提示符是in the works。希望这会有所帮助。

自适应卡目前仅在 Microsoft 渠道中支持，因此英雄卡对第三方渠道仍然有用

嗨凯尔，如果我的理解是正确的从上面的解释。可以肯定地说 WebChannel 目前不支持自适应卡片吗？还是我的理解有误？

【参考方案1】：

这绝对可以做到。我很确定我明白你在找什么。如果没有，请告诉我，我将编辑此答案。

制作英雄卡片

重要的部分是确保：

卡片有一个按钮 按钮有一个CardAction 和一个ImBack 操作类型和适当的value

var heroCard1 = new HeroCard

    Title = "Option1",
    Subtitle = "subtitle",
    Text = "Some text",
    Images = new List<CardImage>  new CardImage("https://sec.ch9.ms/ch9/7ff5/e07cfef0-aa3b-40bb-9baa-7c9ef8ff7ff5/buildreactionbotframework_960.jpg") ,
    Buttons = new List<CardAction>  new CardAction(ActionTypes.ImBack, "Option1", value: "Option1") ,
;
var heroCard2 = new HeroCard

    Title = "Option2",
    Subtitle = "subtitle",
    Text = "Some text",
    Images = new List<CardImage>  new CardImage("https://sec.ch9.ms/ch9/7ff5/e07cfef0-aa3b-40bb-9baa-7c9ef8ff7ff5/buildreactionbotframework_960.jpg") ,
    Buttons = new List<CardAction>  new CardAction(ActionTypes.ImBack, "Option2", value: "Option2") ,
;
var heroCard3 = new HeroCard

    Title = "Option3",
    Subtitle = "subtitle",
    Text = "Some text",
    Images = new List<CardImage>  new CardImage("https://sec.ch9.ms/ch9/7ff5/e07cfef0-aa3b-40bb-9baa-7c9ef8ff7ff5/buildreactionbotframework_960.jpg") ,
    Buttons = new List<CardAction>  new CardAction(ActionTypes.ImBack, "Option3", value: "Option3") ,
;

将英雄卡片添加到消息中

var reply = stepContext.Context.Activity.CreateReply();
reply.AttachmentLayout = AttachmentLayoutTypes.Carousel;
reply.Attachments.Add(heroCard1.ToAttachment());
reply.Attachments.Add(heroCard2.ToAttachment());
reply.Attachments.Add(heroCard3.ToAttachment());

发送消息，后跟空白文本提示

默认情况下，任何类型的卡片都不等待用户输入。空白文本提示用于强制等待并捕获用户的输入，并将其发送到下一步。

await stepContext.Context.SendActivityAsync(reply);
return await stepContext.PromptAsync(nameof(TextPrompt), new PromptOptions()  Prompt = MessageFactory.Text("") );

结果

注意事项

我建议为此使用英雄卡，因为：

您可以随意对英雄卡进行动态编程 如果您使用自适应卡，捕获输入会有点棘手 如果输入只是按钮，自适应卡就大材小用了 正如@KyleDelaney 所述，并非所有频道都支持自适应卡片

每张卡可以有任意数量的按钮，它仍然可以工作。 Result 链接到 CardAction.value

---

根据@MattStannett

如果你想传递一个复杂的对象而不是一个简单的字符串，这可以通过使用PostBack 操作和JsonConvert.SerializeObject 将对象转换为字符串来实现。使用PostBack意味着消息不会显示在聊天中，可以从Result对象中获取结果然后使用JsonConvert.DeserializeObject<>读出

【讨论】：

感谢 Richardson 的输入，但从您的示例中我了解到，对于一个按钮，使用一张卡，所以如果我有 2 个或更多选择提示选项，那么我必须使用 2 张或更多卡，这意味着一张卡对于每个选择选项。我的理解是否正确，或者我们可以执行以下操作： Buttons = new List new CardAction(ActionTypes.ImBack, "Option1", value: "Option1","Option2", value: "Option2" 等等第四），

要在一张卡片中显示多个按钮，您必须在 List<CardAction> 集合中添加多个 CardActions，例如Buttons = new List<CardAction> new CardAction(ActionTypes.ImBack, "Option1", value: "Option1"), new CardAction(ActionTypes.ImBack, "Option2", value: "Option2"), new CardAction(ActionTypes.ImBack, "Option3", value: "Option3")

所以另一个小问题：根据我对 Richardson 和 Kyle 描述的上述几点的理解，可以肯定地说 WebChannel 目前不支持自适应卡片吗？还是我的理解有误？

您好 Richardson，是的，您是正确的，它是网络聊天频道。问题是我可以使用自适应卡在 BOT 中通过按钮显示日期和时间输入，并且在网络聊天频道中也显示相同的内容，但是当我单击按钮时，未检索到值我使用下面的链接来检索值瀑布对话框中的下一步，该对话框在模拟器中可以正常工作，但在实际的 Webchat 频道中无法正常工作，当我在浏览器中单击 F12 看到内容时，它会引发以下错误：请帮助我，并详细一步一步的方式为我是代码和 BOT 新手。

感谢@mdrichardson 的详细回答！我想知道您是否愿意编辑您的答案，以便在用户想要通过复杂对象而不是简单字符串的情况下在底部添加一个附加部分。这可以通过使用PostBack 操作和JsonConvert.SerializeObject 将对象转换为字符串来实现。使用PostBack 意味着消息不会显示在聊天中（在我的情况下很好），可以根据您的屏幕截图从Result 对象中检索结果，然后使用JsonConvert.DeserializeObject<> 读出。谢谢！ :-)