如何创建独立Adaptive Card及带状态下拉与提交按钮的Teams卡片

1. 创建独立的Adaptive Card #

独立的Adaptive Card是符合官方规范的JSON结构，可直接编写或借助Adaptive Card Designer生成：

• 必须包含$schema、type、version三个核心字段
• 通过body定义卡片展示内容，actions可选添加交互按钮
• 基础示例代码：

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.5",
  "body": [
    {
      "type": "TextBlock",
      "text": "独立Adaptive Card示例",
      "size": "Large",
      "weight": "Bolder"
    },
    {
      "type": "TextBlock",
      "text": "这是一张无依赖的独立卡片"
    }
  ]
}

将这段JSON嵌入到Teams、Bot Framework等支持Adaptive Card的平台即可展示。

2. 创建带状态下拉框和提交按钮的Adaptive Card（支持提交后更新列表项） #

该功能需要分卡片前端定义和后端逻辑处理两部分实现：

卡片JSON结构 #

添加Input.ChoiceSet作为状态下拉框，搭配Action.Submit按钮，同时预留列表项的占位区域：

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.5",
  "body": [
    {
      "type": "TextBlock",
      "text": "任务状态更新",
      "size": "Large"
    },
    {
      "type": "Input.ChoiceSet",
      "id": "taskStatus",
      "label": "选择状态",
      "choices": [
        { "title": "待处理", "value": "pending" },
        { "title": "处理中", "value": "inProgress" },
        { "title": "已完成", "value": "completed" }
      ]
    },
    {
      "type": "Container",
      "id": "taskListContainer",
      "items": [
        {
          "type": "TextBlock",
          "text": "当前任务：编写文档 [待处理]",
          "id": "taskItem"
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "title": "提交",
      "data": {
        "action": "updateTaskStatus"
      }
    }
  ]
}

后端处理逻辑 #

1. 监听卡片提交事件，获取用户选中的taskStatus值
2. 根据选中值修改卡片中taskListContainer下的taskItem文本内容
3. 将更新后的卡片JSON重新推送给用户，或通过平台API直接更新原有卡片
   例如，用户选中“已完成”后，taskItem文本可更新为"当前任务：编写文档 [已完成]"。

3. Teams中创建无需等待响应的此类卡片 #

在Teams中可以实现无等待响应的卡片更新，核心方式如下：

• 使用Action.Submit提交数据后，后端直接处理状态更新逻辑，无需向用户发送临时响应消息
• 通过Teams Graph API或Bot Framework的UpdateActivityAsync方法，直接更新已发送到Teams中的原卡片
• 用户点击提交按钮后，只会看到原卡片内容即时更新，不会出现等待加载状态或额外提示消息。

内容的提问来源于stack exchange，提问作者Naveen Golla