创建第一个自适应卡

Power Automate 中的自适应卡可以共享信息块或针对给定数据源通过表单收集数据。

在任一情况下,您都需要概述将共享哪个数据集,和/或窗体需要收集哪些数据。

小费

使用简单的数据块,而不是复杂的表数组。

先决条件

Microsoft Teams 已安装 Workflows 应用。

添加操作

在此过程中将添加一个操作,用于使用流先前操作中的数据将信息发布到 Microsoft Teams 渠道。

  1. 登录到 Power Automate

  2. 选择顶部导航栏中的我的流

  3. 选择新建流>即时云端流

  4. 给流命名。

  5. 选择手动触发流作为触发器。

  6. 选择创建

  7. 在设计器中,选择新建步骤

  8. 搜索 Microsoft Teams,然后选择将自适应卡发布到 Teams 渠道并等待响应作为操作。

  9. 选择要将卡片发布到的团队渠道

  10. 将此 JSON 粘贴到消息框。

    {
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
            {
                "type": "TextBlock",
                "text": "Poll Request",
                "id": "Title",
                "spacing": "Medium",
                "horizontalAlignment": "Center",
                "size": "ExtraLarge",
                "weight": "Bolder",
                "color": "Accent"
            },
            {
                "type": "TextBlock",
                "text": "Header Tagline Text",
                "id": "acHeaderTagLine",
                "separator": true
            },
            {
                "type": "TextBlock",
                "text": "Poll Header",
                "weight": "Bolder",
                "size": "ExtraLarge",
                "spacing": "None",
                "id": "acHeader"
            },
            {
                "type": "TextBlock",
                "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vestibulum lorem eget neque sollicitudin, quis malesuada felis ultrices. ",
                "id": "acInstructions",
                "wrap": true
            },
            {
                "type": "TextBlock",
                "text": "Poll Question",
                "id": "acPollQuestion"
            },
            {
                "type": "Input.ChoiceSet",
                "placeholder": "Select from these choices",
                "choices": [
                    {
                        "title": "Choice 1",
                        "value": "Choice 1"
                    },
                    {
                        "title": "Choice 2",
                        "value": "Choice 2"
                    },
                    {
                        "title": "Choice 3",
                        "value": "Choice 3"
                    }
                ],
                "id": "acPollChoices",
                "style": "expanded"
            }
        ],
        "actions": [
            {
                "type": "Action.Submit",
                "title": "Submit",
                "id": "btnSubmit"
            }
        ]
    }
    
  11. 在 JSON 中进行以下替换。

    重要提示

    执行替换时,请勿删除任何引号。 可以根据需要修改汽车选择:

    要更改的文本 新文本
    Header Tagline Text Power Automate 投票
    Poll Header 首选车型
    Poll Question 请从此处列出的选项中为您首选的车型投票。
    将拉丁文本替换为与为什么进行投票相关的原因或商业背景。 我们将进行员工投票,以确定我们是否应提供适合最常见车型的个性化停车位。
    Choice 1(两个全部替换) Tesla
    Choice 2(两个全部替换) Lexus
    Choice 3(两个全部替换) Honda
  12. 选择新建步骤,然后搜索并选择一个可访问的发送电子邮件操作。

  13. 提供电子邮件收件人作为选择了即时按钮的人员(使用触发器动态内容中的电子邮件标记)。

  14. 按如下方式配置电子邮件的正文。 将大括号“{}”中的字词替换为动态标记:
    投票响应为 {acPollChoices}(acPollChoices 是来自响应操作等待的动态内容)。 它由 {User Name} 提交(User Name 是触发器的动态内容)

测试自适应卡

若要测试工作,请运行先前创建的流并确认以下事项:

  • 流运行不存在错误,等待响应,在运行屏幕上显示自适应卡操作的等待指示器。

  • Teams渠道已发布新的自适应卡。

  • 选择车型并选择自适应卡底部的提交按钮来响应此卡片时:

    • 自适应卡应未出现任何错误。

    • 流运行成功完成。

  • 如果已配置等待响应操作底部的更新消息区域,完成提交后,将关联卡替换(接下来显示相应的替换卡)。 否则,所有提交都只会重置窗体。

    替换卡。

  • 电子邮件通知包含说明谁提交了响应以及选择了哪个车型的正文。

恭喜! 您刚刚创建了第一个交互式自适应卡!

已完成的第一个卡片。

自适应卡故障排除提示

创建自适应卡时遇到的最常见问题包括:

  • 流运行错误通常由以下某个因素导致:

    在这种情况下,错误可能如下面的屏幕截图所示:

    错误消息。

    • JSON 格式不正确 – 通常这不会像人们预想的那样复杂。 最常见的情况包括:

      • JSON 内的值周围有弯引号或缺少引号。 请务必检查 JSON,确保所有文本值括在双引号中,并且数值括在引号中。 所有引号均应是直引号,而非弯引号。

      • 可以通过将 JSON 粘贴到卡负载编辑器验证 JSON 的格式。

    • 缺少图像 URL – 自适应卡中的所有图像值均必须引用有效的 URL。 自适应卡不直接支持完整的图像内容。 通过将 URL 粘贴到浏览器中查看是否显示图像来测试图像链接。

  • 自适应卡可能与预期不一样,具体取决于样式和架构限制:

    • 检查占位符值、文本样式和任意标记语言是否符合自适应卡架构要求(请参阅此处自适应卡架构最佳做法

    • 使用 Visual Studio Code 自适应卡验证程序。 打开“扩展市场”,搜索自适应卡查看器,以从 Visual Studio Code 应用程序来安装该查看器。

      Visual Studio Code 扩展。

Visual Studio Code 中安装的自适应卡查看器扩展的部分屏幕截图(快捷方式:Ctrl+V+A (启用后))。

  • 提交自适应卡后出现错误通常是因为:

    • 使用名称中未包含“等待响应”的操作

      请重试。

    • 尝试多次提交卡片。 每个自适应卡只能提交一次,提交后将忽略后续所有提交。