[UWP][VS]Using the diagnostic tools in Visual Studio 2017 to check ListView virtualization

Have you ever changed some XAML in your Universal Windows Project and wondered if this might break some things? After reading this, you know how to let Visual Studio 2017 check bindings, virtualization and other XAML issues for you.

The XAML ListView supports virtualization of items since Windows 8.1. In order to allow virtualization, the ListView needs to have a height that is constraint by:

Imagine a list of items with a TextBox directly below the last item. By entering some text in the TextBox, an item is added to the ListView and the ListView grows until there is no more vertical space left. If you are unaware of virtualization it can be tempting to put the ListView and TextBox in a StackPanel to make them stacked vertically like this:

<Grid Background="LightBlue">
            <ListView Background="LightCyan" x:Name="ListViewTest" VerticalAlignment="Top">
                        <TextBlock Text="{Binding}"/>
            <TextBox x:Name="TextBoxAdd" Grid.Row="1" KeyDown="TextBox_KeyDown"/>

When we run this, we see that the ListView and TextBox are stacked vertically. The Scrollviewer ensures scrolling when there is not enough vertical space.

listview in stackpanel

Unfortunately, this will break virtualization

How can you check if virtualization still works?

Use Visual Studios Diagnostic Tools to run UI Analyses

visual studio diagnostic tools

If the UI Analyses Events list is empty (like in the screen below), you have to enable UI Analyses

no UI events

Enable UI events

Visual Studio will show you all the XAML problems it can find. Placing a ListView in a Stackpanel is one of them:

ListView not virtualized

In this post, you will learn how to make the TextBox sticky to the ListView while preserving virtualization.

Written by Loek van den Ouweland on January 29, 2017. Questions regarding this artice? You can send them to the address below.
By using this site, you acknowledge that you have read and understand our Cookie and Privacy Policy.