UWP GridView scroll bar never showing up

Question

I have a Page that allow the user to load multiple images thumbnails from his folders. The number of rows update nicely when the width of the window is changed

The only thing that I could not figure out how to make it work is having the vertical scroll bars, I pretty much tried every settings possible.

At first my root was a stackPanel so I switched to a Grid to see if there would be any difference.

here is my xaml

<Page
x:Class="IMG.Pages.UploadPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:img="using:IMG"
xmlns:local="using:IMG.Pages"
xmlns:Models="using:IMG.Models"

mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

<Grid x:Name="root">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0"
        Padding="2"
        BorderBrush="Black"
        BorderThickness="1"
        Orientation="Horizontal">
        <Button Click="GetPhoto" Content="get images" />
    </StackPanel>
    
    <GridView x:Name="ImageGrid" Width="Auto" Background="LightBlue" Grid.Row="1" Margin="5" Height="Auto"
                  SizeChanged="ImageGridSizeChanged"
                  ScrollViewer.HorizontalScrollBarVisibility="Auto"
                  ScrollViewer.HorizontalScrollMode="Auto"
                  ScrollViewer.VerticalScrollBarVisibility="Disabled"
                  ScrollViewer.VerticalScrollMode="Disabled">   
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.ItemTemplate>
            <DataTemplate x:Name="ImgThumbnail" x:DataType="Models:ImageData">
                <StackPanel
                            Width="100"
                            Height="120"
                            Margin="5"
                            AutomationProperties.Name="{x:Bind Hash}">
                    <StackPanel Margin="1">
                        <TextBlock Text="{x:Bind File}" />
                    </StackPanel>
                    <Image x:Name="thumbIMG" Width="80" Height="100" Stretch="UniformToFill" />
                </StackPanel>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
</Grid>

At first the gridview is empty, the user click on the button and then in the FileOpenPicker he can choose multiple images and they are added as thumbnail binded to an ObservableList of ImageData

The binding work nicely, I am simply stuck on the scrollbar

Answer 1

I have experienced the same issue and I fixed it by setting the height of the gidview on the fix size instead of auto. And than you can set

ScrollViewer.VerticalScrollBarVisibility = "Visible"
ScrollViewer.VerticalScrollMode = "Enable"