CODEWITHSUNDEEP
c#windowsxamluwpuwp-xaml
Josh Hunt
Josh Hunt

Reputation: 14511

auto-fit Grid Columns in UWP XAML

I'm using GridView to create a grid of items, and im trying to make the columns fill to expand the remaining space. Similar to how auto-fit behaves in CSS. See example..

Here I've set the MaxWidth of the GridView's children to 350px, and then when the window is not an even multiple of 350px + padding, I would like each column to expand to fill the remaining space.

enter image description here

Is this possible with UWP/XAML?

Upvotes: 0

Views: 798

Answers (1)

Faywang - MSFT
Faywang - MSFT

Reputation: 5868

If you want to achieve the auto-fit effect, you can try to use UniformGrid Control from Windows Community Toolkit. It is a responsive layout control which arranges items in a evenly-spaced set of rows or columns to fill the total available display space. First, you need to add Microsoft.Toolkit.Uwp.UI.Controls nuget package and then use it as GridView's ItemsPanel. For example:

.xaml:

xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"

<GridView.ItemsPanel>
    <ItemsPanelTemplate>
        <controls:UniformGrid Columns="3" Orientation="Horizontal"/>
    </ItemsPanelTemplate>
</GridView.ItemsPanel>

Upvotes: 1

Related Questions