次の方法で共有

カード

  • [アーティクル]

カードは、短い情報や関連する情報のユーザー インターフェイス (UI) コンテナーです。 カードには複数のプロパティと添付ファイルを含めることができます。また、ボタンを含めることができます。このボタンは、カードアクションをトリガーします。 カードを使用すると、情報をグループに整理し、ユーザーが情報の特定の部分を操作する機会を与えることができます。

Microsoft Teams用のボットでは、次の種類のカードがサポートされています。

  • アダプティブ カード
  • ヒーロー カード
  • リスト カード
  • Microsoft 365 グループ用コネクタ カード
  • レシート カード
  • サインイン カード
  • サムネイル カード
  • カード コレクション
  • アダプティブ カードのオーバーフロー メニュー

カードの種類に応じて、Markdown または HTML を使用して、カードにリッチ テキストの書式設定を追加できます。 Teams でボットとメッセージ拡張機能によって使用されるカードは、これらのカードアクション、openUrl、messageBack、imBack、invoke、signinを追加して応答します。

Teams では、次の 3 つの異なる場所でカードが使用されます。

  • コネクタ
  • ボット
  • メッセージ拡張機能

コネクタ内のカード

カードは最初に Outlook と Microsoft 365 の一部として定義され、Microsoft 365 グループのコネクタの一部として使用されるようになりました。 多くの Microsoft 365 アプリケーションと同様に、Teams ではコネクタがサポートされています。 詳細については、「Microsoft 365 グループ用コネクタの作成」を参照してください。 コネクタ内のカードの仕様は、アクション可能なメッセージ カードリファレンス にあります。

ボット内のカード

このMicrosoft Bot Framework、ボットがボット メッセージの一部として使用できる定義済みのカードのセットを追加することで、カードの仕様を拡張します。 Teams ではBot Frameworkを使用するボットがサポートされていますが、これらのカードの異なるセットがサポートされています。 Bot Framework のカードに関する一般的な情報については、「メッセージにリッチ カードの添付ファイルを追加」を参照してください。 これらのカードは、Teams では単純なカードと呼ばれます。

Teams のボットでは、単純なカード、コネクタ カード、またはアダプティブ カードを使用できます。 カードの種類は Teams のボットでサポートされているカードに関する情報を提供します。

メッセージ拡張機能のカード

メッセージ拡張機能は、 カードを返す場合もあります。 メッセージ拡張機能では、単純なカード、コネクタ カード、またはアダプティブ カードを使用できます。 これらのカードは、 カードの種類の中にあります。

カードの種類

Teams で使用されるすべてのカードは、 カードの種類に一覧表示されます。 このリファレンスでは、Teams のBot Framework カードとカードの違いについても説明します。

アダプティブ カード

アダプティブ カード は、ボット、Cortana、Outlook、Windows など、Microsoft 製品のカードの新しいクロス製品仕様です。 これらは、新しい Teams 開発に推奨されるカードの種類です。 アダプティブ カード チームからの一般的な情報については、「 アダプティブ カード概要」を参照してください。 アダプティブ カードは、既存のヒーロー カード、Microsoft 365 カード、サムネイル カードを使用する任意の場所で使用できます。

Teams では、アダプティブ カードに加えて、他の 2 種類のカードもサポートされています。

  • コネクタ カード: Microsoft 365 グループのコネクタの一部として使用されます。
  • シンプル カード: サムネイルカードやヒーロー カードなど、Bot Frameworkから使用されます。

アダプティブ カードでのユーザー ピッカー

ユーザー ピッカー 入力コントロールとして追加アダプティブ カード、ユーザーの検索と選択を有効にします。 チャット、チャネル、ダイアログ (TeamsJS v1.x のタスク モジュールと呼ばれます)、タブで使用できます。 モバイル クライアントとデスクトップ クライアントは、インライン入力エクスペリエンスを提供するユーザー ピッカーをサポートします。

アダプティブ カードのPeople アイコン

アダプティブ カードのPeopleアイコンは、ユーザーが Teams のアダプティブ カード内のユーザーの画像を表示するのに役立ちます。 1 人のユーザーまたは複数のユーザーの画像を表示できます。 People アイコンは、Teams モバイル クライアントとデスクトップ クライアントでサポートされています。

アダプティブ カードの先行入力検索

アダプティブ カードの入力コントロールとして追加された型検索では、動的に読み込まれたデータセットからの 動的検索 エクスペリエンスが有効になります。 また、ユーザーは、選択肢の数が限られたリスト内で型指定された静的検索を実行することもできます。 モバイル クライアントとデスクトップ クライアントは、typeahead 動的検索エクスペリエンスをサポートします。

アダプティブ カードの依存入力

入力の値が別の値に依存する Teams でアダプティブ カードを設計できます。 たとえば、2 つの Input.ChoiceSet ドロップダウンがあるアダプティブ カードを考えてみましょう。1 つは国を選択し、もう 1 つはその国内の特定の都市を選択する場合です。 最初のドロップダウンは、2 番目のドロップダウンに表示される都市をフィルター処理する必要があります。 これは、カード内の 1 つ以上の他の入力に依存する動的な型検索を使用してInput.ChoiceSetドロップダウンを作成することで実現できます。 詳細については、「 依存入力」を参照してください。

