Partager via


CardFactory class

Fournit des méthodes pour la mise en forme des différents types de cartes qu’un bot peut retourner.

Remarques

Toutes ces fonctions retournent un objet Attachment , qui peut être ajouté directement à la collection de pièces jointes d’une activité existante ou passé en tant qu’entrée à l’une des méthodes MessageFactory pour générer une nouvelle activité.

Cet exemple envoie un message qui contient une seule carte de héros.

const { MessageFactory, CardFactory } = require('botbuilder');

const card = CardFactory.heroCard(
     'White T-Shirt',
     ['https://example.com/whiteShirt.jpg'],
     ['buy']
);
const message = MessageFactory.attachment(card);
await context.sendActivity(message);

Propriétés

contentTypes

Répertorie le schéma de type de contenu pour chaque style de carte.

Méthodes

actions(string | CardAction[] | undefined)

Retourne un tableau d’actions correctement mis en forme.

adaptiveCard(any)

Retourne une pièce jointe pour une carte adaptative.

animationCard(string, string | MediaUrl[], string | CardAction[], Partial<AnimationCard>)

Retourne une pièce jointe pour une carte d’animation.

audioCard(string, string | MediaUrl[], string | CardAction[], Partial<AudioCard>)

Retourne une pièce jointe pour une carte audio.

heroCard(string, string | CardImage[], string | CardAction[], Partial<HeroCard>)

Retourne une pièce jointe pour une carte de héros.

heroCard(string, string, string | CardImage[], string | CardAction[], Partial<HeroCard>)

Retourne une pièce jointe pour une carte de héros.

images(string | CardImage[] | undefined)

Retourne un tableau d’images de carte correctement mis en forme.

media(string | MediaUrl[] | undefined)

Retourne un tableau correctement mis en forme d’objets d’URL multimédia.

o365ConnectorCard(O365ConnectorCard)

Retourne une pièce jointe pour une carte de connecteur Office 365.

oauthCard(string, string, string, string, TokenExchangeResource)

Retourne une pièce jointe pour une carte OAuth.

receiptCard(ReceiptCard)

Retourne une pièce jointe pour une carte de reçu.

signinCard(string, string, string)

Retourne une pièce jointe pour une carte de connexion.

thumbnailCard(string, string | CardImage[], string | CardAction[], Partial<ThumbnailCard>)

Retourne une pièce jointe pour une carte miniature.

thumbnailCard(string, string, string | CardImage[], string | CardAction[], Partial<ThumbnailCard>)

Retourne une pièce jointe pour une carte miniature.

videoCard(string, string | MediaUrl[], string | CardAction[], Partial<VideoCard>)

Retourne une pièce jointe pour une carte vidéo.

Détails de la propriété

contentTypes

Répertorie le schéma de type de contenu pour chaque style de carte.

static contentTypes: any

Valeur de propriété

any

Détails de la méthode

actions(string | CardAction[] | undefined)

Retourne un tableau d’actions correctement mis en forme.

static function actions(actions: string | CardAction[] | undefined): CardAction[]

Paramètres

actions

string | CardAction[] | undefined

Tableau d’action à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

Retours

CardAction[]

Tableau d’actions correctement mis en forme.

adaptiveCard(any)

Retourne une pièce jointe pour une carte adaptative.

static function adaptiveCard(card: any): Attachment

Paramètres

card

any

Description de la carte adaptative à retourner.

Retours

Attachment

Pièce jointe.

Remarques

Le format Cartes adaptatives est un format d’échange de cartes ouvert qui permet aux développeurs d’échanger du contenu d’interface utilisateur de manière commune et cohérente. Pour les canaux qui ne prennent pas encore en charge les cartes adaptatives en mode natif, Bot Framework effectue un rendu inférieur de la carte à une image dont le style est correct sur le canal cible. Pour les canaux qui prennent en charge les cartes héros , vous pouvez continuer à inclure des actions de carte adaptative et celles-ci seront envoyées sous forme de boutons avec la version rendue de la carte.

Pour plus d’informations sur les cartes adaptatives et pour télécharger le dernier kit sdk, consultez adaptivecards.io.

