Over a million developers have joined DZone.

Virtualization in WPF with VirtualizingStackPanel

· Integration Zone

Learn how API management supports better integration in Achieving Enterprise Agility with Microservices and API Management, brought to you in partnership with 3scale

First blogged about this on my previous blog site here:

http://consultingblogs.emc.com/merrickchaffer/archive/2011/02/14/virtualization-in-wpf-with-virtualizingstackpanel.aspx

However, having come across this again today on a project, I thought it was important enough to re-blog! Finally managed to figure out how to get virtualization to actually behave itself in a listbox wpf control. Turns out that in order for Virtualization to work, you need three things satisfied. 

  1. Use a control that supports virtualization (e.g. list box or list view). (see Controls That Implement Performance Features section at bottom of this page for more info http://msdn.microsoft.com/en-us/library/cc716879.aspx#Controls )
  2. Ensure that the ScrollViewer.CanContentScroll attached property is set to True on the containing list box / list view control.
  3. Ensure that either the list box has a height set, or that it is contained within a parent Grid row, where that row definition has a height set (Height="*" will do if you want it to occupy the Client window height). Note: Do not use height=”Auto” as this will not work, as this instructs WPF to simply size the row to the height needed to fit all the items of the list box in, hence you do not get the vertical scroll bar appearing.
  4. Ensure that there is no wrapping ScrollViewer control around the list box, as this will prevent virtualization from occuring.
  5. Ensure that you use a VirtualizingStackPanel in the ItemsPanelTemplate for the ListBox.ItemsPanel
Example
<Grid Name="listBoxesGrid"
      Grid.Row="2">
  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>
    <ColumnDefinition/>
  </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

  <!-- Target Organizations listbox -->
  <ListBox Name="targetOrganizationsListBox"
           Grid.Column="0"
           HorizontalContentAlignment="Stretch"
           BorderThickness="0"
           Margin="5,10,15,2"
           ScrollViewer.HorizontalScrollBarVisibility="Disabled"
           ScrollViewer.CanContentScroll="True"
           VirtualizingStackPanel.IsVirtualizing="True"
           VirtualizingStackPanel.VirtualizationMode="Recycling"
           SelectionMode="Multiple"
           Width="Auto"
           Background="Transparent"
           ItemTemplate="{DynamicResource TargetOrgContactCard}"
           Height="Auto"
           Expander.MouseDoubleClick="targetOrganizationExpander_MouseDoubleClick"
                      Executed="OnAddToCallList" />
      <CommandBinding Command="local:SearchCoverageCommands.OpenCallDashboard"
                      Executed="OnOpenCallDashboard" />
      <CommandBinding Command="local:SearchCoverageCommands.AddComment"
                      Executed="OnAddComment" />
      <CommandBinding Command="local:SearchCoverageCommands.TargetCompanyChecked"
                      Executed="OnTargetCompanyChecked" />

    </ListBox.CommandBindings>
    <ListBox.ItemsPanel>
      <ItemsPanelTemplate>
          <VirtualizingStackPanel IsVirtualizing="True"
                                  VirtualizationMode="Recycling" />
      </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
  </ListBox>

</Grid>

Unleash the power of your APIs with future-proof API management - Create your account and start your free trial today, brought to you in partnership with 3scale.

Topics:
dotnet,tools,net,virtualizing,stackpanel

Published at DZone with permission of Merrick Chaffer , DZone MVB .

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}