Search code examples
c#botframework

Selecting a specific image from CardImage List bot framework


I'm currently building a bot with the ability to build a dynamic carousel of hero cards, however I haven't found many examples that show to specify which image to use on which card.

public async Task Styles(IDialogContext context, LuisResult result)
        {
            InfoClass IC = new InfoClass();
            int count = IC.BuildArray().Length;
            PolaroidObject[] glasses = IC.BuildArray();
            int x = 0;
            var reply = context.MakeMessage();
            reply.AttachmentLayout = AttachmentLayoutTypes.Carousel;
            //Storing Images into variables
            List<CardImage> images = new List<CardImage>();
            CardImage Ci1 = new CardImage("https://polaroideyewear.com/content/dam/products/brands/pld/2017/04/2003960807lm/high-res/2003960807lm_p00.jpg/_jcr_content/renditions/cq5dam.web.1280.1280.jpeg");
            CardImage Ci2 = new CardImage("https://polaroideyewear.com/content/dam/products/brands/pld/2017/01/20035406lbuc/high-res/20035406lbuc_p00.jpg/_jcr_content/renditions/cq5dam.web.1280.1280.jpeg");
            CardImage Ci3 = new CardImage("https://polaroideyewear.com/en/sunglasses/pld/2017/PLD-4049-S.html");
            CardImage Ci4 = new CardImage("https://polaroideyewear.com/en/sunglasses/pld/2017/PLD-4050-S.html");
            CardImage Ci5 = new CardImage("https://polaroideyewear.com/content/dam/products/brands/pld/2017/04/2003940010ex/high-res/2003940010ex_p00.jpg/_jcr_content/renditions/cq5dam.web.1280.1280.jpeg");
            CardImage Ci6 = new CardImage("https://polaroideyewear.com/content/dam/products/brands/pld/2017/04/2003960807lm/high-res/2003960807lm_p00.jpg/_jcr_content/renditions/cq5dam.web.1280.1280.jpeg");
            CardImage Ci7 = new CardImage("https://polaroideyewear.com/content/dam/products/brands/pld/2017/04/2003960807lm/high-res/2003960807lm_p00.jpg/_jcr_content/renditions/cq5dam.web.1280.1280.jpeg");
            images.Add(Ci1);
            images.Add(Ci2);
            images.Add(Ci3);
            images.Add(Ci4);
            images.Add(Ci5);
            images.Add(Ci6);
            images.Add(Ci7);
            for (int z = 1; z <= count; z++)
            {
                HeroCard hc = new HeroCard()
                {
                    Title = glasses[x].Shape,
                    Images = images
                };
                reply.Attachments.Add(hc.ToAttachment());
                x++;
            }
            await context.PostAsync(reply);
            context.Wait(MessageReceived);
        }

This is my current way of doing it, this works however it only loads the first image in the list. I'm looking for a way to use something like you would an array where you could specify "Images = images[z]".

Also on a side note, I'm not sure about the best way to save these images, I have got a folder with the images and a get/set class. I was hoping to call them in the same way I'm doing the shape, however it complains and asks for a List<CardImage> rather than a string.


Solution

  • You need to attach one image to each card, rather than the whole list - something like this, assuming x is the index:

    HeroCard hc = new HeroCard()
    {
        Title = glasses[x].Shape,
        Images = new List<CardImage> { images[x] }
    };