I have a very basic GridView control defined in a Windows Store App Page that looks like this:
<GridView
x:Name="myGridView"
Grid.RowSpan="2"
Padding="30,137,40,46"
ItemsSource="{Binding Source={StaticResource myItemsViewSource}}"
ItemTemplate="{StaticResource My500x500ItemTemplate}"
SelectionMode="Multiple"
IsSwipeEnabled="True"
IsItemClickEnabled="True">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Grid Margin="1,0,0,6">
<Button
Style="{StaticResource TextPrimaryButtonStyle}">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Title}" Margin="3,-7,10,10" Style="{StaticResource GroupHeaderTextStyle}" />
<TextBlock Text="{StaticResource ChevronGlyph}" FontFamily="Segoe UI Symbol" Margin="0,-7,0,10" Style="{StaticResource GroupHeaderTextStyle}"/>
</StackPanel>
</Button>
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
At runtime, the data bound to myItemsViewSource
appears in the GridView
control as I would expect.
However, I am experiencing a strange scrolling issue when there are more items in the data source than can be displayed on the screen. The scrollbar seems to "resist" my effort to scroll the collection and only slightly moves the viewport, until it "breaks free" and I can scroll through the rest of the items:
The same thing happens on the way back, from right-to-left: scrolling happens smoothly until I get close enough to the start of the scrolled area, where it appears to "stick" again:
Thinking that the problem had something to do with virtualization, I tried changing the ItemsPanel
for the GridView
to a StackPanel
instead of a VirtualizingStackPanel
, but this had the even worse effect of preventing any of the items from being shown. Note: the GridView
is not hosted in any other scrolling area or canvas.
I'll post my workaround below, but I'm hoping someone has a more satisfying answer.