アダプティブ カードのメディア要素

アダプティブ カードのメディア要素は、強化されたメディア エクスペリエンスを提供し、アダプティブ カードとのエンゲージメントを高めます。 オーディオまたはビデオ クリップ、YouTube、Vimeo、Dailymotion ビデオなどのメディア ファイルをアダプティブ カードに追加できます。 詳細については、「 アダプティブ カードのメディア要素」を参照してください。

アダプティブ カードと受信 Webhook

注:

受信 Webhook でアダプティブ カードすると、アダプティブ カードの豊富で柔軟な機能を使用できます。 Teams の受信 Webhook を使用して、Web サービスからデータを送信します。

アダプティブ カードの CodeBlock

CodeBlock要素を使用して、Teams チャット、チャネル、会議で、リッチフォーマットのアダプティブ カードとしてコード スニペットを共有します。 CodeBlock要素を持つアダプティブ カードを使用すると、インデント、番号付け、構文の強調表示がプログラミング言語と一致するため、コード スニペットを読みやすくなります。 詳細については、「 アダプティブ カードの CodeBlock」を参照してください。

アダプティブ カードの応答性の高いレイアウト

アダプティブ カードは、チャット、チャネル、会議チャット全体で強化されたユーザー エクスペリエンスを提供するために、どのデバイスでも見栄えの良いカードを設計する必要があります。 アダプティブ カードの応答性の高いレイアウトを使用すると、異なるカード幅を対象とする異なるレイアウトのカードを設計できます。 詳細については、「 アダプティブ カードの応答性の高いレイアウト」を参照してください。

罫線と角の丸み

アダプティブ カードのContainer、ColumnSet、Column、Table要素に罫線を追加して、カードのさまざまなセクションを示すことができます。 アダプティブ カードのContainer、ColumnSet、Column、Table、Imageの各要素に角を丸めて追加すると、カードデザインをモダンで視覚的に魅力的に見せることができます。 詳細については、「 アダプティブ カードの罫線と角の丸み」を参照してください。

スクロール可能なコンテナー

要素が多いコンテナーは、読み取り不可能な長いカードにつながる可能性があります。 コンテナーの最大高さを定義するには、 maxHeight プロパティを使用します。 コンテナーの高さが最大で、そのコンテンツがその高さを超えると、垂直スクロール バーが表示されます。 詳細については、「 アダプティブ カードのスクロール可能なコンテナー」を参照してください。

複合ボタン

複合ボタンは、アイコン、タイトル、説明を含む特別な種類のボタンです。 [複合] ボタンは、 CompoundButton 要素を使用して追加できます。 この要素を使用すると、アダプティブ カード内の プロンプト スターター の外観をレプリケートできます。 詳細については、「 アダプティブ カードの複合ボタン」を参照してください。

Fluent アイコン

アダプティブ カードでは、Icon 要素を使用した Fluent アイコン ライブラリからのアイコンの追加がサポートされています。 詳細については、「 アダプティブ カードのアイコン」を参照してください。

星の評価

Input.Rating要素を使用して、アダプティブ カードにstarレーティング入力を追加できます。 Rating 要素を使用して、読み取り専用のstarレーティングを含めることもできます。 詳細については、 アダプティブ カードのレーティングに関するページを参照してください。

アクション ボタンの条件付き有効化

conditionallyEnabled プロパティを使用すると、ユーザーが必要な入力の少なくとも 1 つの値を変更するまでアクション ボタンを無効にすることができます。 このプロパティは、 Action.Submit アクションと Action.Execute アクションでのみ使用できます。 詳細については、「 アクション ボタンの条件付き有効化」を参照してください。

アダプティブ カードのオーバーフロー メニュー

Teams のアダプティブ カードでは、オーバーフロー メニューがサポートされています。 アダプティブ カード内のすべてのセカンダリ アクションのオーバーフロー メニューを設定できます。

ユーザー メンションでのMicrosoft Entra オブジェクト ID と UPN のサポート

アダプティブ カードを使用するボットでは、既存の ID に加えて、Microsoft Entra オブジェクト ID やユーザー プリンシパル名 (UPN) などのユーザー メンション ID がサポートされます。 受信 Webhook は、Microsoft Entra オブジェクト ID と UPN を使用してアダプティブ カードのユーザー メンションをサポートし始めます。

アダプティブ カードのグラフ

アダプティブ カードでは、グラフを通じてデータを視覚的に表すことができます。 パフォーマンス ダッシュボード、予算割り当て、プロジェクト管理、顧客分析情報などのグラフを使用できます。 詳細については、 アダプティブ カードのグラフに関するページを参照してください。

アダプティブ カードのコンテナー レイアウト

Layout.Stack、Layout.Flow、Layout.AreaGridレイアウトを使用して、さまざまなアダプティブ カード幅に対応する応答性の高いコンテナーを設計できます。 詳細については、「 コンテナー レイアウト」を参照してください。

次のステップ

カードの種類

関連項目