CODEWITHSUNDEEP
botframeworkmicrosoft-teams
Moblize IT
Moblize IT

Reputation: 1328

microsoft bot for teams to render a carousel of hero cards

I am having below code to render multiple hero cards

 const hcard = CardFactory.heroCard(
            'Neeti Sharma',
            'CEO, Moblize.it LLC',
            null,
            [
                {
                    type: ActionTypes.MessageBack,
                    title: 'Call',
                    value: null,
                    text: 'UpdateCardAction'
                },
                {
                    type: ActionTypes.MessageBack,
                    title: 'Email',
                    value: null,
                    text: 'email'
                }
            ]);
        await context.sendActivity({ attachments: [hcard, hcard] });

This renders one card after another. how do i convert it to a carousel?

Upvotes: 1

Views: 801

Answers (2)

Moblize IT
Moblize IT

Reputation: 1328

just for others benefit this is how i am doing it now

 const hcard = CardFactory.heroCard(
                card._firstName + ' ' + card._lastName,
                card._jobTitle + ', ' + card._dept,
                null,
                [
                    {
                        type: ActionTypes.MessageBack,
                        title: 'Call',
                        value: null,
                        text: 'UpdateCardAction'
                    },
                    {
                        type: ActionTypes.MessageBack,
                        title: 'Email',
                        value: null,
                        text: 'email'
                    }
                ]);

                cardArr.push(hcard)
         }

         console.log("all the cards are::::" + JSON.stringify(rspVal))
         const reply = {
             "attachments" : cardArr,
             "attachmentLayout" : AttachmentLayoutTypes.Carousel
         }

        await context.sendActivity(reply);

Upvotes: 2

Gousia Begum
Gousia Begum

Reputation: 2124

You need to get all the attachments, attach them to the reply you want to send and set the Attachment layout as Carousel. Here is how you could achieve this:

var reply=activity.CreateReply();

reply.attachment=GetAttachments();

reply.AttachmentLayout = AttachmentLayoutTypes.Carousel;

Upvotes: 2

Related Questions