Adaptive Card: How to create table with 6 columns without truncating text?

user_11844406 0
Viewed 1386

I have created a adaptive card to show as table. But, the text is getting truncated like Today I... instead of Today In Count complete text.

This Adaptive card is for Microsoft Teams.

Adaptive Card:

{
   "$schema":"http://adaptivecards.io/schemas/adaptive-card.json",
   "type":"AdaptiveCard",
   "version":"1.2",
   "body":[
      {
         "type":"ColumnSet",
         "columns":[
            {
               "type":"Column",
               "items":[
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"Zone",
                     "weight":"bolder"
                  },
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"EAST ZONE",
                     "separator":true
                  }
               ]
            },
            {
               "type":"Column",
               "items":[
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"Today In Counter",
                     "weight":"bolder"
                  },
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"168",
                     "separator":true
                  }
               ]
            },
            {
               "type":"Column",
               "items":[
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"Monthly Count (A)",
                     "weight":"bolder"
                  },
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"5884",
                     "separator":true
                  }
               ]
            },
            {
               "type":"Column",
               "items":[
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"Cancel (B)",
                     "weight":"bolder"
                  },
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"1",
                     "separator":true
                  }
               ]
            },
            {
               "type":"Column",
               "items":[
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"Return (C)",
                     "weight":"bolder"
                  },
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"19",
                     "separator":true
                  }
               ]
            },
            {
               "type":"Column",
               "items":[
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"NET Re Count (A-B-C)",
                     "weight":"bolder"
                  },
                  {
                     "type":"TextBlock",
                     "isSubtle":true,
                     "width":"stretch",
                     "text":"5864",
                     "separator":true
                  }
               ]
            }
         ]
      }
   ]
}

Output:

enter image description here

How to get complete text in all columns or How to increase width of column?

Update-1:

After changing width: 'stretch' to width: 'auto' in designer it working fine even after selecting host app as Microsoft Teams. But not working on actual teams application.

Any suggestions?

Expected Output:

enter image description here

microsoft-teams botframework adaptive-cards python
2 Answers
user_21226720

Adaptive Cards have limited fixed width and aren't meant to display tabular layout which has more than 3 colums(again subject to column name). You can achieve this layouts with Task Module.Please refer this documentation for more details.

user_141757220
Related