Search code examples
botframeworkmicrosoft-teams

Configure the width of fact-set items in ms teams bot response


I am using factset in bot response to show columns as shown in the screenshot below... enter image description here

When the value of a fact increases a certain length, the first column adjusts itself making the "updated" go into the next line.. enter image description here

Is there any way to avoid this? I want the "Last update" in all cases to be in the same line...


Solution

  • There isn't any property associated with FactSet or Fact to handle width.

    What you can try is to make your AdaptiveCard : Full width this might solve your problem (not 100% but if text contains in full width).

    You can also try using ColumnSet as Column has a width properties.

    I tried your scenario using Columns and it is rendering fine. Have look at my AdaptiveCard JSON and its output below.

    {
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "version": "1.2",
        "type": "AdaptiveCard",
        "body": [
            {
                "type": "Container",
                "items": [
                    {
                        "type": "ColumnSet",
                        "columns": [
                            {
                                "type": "Column",
                                "width": "100px",
                                "items": [
                                    {
                                        "type": "TextBlock",
                                        "text": "Author",
                                        "wrap": true,
                                        "weight": "Bolder"
                                    },
                                    {
                                        "type": "TextBlock",
                                        "text": "Last Updated",
                                        "wrap": true,
                                        "weight": "Bolder"
                                    },
                                    {
                                        "type": "TextBlock",
                                        "text": "Tickers",
                                        "wrap": true,
                                        "weight": "Bolder"
                                    },
                                    {
                                        "type": "TextBlock",
                                        "text": "Tags",
                                        "wrap": true,
                                        "weight": "Bolder"
                                    }
                                ]
                            },
                            {
                                "type": "Column",
                                "items": [
                                    {
                                        "type": "TextBlock",
                                        "text": "Matt Hidinger"
                                    },
                                    {
                                        "type": "TextBlock",
                                        "text": "Created {{DATE(2017-02-14T06:08:39Z, SHORT)}}",
                                        "wrap": true
                                    },
                                    {
                                        "type": "TextBlock",
                                        "text": "#5 Some VALUE"
                                    },
                                    {
                                        "type": "TextBlock",
                                        "text": "#someTags  #someTags#someTags#someTags#so someTags#someTags #someTags#someTags#someTags#someTags #someTags#someTags #someTags #someTags #someTags #someTags #someTags #someTags",
                                        "wrap": true
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ]
    }
    

    Result look like this:

    enter image description here