How to use thumbnail cards when defining dynamically values in FormBuilder

Question

My bot has the following FormBuilder:

public static IForm<BasicForm> BuildForm()
    {
        return new FormBuilder<BasicForm>()
            .Field(new FieldReflector<BasicForm>(nameof(Os))
                    .SetType(null)
                    .SetPrompt(new PromptAttribute("Please tell me the {&} {||}"))
                    .SetDefine(async (state, field) =>
                    {
                        List<string> list = new List<string> { "ANDROID" , "IOS" };
                        foreach (string item in list)
                        {
                            switch (item)
                            {
                                case "ANDROID":
                                    field
                                        .AddDescription(item, item, image: "<android-logo.jpg>")
                                        .AddTerms(item, item);
                                    break;
                                case "IOS":
                                    field
                                        .AddDescription(item, item, image: "<ios-logo.jpg>")
                                        .AddTerms(item, item);
                                    break;
                            }
                        }
                        return true;
                    }))
            .AddRemainingFields()
            .OnCompletion(async (context, state) =>
            {
                await context.PostAsync("Your request has been submitted. I am tracking your link. I will send you the result as soon as possible");
            })
            .Build();
    }

This code produce the following HeroCard

The problem is that HeroCard seems to stretch the image: the original size of images is 200x200. Is there any way to define Width and Height in HeroCard image from FormBuilder?

Otherwise is it possible to use ThumbnailCard instead of HeroCard?

Thanks.

score 1 · Answer 1 · answered Nov 24 '17 at 06:47

Is there any way to define Width and Height in HeroCard image from FormBuilder?

No, for now there is no method to fix the size in code behind. The size of image in card are scaled different for different channels. For more information, you may refer to this discussion: Image not get fit inside herocard,Thumbnail card..

Otherwise is it possible to use ThumbnailCard instead of HeroCard?

Yes, it is possible, you can refer to the official Rich Cards Bot Sample or Carousel of Cards Bot Sample. But there is default template for thumbnail card, the image will be shown in the top-right side of the card, I'm afraid it's not required in your scenario.

So I think what we can do for now is to use different size of image resource according to the aspect ratios for different channels.

How to use thumbnail cards when defining dynamically values in FormBuilder

1 Answers1