Enabling virtualization in Win 8.1 Gridview with Grouping

Question

I have been trying to reduce the load time of a page that contains this gridview, As per MS documentation http://msdn.microsoft.com/en-US/library/windows/apps/xaml/hh780657.aspx ,you will not get virualization if you use Grouping. Does anyone knows how to do this?

<CollectionViewSource x:Name="serviceViewSource" Source="{Binding PageData}" IsSourceGrouped="True" ItemsPath="Contents" />


<GridView
        x:Name="itemGridView"
        AutomationProperties.AutomationId="ItemsGridView"
        AutomationProperties.Name="Items"
        ScrollViewer.IsHorizontalScrollChainingEnabled="False"
        TabIndex="1"
        Padding="120,0,0,50"
        ItemsSource="{Binding Source={StaticResource serviceViewSource}}"
        SelectionMode="Multiple"
        IsSwipeEnabled="True"
        IsItemClickEnabled="True"
        IsEnabled="{Binding IsGridViewEnabled}"
        CanReorderItems="False" CanDragItems="False" Grid.Row="1" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" ShowsScrollingPlaceholders="True"
        common:GridViewItemClickedCommand.Command="{Binding ItemClickedCommand}" ItemTemplateSelector="{StaticResource gridViewTemplateSelector}"
        >

            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"  HorizontalAlignment="Stretch"/>
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>

            <GridView.GroupStyle>
                <GroupStyle HidesIfEmpty="True">
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <Grid x:Name="headerGrid">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="90*"/>
                                    <ColumnDefinition Width="Auto"/>
                                </Grid.ColumnDefinitions>
                                <Button x:Name="headerButton" Content='{Binding Name}' Background="Transparent" Foreground="AliceBlue" BorderThickness="0" Command="{Binding DataContext.HeaderCommand, ElementName=pageRoot}"

                                       IsRightTapEnabled="False" IsHoldingEnabled="False" IsDoubleTapEnabled="False" CommandParameter="{Binding HeaderIdentifier}" FontFamily="Global User Interface" />
                                <ProgressRing Grid.Column="1" IsActive="{Binding LoadingData}" />
                            </Grid>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>

                    <GroupStyle.ContainerStyle>
                        <Style TargetType="GroupItem">

                            <Setter Property="BorderBrush" Value="Transparent"/>
                            <Setter Property="BorderThickness" Value="1"/>

                            <Setter Property="HorizontalAlignment" Value="Stretch"/>
                            <Setter Property="VerticalAlignment" Value="Stretch"/>
                        </Style>
                    </GroupStyle.ContainerStyle>

                    <GroupStyle.Panel>
                        <ItemsPanelTemplate>

                            <VariableSizedWrapGrid Margin="0,0,80,0">

                            </VariableSizedWrapGrid>

                        </ItemsPanelTemplate>
                    </GroupStyle.Panel>
                </GroupStyle>
            </GridView.GroupStyle>
        </GridView>

score 2 · Accepted Answer · answered Jun 06 '14 at 21:50

2

In Windows 8.1 using the GridView with defaults will use the ItemsWrapGrid as the panel and this does group virtualization for you. Using a StackPanel as you have your code will not get UI virtualized.

answered Jun 06 '14 at 21:50

Tim Heuer

4,301
21
20

Thanks, i figured it out, this was the line in documentation which was throwing me off. "UI virtualization is not supported for grouped data. For more info about grouping data, see How to group items in a list or grid" but the video at http://channel9.msdn.com/Events/Build/2013/3-158 cleared it up for me. Now I am stuck with layout cycle error detected though :-| – AGCodes Jun 09 '14 at 18:22

Enabling virtualization in Win 8.1 Gridview with Grouping

1 Answers1