自适应卡输入切换(复选框)IOS问题

时间:2020-05-03 03:15:14

标签: microsoft-teams adaptive-cards

我们使用集成到Microsoft团队的Microsoft bot框架创建了bot。我们已经创建了一些自适应卡来与机器人进行互动对话。一张自适应卡导致了iPhone X Microsoft Teams Application中的设计问题。

我们使用了自适应卡模板来构建此卡,该模板显示任务列表以及任务状态。每个任务都有Input.Toggle(复选框),最后将显示一个按钮。选择复选框并单击按钮Sample Image Reference

我们正在发送带有任务详细信息的新卡,他们可以在其中编辑状态等。请在下面找到JSON数据。

卡有效载荷编辑器Json数据:

    {
    "type": "AdaptiveCard",
    "version": "1.0",
    "body": [
        {
            "type": "Container",
            "border": true,
            "items": [
                {
                    "$data": "{properties}",
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "width": "auto",
                            "items": [
                                {
                                    "id": "{id}",
                                    "type": "Input.Toggle",
                                    "title": " ",
                                    "value": "false",
                                    "wrap": false
                                }
                            ]
                        },
                        {
                            "type": "Column",
                            "width": "stretch",
                            "items": [
                                {
                                    "type": "Container",
                                    "items": [
                                        {
                                            "type": "FactSet",
                                            "facts": [
                                                {
                                                    "$data": "{peers}",
                                                    "title": "{key}",
                                                    "value": "{value}"
                                                }
                                            ]
                                        }
                                    ],
                                    "style": "emphasis"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ],
    "actions": [
        {
            "type": "Action.Submit",
            "title": "{actionSubmitTitle}",
            "horizontalAlignment": "center"
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
    }

样本数据编辑器:

   "properties":[
      {
         "id":"InputToggle1",
         "peers":[
            {
               "key":"Project",
               "value":"' .$task->project_name. '"
            },
            {
               "key":"Task",
               "value":"'.$task->id.' - '.$task->heading.'"
            },
            {
               "key":"Status",
               "value":"'.$task->board_column.'"
            }
         ]
      },
      {
         "id":"InputToggle2",
         "peers":[
            {
               "key":"Project",
               "value":"' .$task->project_name. '"
            },
            {
               "key":"Task",
               "value":"'.$task->id.' - '.$task->heading.'"
            },
            {
               "key":"Status",
               "value":"'.$task->board_column.'"
            }
         ]
      },
      {
         "id":"InputToggle3",
         "peers":[
            {
               "key":"Project",
               "value":"' .$task->project_name. '"
            },
            {
               "key":"Task",
               "value":"'.$task->id.' - '.$task->heading.'"
            },
            {
               "key":"Status",
               "value":"'.$task->board_column.'"
            }
         ]
      },
      {
         "id":"InputToggle4",
         "peers":[
            {
               "key":"Project",
               "value":"' .$task->project_name. '"
            },
            {
               "key":"Task",
               "value":"'.$task->id.' - '.$task->heading.'"
            },
            {
               "key":"Status",
               "value":"'.$task->board_column.'"
            }
         ]
      }
   ],
   "actionSubmitTitle":"Update Timesheet"
}

InputToggle位于设置为 width auto 的列内,它在Microsoft Desktop Android App 中完美呈现,而在{{ 3}}没有显示

当我们将 width 属性设置为 stretch 时,InputToggle将以IOS app的大尺寸显示,但以IOS App和{{3 }}该列正在推动并占用大量空间。

请帮助我,以便我们在IOS Microsoft Teams中显示Input.Toggle,而不会破坏Desktop和Android Teams App中的设计。

编辑:添加发送到漫游器的最终JSON。列集中的列将根据数据库中的询问列表进行动态更改。

{
   "type":"AdaptiveCard",
   "version":"1.0",
   "body":[
      {
         "type":"Container",
         "border":true,
         "items":[
            {
               "type":"ColumnSet",
               "columns":[
                  {
                     "type":"Column",
                     "width":"auto",
                     "items":[
                        {
                           "id":"inputToggle1",
                           "type":"Input.Toggle",
                           "title":" ",
                           "value":"false",
                           "wrap":false
                        }
                     ]
                  },
                  {
                     "type":"Column",
                     "width":"stretch",
                     "items":[
                        {
                           "type":"Container",
                           "items":[
                              {
                                 "type":"FactSet",
                                 "facts":[
                                    {
                                       "title":"Project",
                                       "value":"Project 1"
                                    },
                                    {
                                       "title":"Task",
                                       "value":"Task 1"
                                    },
                                    {
                                       "title":"Status",
                                       "value":"Pending"
                                    }
                                 ]
                              }
                           ],
                           "style":"emphasis"
                        }
                     ]
                  }
               ]
            },
            {
               "type":"ColumnSet",
               "columns":[
                  {
                     "type":"Column",
                     "width":"auto",
                     "items":[
                        {
                           "id":"inputToggle2",
                           "type":"Input.Toggle",
                           "title":" ",
                           "value":"false",
                           "wrap":false
                        }
                     ]
                  },
                  {
                     "type":"Column",
                     "width":"stretch",
                     "items":[
                        {
                           "type":"Container",
                           "items":[
                              {
                                 "type":"FactSet",
                                 "facts":[
                                    {
                                       "title":"Project",
                                       "value":"Project 1"
                                    },
                                    {
                                       "title":"Task",
                                       "value":" Task 2"
                                    },
                                    {
                                       "title":"Status",
                                       "value":"Completed"
                                    }
                                 ]
                              }
                           ],
                           "style":"emphasis"
                        }
                     ]
                  }
               ]
            }
         ]
      }
   ],
   "actions":[
      {
         "type":"Action.Submit",
         "title":"Update Timesheet",
         "horizontalAlignment":"center"
      }
   ],
   "$schema":"http://adaptivecards.io/schemas/adaptive-card.json"
}

谢谢。

1 个答案:

答案 0 :(得分:1)

为完成起见,这是由错误引起的,在此处被跟踪为Github问题:

https://github.com/microsoft/AdaptiveCards/issues/4052#