自适应卡片水平对齐 属性 到 "Center" 或 "Right" 在 iOS 移动应用程序的 MS Teams 中不起作用

Adaptive Card horizontal alignment property to "Center" or "Right" is not working in MS Teams on iOS mobile app

我们在以下自适应元素中遇到 "Horizontal alignment" 属性 问题:AdaptiveColumn、AdaptiveTextBlock 和 AdaptiveImage。将此 属性 设置为 "Center" 或 "Right" 会导致重大设计问题(见附图)。

原文:

"Right"对齐方式:

这里是 JSON:

{
  "type": "AdaptiveCard",
  "version": "1.2",
  "body": [
    {
      "type": "Container",
      "items": [
        {
          "type": "ColumnSet",
          "columns": [
            {
              "type": "Column",
              "width": 15,
              "items": []
            },
            {
              "type": "Column",
              "width": 15,
              "items": [
                {
                  "type": "Image",
                  "url": "https://cdn4.iconfinder.com/data/icons/arrows-9/100/arrow-9-512.png",
                  "width": "30px",
                  "height": "24px"
                }
              ],
              "verticalContentAlignment": "Center",
              "selectAction": {
                "type": "Action.Submit",
                "title": "Previous"
              },
              "horizontalAlignment": "Left"
            },
            {
              "type": "Column",
              "width": 40,
              "items": [
                {
                  "type": "Image",
                  "size": "Large",
                  "url": "https://aboutflowers.com/wp-content/uploads/2016/10/AboutFlowers_S600Alstroemera_SymphonyMorita_Esmeralda.jpg",
                  "horizontalAlignment": "Center"
                }
              ]
            },
            {
              "type": "Column",
              "width": 15,
              "items": [
                {
                  "type": "Image",
                  "url": "https://cdn4.iconfinder.com/data/icons/arrows-9/100/arrow-10-512.png",
                  "width": "30px",
                  "horizontalAlignment": "Right",
                  "height": "24px"
                }
              ],
              "verticalContentAlignment": "Center",
              "selectAction": {
                "type": "Action.Submit",
                "title": "Next"
              }
            },
            {
              "type": "Column",
              "width": 15,
              "items": []
            }
          ]
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "Image1",
      "horizontalAlignment": "Center"
    }
  ],
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}

相同的设计在 Android 和桌面客户端上正常工作。

Stack Overflow 不适用于错误报告。您可以通过 Teams 应用本身提交反馈,也可以查看此反馈页面:https://docs.microsoft.com/en-us/microsoftteams/platform/feedback

如果您确实提交了反馈,请随时 link 到此 Stack Overflow post 以提供必要的信息。

在错误修复之前,您需要找到某种解决方法。或许你可以尝试 "center" 对齐而不是左右对齐。如果这不起作用,那么您可能不得不不使用任何对齐方式。您可能有兴趣知道架构提到使用 height 属性 时图像失真的可能性,因此您也可以尝试省略宽度和高度规范:https://adaptivecards.io/explorer/Image.html