Using the IncrementalUpdateBehavior to implement smooth scrolling

A common scenario in Windows Store apps is to use a GridView or ListView control to display a large number of data items. This can have a performance impact, which can be partially mitigated through UI virtualization. However, when displaying complex data items there can still be problems displaying the data items smoothly when scrolling.

This problem can be further addressed by using the IncrementalUpdateBehavior to incrementally update data items displayed by a GridView or ListView control. This behaviour promotes a smooth scrolling experience by deferring updates to some of the elements in the ItemTemplate until there is render time available.

This behaviour is triggered when the data being displayed by a GridView or ListView control changes. The order in which to update elements in the ItemTemplate on screen can be specified by adding the IncrementalUpdateBehavior to each element in the DataTemplate to be displayed, and setting its Phase property. The Phase property is used to set the priority of the incremental update in relation to other items in the DataTemplate.

<DataTemplate>

    <Image Source="{Binding Image}"

           Stretch="UniformToFill">

        <Interactivity:Interaction.Behaviors>

            <Core:IncrementalUpdateBehavior Phase="2"/>

        </Interactivity:Interaction.Behaviors>

    </Image>

    <TextBlock Text="{Binding Title}">

        <Interactivity:Interaction.Behaviors>

            <Core:IncrementalUpdateBehavior Phase="1"/>

        </Interactivity:Interaction.Behaviors>

    </TextBlock>

    <TextBlock Text="{Binding Price}">

        <Interactivity:Interaction.Behaviors>

            <Core:IncrementalUpdateBehavior Phase="1"/>

        </Interactivity:Interaction.Behaviors>

    </TextBlock>

</DataTemplate>

This DataTemplate specifies that the Title and Price for each data item will be displayed in the first rendering phase, with the Image being displayed in the second rendering phase. This helps to promote a smoother scrolling experience when scrolling through a data set that contains a large amount of data. If you require better performance than is provided by the IncrementalUpdateBehavior you should instead consider handling the ContainerContentChanging event in code.

For more information, including handling the ContainerContentChanging event in code, and a full downloadable code example, see Incremental loading Quickstart for Windows Store apps using C# and XAML, which we produced as part of Prism for the Windows Runtime for Windows 8.1.