Dialogflow CX中如何实现两个按钮水平并排排列？

你当前的richContent配置会让按钮垂直排列，要实现水平并排可以通过以下两种方式：

1. 利用内置buttonList组件（官方推荐） #

Dialogflow CX提供了buttonList组件，通过指定layout: "inline"参数，就能让组内按钮水平排列。修改后的配置如下：

{
  "richContent": [
    [
      {
        "type": "buttonList",
        "layout": "inline",
        "buttons": [
          {
            "text": "button1"
          },
          {
            "text": "button2"
          }
        ]
      }
    ]
  ]
}

这种方式适用于Dialogflow CX测试控制台、官方集成渠道（如Google Assistant），兼容性最好，无需额外样式开发。

2. 自定义前端样式（适用于自定义集成场景） #

如果是你自己开发前端对接Dialogflow CX API，可以通过CSS强制按钮水平排列。例如给按钮元素添加如下样式：

.dialogflow-button {
  display: inline-block;
  margin-right: 10px;
}

或者用flex布局包裹按钮容器：

.button-container {
  display: flex;
  gap: 10px;
}

这种方式需要你能控制前端渲染的代码结构和样式。

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