CODEWITHSUNDEEP
c#xamlwin-universal-appwindows-10uwp-xaml
Jong the Chemist
Jong the Chemist

Reputation: 31

GridView with fixed height and variable widths for UWP

I'm looking for the exact solution used by the stock Photo app in Windows 10 to display a list of photos where the dimensions are different. Basically the height of the row are fixed but the width of each element is variable, determined by its relative dimension. A solution I used before was to use WrapPanel as the ItemsPanelTemplate. But using that means I lose the UI virtualisation for a very long list. There is certainly a solution used by Microsoft for the Photo app but I can't find it anywhere.

Upvotes: 0

Views: 1859

Answers (1)

Alexej Sommer
Alexej Sommer

Reputation: 2679

You can use WrapPanel from XAML Toolkit in your UWP application.

Or you can try to do it this way:

<GridView ItemsSource="{Binding}"> 
<GridView.ItemTemplate> 
<DataTemplate> 
<Grid Width="100">
<Image Width="100" Height="50" Source="{Binding somesource}" /> 
</Grid> 
</DataTemplate> 
</GridView.ItemTemplate> 
<GridView.ItemsPanel> 
<ItemsPanelTemplate> 
<ItemsWrapGrid MaximumRowsOrColumns="8" Orientation="Horizontal" />
</ItemsPanelTemplate> 
</GridView.ItemsPanel> 
</GridView>

Or you can also use VariableSizedWrapGrid (it will let you to have images with different height)

Upvotes: 1

Related Questions