Par exemple :

const card = CardFactory.adaptiveCard({
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.0",
  "body": [
      {
         "type": "TextBlock",
         "text": "Default text input"
      }
  ],
  "actions": [
      {
         "type": "Action.Submit",
         "title": "OK"
      }
  ]
});

animationCard(string, string | MediaUrl[], string | CardAction[], Partial<AnimationCard>)

Retourne une pièce jointe pour une carte d’animation.

static function animationCard(title: string, media: string | MediaUrl[], buttons?: string | CardAction[], other?: Partial<AnimationCard>): Attachment

Paramètres

title

string

Titre de la carte.

media

string | MediaUrl[]

URL de média pour la carte.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<AnimationCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.

audioCard(string, string | MediaUrl[], string | CardAction[], Partial<AudioCard>)

Retourne une pièce jointe pour une carte audio.

static function audioCard(title: string, media: string | MediaUrl[], buttons?: string | CardAction[], other?: Partial<AudioCard>): Attachment

Paramètres

title

string

Titre de la carte.

media

string | MediaUrl[]

URL du média pour la carte.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<AudioCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.

heroCard(string, string | CardImage[], string | CardAction[], Partial<HeroCard>)

Retourne une pièce jointe pour une carte de héros.

static function heroCard(title: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<HeroCard>): Attachment

Paramètres

title

string

Titre de la carte.

images

string | CardImage[]

facultatif. Tableau d’images à inclure sur la carte. Chaque élément peut être un CardImage ou l’URL de l’image à inclure.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<HeroCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.

Remarques

Les cartes héros ont tendance à avoir une image dominante pleine largeur. Les canaux affichent généralement le texte et les boutons de la carte sous l’image.

Par exemple :

const card = CardFactory.heroCard(
     'White T-Shirt',
     ['https://example.com/whiteShirt.jpg'],
     ['buy']
);

heroCard(string, string, string | CardImage[], string | CardAction[], Partial<HeroCard>)

Retourne une pièce jointe pour une carte de héros.

static function heroCard(title: string, text: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<HeroCard>): Attachment

Paramètres

title

string

Titre de la carte.

text

string

Texte de carte.

images

string | CardImage[]

facultatif. Tableau d’images à inclure sur la carte. Chaque élément peut être un CardImage ou l’URL de l’image à inclure.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<HeroCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.

Remarques

Les cartes héros ont tendance à avoir une image dominante pleine largeur. Les canaux affichent généralement le texte et les boutons de la carte sous l’image. Par exemple :

const card = CardFactory.heroCard(
     'White T-Shirt',
     ['https://example.com/whiteShirt.jpg'],
     ['buy']
);

images(string | CardImage[] | undefined)

Retourne un tableau d’images de carte correctement mis en forme.

static function images(images: string | CardImage[] | undefined): CardImage[]

Paramètres

images

string | CardImage[] | undefined

Tableau d’images à inclure sur la carte. Chaque élément peut être un CardImage ou l’URL de l’image à inclure.

Retours

CardImage[]

Tableau d’images de carte correctement mis en forme.

media(string | MediaUrl[] | undefined)

Retourne un tableau correctement mis en forme d’objets d’URL multimédia.

static function media(links: string | MediaUrl[] | undefined): MediaUrl[]

Paramètres

links

string | MediaUrl[] | undefined

URL du média. Chacune d’elles string est convertie en objet d’URL multimédia.

Retours

MediaUrl[]

Tableau correctement mis en forme d’objets d’URL multimédia.

o365ConnectorCard(O365ConnectorCard)

Retourne une pièce jointe pour une carte de connecteur Office 365.

static function o365ConnectorCard(card: O365ConnectorCard): Attachment

Paramètres

card

O365ConnectorCard

description de la carte de connecteur Office 365 à retourner.

Retours

Attachment

Pièce jointe.

Remarques

Par exemple :

const card = CardFactory.o365ConnectorCard({
  "title": "card title",
  "text": "card text",
  "summary": "O365 card summary",
  "themeColor": "#E67A9E",
  "sections": [
      {
          "title": "**section title**",
          "text": "section text",
          "activityTitle": "activity title",
      }
  ]
});

