Yudner
Yudner

Reputation: 623

Waiting method in Bot Framework v4

In version 3 of the Bot Framework, I could call a card and wait for the user's response:

context.Call(new MyHeroCardOptions(), MyResumeAfter);

Can someone guide me how to do that in the Bot Framework V4. Please do not include "ChoicePrompt", my goal is to do with a HeroCard since it is an Attachment.

I am using this form:

private static async Task<DialogTurnResult> TransportStepAsync(WaterfallStepContext stepContext, CancellationToken cancellationToken)
        {
            await OptionHeroCard.GetHeroCard(stepContext.Context);
            return await stepContext.PromptAsync(nameof(TextPrompt), new PromptOptions());
        }

public static class OptionHeroCard
    {
        public static async Task GetHeroCard(ITurnContext context)
        {
            var heroCard = new HeroCard
            {
                Title = "Documentation",
                Subtitle = "Microsoft Bot Framework Documentation",
                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, title: "Opción 1", value: "Opción 1"),
                    new CardAction(ActionTypes.ImBack, title: "Opción 2", value: "Opción 2"),
                    new CardAction(ActionTypes.OpenUrl, "Ir a a web", value: "https://learn.microsoft.com/bot-framework"),
                },
            };
            var reply = context.Activity.CreateReply();
            reply.AttachmentLayout = AttachmentLayoutTypes.Carousel;
            reply.Attachments.Add(heroCard.ToAttachment());
            await context.SendActivityAsync(reply);
        }
    }

I currently use a "TextPrompt" with a "Waterfall" to generate a wait, but I don't know if it's appropriate.

  1. I didn't know that I can include HeroCard in a "choice prompts". An example would be great.

Upvotes: 1

Views: 458

Answers (2)

Kyle Delaney
Kyle Delaney

Reputation: 12264

If you just want your choices to be turned into a hero card automatically, you can use ListStyle.HeroCard:

new ChoicePrompt(nameof(ChoicePrompt)) { Style = ListStyle.HeroCard }

If you want to use your own custom hero card, you can do something like this:

private static async Task<DialogTurnResult> TransportStepAsync(WaterfallStepContext stepContext, CancellationToken cancellationToken)
{
    string[] options = new[] { "Opción 1", "Opción 2" };
    return await stepContext.PromptAsync(nameof(ChoicePrompt), new PromptOptions
    {
        Choices = ChoiceFactory.ToChoices(options),
        Prompt = CreateHeroCardActivity(options),
        Style = ListStyle.None, // We're displaying the choices ourselves so we don't want ChoicePrompt to do it for us
    });
}

private static Activity CreateHeroCardActivity(IEnumerable<string> options)
{
    var heroCard = new HeroCard
    {
        Title = "Documentation",
        Subtitle = "Microsoft Bot Framework Documentation",
        Images = new List<CardImage>
        {
            new CardImage("https://sec.ch9.ms/ch9/7ff5/e07cfef0-aa3b-40bb-9baa-7c9ef8ff7ff5/buildreactionbotframework_960.jpg"),
        },
        Buttons = options.Select(option => new CardAction(ActionTypes.ImBack, title: option, value: option))
            .Append(new CardAction(ActionTypes.OpenUrl, "Ir a a web", value: "https://learn.microsoft.com/bot-framework"))
            .ToList(),
    };

    return MessageFactory.Attachment(heroCard.ToAttachment()) as Activity;
}

Upvotes: 2

Giang Nguyen
Giang Nguyen

Reputation: 151

For bot framework 4.7 preview, I've done it by calling 2 actions

 new SendActivity("@{YourHeroCardTemplate()}"),
 new TextInput()
        {
                Property = "dialog.heroCardResponse",
                Prompt = new ActivityTemplate("Please select an option"),
        },

Hope it can help you the idea for other version of bot framework

Upvotes: 2

Related Questions