4

我在 Windows 应用商店应用页面中定义了一个非常基本的 GridView 控件，如下所示：

    <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>

在运行时，绑定到的数据会myItemsViewSource出现在GridView控件中，正如我所期望的那样。

但是，当数据源中的项目多于屏幕上显示的项目时，我遇到了一个奇怪的滚动问题。滚动条似乎“抵制”了我滚动集合的努力，并且只稍微移动了视口，直到它“脱离”并且我可以滚动浏览其余项目：

向右滚动问题的演示

超越粘滞点的平滑滚动演示

同样的事情发生在从右到左的路上：滚动顺利进行，直到我足够接近滚动区域的开始，它似乎再次“粘住”：

向左滚动问题演示

考虑到问题与虚拟化有关，我尝试将ItemsPanelfor the更改为GridViewaStackPanel而不是 a VirtualizingStackPanel，但这会产生更糟糕的效果，即阻止显示任何项目。注意：GridView不托管在任何其他滚动区域或画布中。

我将在下面发布我的解决方法，但我希望有人有更令人满意的答案。

4

3 回答 3

3

您应该删除实际 GridView 上的左边距和填充并将其添加到 ItemsPanel 声明中。有点令人困惑，因为默认模板确实在 gridview 上设置了填充。

这是默认模板附带的 GridView 的开始，我对 GridView 控件上的填充和 VirtualizingStackPanel ItemsPanel 声明上设置的边距进行了编辑。

<GridView
        x:Name="itemGridView"
        AutomationProperties.AutomationId="ItemGridView"
        AutomationProperties.Name="Grouped Items"
        Grid.RowSpan="2"
        Padding="0,137,40,46"
        ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
        ItemTemplate="{StaticResource Standard250x250ItemTemplate}"
        SelectionMode="None"
        IsSwipeEnabled="false"
        IsItemClickEnabled="True"
        ItemClick="ItemView_ItemClick">

        <GridView.ItemsPanel>
            <ItemsPanelTemplate>                        
                <VirtualizingStackPanel Margin="116,0,0,0" Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
于 2013-01-17T14:27:07.010 回答
0

删除GridView.Padding属性并将其替换为GridView.Margin解决“粘性滚动”问题：

    <GridView
        x:Name="myGridView"
        Grid.RowSpan="2"
        Margin="30,137,40,46" <!-- replaced 'Padding' with 'Margin' -->
        ItemsSource="{Binding Source={StaticResource myItemsViewSource}}"
        ItemTemplate="{StaticResource My500x500ItemTemplate}"

        ...

然而，这让我很困惑，因为 Visual Studio GridView 项目模板使用的是 Padding，而不是 Margin。

有人知道更令人满意的解决方案吗？

编辑：删除了误导性陈述。

于 2012-11-11T14:55:14.300 回答
0

问题是 

<VirtualizingStackPanel Margin="116,0,0,0" Orientation="Horizontal"/>

将其更改为： <StackPanel Margin="116,0,0,0" Orientation="Horizontal"/>

于 2013-09-07T20:51:03.960 回答