oauthCard(string, string, string, string, TokenExchangeResource)

Retourne une pièce jointe pour une carte OAuth.

static function oauthCard(connectionName: string, title: string, text?: string, link?: string, tokenExchangeResource?: TokenExchangeResource): Attachment

Paramètres

connectionName

string

Nom de la connexion OAuth à utiliser.

title

string

Titre du bouton de connexion de la carte.

text

string

facultatif. Texte supplémentaire à inclure sur la carte.

link

string

facultatif. Lien de connexion à utiliser.

tokenExchangeResource

TokenExchangeResource

Optionnel. Ressource avec laquelle essayer d’effectuer un échange de jetons.

Retours

Attachment

Pièce jointe.

Remarques

Les cartes OAuth prennent en charge le service d’authentification unique (SSO) de Bot Framework.

receiptCard(ReceiptCard)

Retourne une pièce jointe pour une carte de reçu.

static function receiptCard(card: ReceiptCard): Attachment

Paramètres

card

ReceiptCard

Description de la carte de reçu à retourner.

Retours

Attachment

Pièce jointe.

signinCard(string, string, string)

Retourne une pièce jointe pour une carte de connexion.

static function signinCard(title: string, url: string, text?: string): Attachment

Paramètres

title

string

Titre du bouton de connexion de la carte.

url

string

URL de la page de connexion à utiliser.

text

string

facultatif. Texte supplémentaire à inclure sur la carte.

Retours

Attachment

Pièce jointe.

Remarques

Pour les canaux qui ne prennent pas en charge les cartes de connexion en mode natif, un autre message est affiché.

thumbnailCard(string, string | CardImage[], string | CardAction[], Partial<ThumbnailCard>)

Retourne une pièce jointe pour une carte miniature.

static function thumbnailCard(title: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<ThumbnailCard>): Attachment

Paramètres

title

string

Titre de la carte.

images

string | CardImage[]

facultatif. Tableau d’images à inclure sur la carte. Chaque élément peut être un CardImage ou l’URL de l’image à inclure.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<ThumbnailCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.

Remarques

Les cartes miniatures sont similaires aux cartes héros, mais au lieu d’une image pleine largeur, elles sont généralement rendues avec une version miniature plus petite de l’image. Les canaux restituent généralement le texte de la carte sur un côté de l’image, avec tous les boutons affichés sous la carte.

thumbnailCard(string, string, string | CardImage[], string | CardAction[], Partial<ThumbnailCard>)

Retourne une pièce jointe pour une carte miniature.

static function thumbnailCard(title: string, text: string, images?: string | CardImage[], buttons?: string | CardAction[], other?: Partial<ThumbnailCard>): Attachment

Paramètres

title

string

Titre de la carte.

text

string

Texte de carte.

images

string | CardImage[]

facultatif. Tableau d’images à inclure sur la carte. Chaque élément peut être un CardImage ou l’URL de l’image à inclure.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<ThumbnailCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.

Remarques

Les cartes miniatures sont similaires aux cartes héros, mais au lieu d’une image pleine largeur, elles sont généralement rendues avec une version miniature plus petite de l’image. Les canaux restituent généralement le texte de la carte sur un côté de l’image, avec tous les boutons affichés sous la carte.

videoCard(string, string | MediaUrl[], string | CardAction[], Partial<VideoCard>)

Retourne une pièce jointe pour une carte vidéo.

static function videoCard(title: string, media: string | MediaUrl[], buttons?: string | CardAction[], other?: Partial<VideoCard>): Attachment

Paramètres

title

string

Titre de la carte.

media

string | MediaUrl[]

URL de média pour la carte.

buttons

string | CardAction[]

facultatif. Tableau de boutons à inclure sur la carte. Chaque string élément du tableau est converti en bouton imBack avec un titre et une valeur définis sur la valeur de la chaîne.

other

Partial<VideoCard>

facultatif. Toutes les propriétés supplémentaires à inclure sur la carte.

Retours

Attachment

Pièce jointe.