microsoft / microsoft/AdaptiveCards

[Rendering] [WinUI3] Columns not are not vertically stretched in WinUI3

Open
#8,971 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Area-Renderers Bug
Dominant language
C#
Stars
2k
Forks
595
Avg merge
1d 19h
Merged PRs (30d)
1

Description

Target Platforms

UWP/WinUI3

SDK Version

Unknown, but probably latest released

Application Name

Widgets board (With new WinUI3 Adaptive Cards)

Problem Description

When using a ColumnSet with an specified minHeigh columns elements doesn't use all the space available. This behavior differs from other platforms such NodeJS.

Screenshots

This is how the card is rendered in the designer:
Designer screenshot

This is how the card is rendered in the widget board:
WinUI3 screenshot

Card JSON
{
    "type": "AdaptiveCard",
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.6",
    "body": [
        {
            "type": "ColumnSet",
            "minHeight": "50px",
            "columns": [
                {
                    "type": "Column",
                    "width": "stretch",
                    "backgroundImage": {
                        "url": "data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\"><rect width=\"100%\" height=\"100%\"/></svg>"
                    },
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "TextBlock",
                            "wrap": true,
                            "color": "Light"
                        }
                    ]
                }
            ]
        }
    ]
}
Sample Code Language

No response

Sample Code

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the supplied Adaptive Card JSON and compare the WinUI3 widget-board rendering with the designer and NodeJS behavior. Trace the ColumnSet minHeight layout handling for WinUI3; done means the column content vertically stretches to use the available height.

Written by the indexing model from the issue text.

Assessment

Tech stack
csharp
Domain
desktop, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.