node.js - 如何在 Google Chat API 中添加带有复选框的选项

Question

我正在使用 Google Chat API 发送每日更新。我想要一个这样的用户界面：

像这样，我希望 UI 应该出现， https://developers.google.com/hangouts/chat/reference/message-formats/cards 我指的是这张表来生成这些 UI。

Answer 1

复选框不是可用的卡片消息。您可以在卡片消息中使用按钮小部件。但是您只能使用两种类型的按钮，即图像按钮或文本按钮。

纽扣

• 一个小部件可能包含一个或多个按钮。
• 同一小部件​​中的按钮将水平布局。
• 不同小部件中的按钮将垂直布局。
• 有两种类型的按钮：ImageButton 和 TextButton。
• 按钮可以指定当用户单击它时将打开的 URL，或者由机器人的CARD_CLICKED事件处理程序处理的操作，如创建交互式卡片中所示。

ImageButton 可以指定内置图标或自定义图像 URL。

您可以使用spaces.messages.create创建卡片消息。

示例消息请求正文：（卡片消息）

在此示例中，创建了 3 个小部件，每个小部件中有 1 个按钮，因此按钮将垂直对齐。

{
  "cards": [
    {
      "header": {
        "title": "ChatBot",
        "imageUrl": "https://www.gstatic.com/images/icons/material/system/1x/face_black_24dp.png",

      },
      "sections": [
        {
          "widgets": [
            {
              "buttons": [
                {
                  "textButton": {
                    "text": "I have a bike",
                    "onClick": {
                      "action": {
                        "actionMethodName": "optionClick",
                        "parameters": [
                          {
                            "key": "mode",
                            "value": "bike"
                          }
                        ]
                      }
                    }
                  }
                }
              ]
            },
            {
              "buttons": [
                {
                  "textButton": {
                    "text": "I have a car",
                    "onClick": {
                      "action": {
                        "actionMethodName": "optionClick",
                        "parameters": [
                          {
                            "key": "mode",
                            "value": "car"
                          }
                        ]
                      }
                    }
                  }
                }
              ]
            },
            {
              "buttons": [
                {
                  "textButton": {
                    "text": "I have a boat",
                    "onClick": {
                      "action": {
                        "actionMethodName": "optionClick",
                        "parameters": [
                          {
                            "key": "mode",
                            "value": "boat"
                          }
                        ]
                      }
                    }
                  }
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

输出：