Thursday, December 20, 2012

Virtualization Performance Issue with Large Scrollable Data SL4

Virtualization Performance Issue with Large Scrollable Data SL4

Problem: Displaying large amounts of data in a scrollable area has horrible performance and/or User eXperience.

Tried: Basically set a DataTemplate in a ListBox to show a grid of populated data with the VirtualizationMode set to Recycle and a fixed height set on the ListBox iteself. Something like the example below.

 <ListBox x:Name="Items"       TabNavigation="Once"       VirtualizingStackPanel.VirtualizationMode="Recycling"            Height="500">                      <ListBox.ItemTemplate>                 <DataTemplate>                     <StackPanel Orientation="Horizontal" Margin="0,5">                         <HyperlinkButton Content="Action" Margin="5"/>                         <ContentControl                                   cal:View.Model="{Binding}"                                   VerticalContentAlignment="Stretch"                                  HorizontalContentAlignment="Stretch"/>                     </StackPanel>                 </DataTemplate>             </ListBox.ItemTemplate>         </ListBox> 

The ContentControl would be bringing in a standard <Grid> from another view that formats the overall layout of the populated items consisting of around 20 static, and 20 data bound TextBlocks.

This works alright, and cut the initial loads in half. HOWEVER, now the problem is I need the ability for the height to NOT be a fixed size so it takes up the space available in its parent and can even be resized. Thanks to @DanFox I found out you have to fix the height in one form or another to invoke the virtualizing or the RenderEngine just thinks it has infinite room anyway.

The Question is: Is there a better way to do this, or how can I at least fix the current technique to allow for better UX? I'm generating potentially hundreds of these items so I need the performance enhancement of virtualization. However I also need to allow the user to resize the window and retain the ability to scroll effectively.

Any insight is greatly appreciated, thanks and Happy Holidays!

Answers & Comments...




No comments:

Post a Comment

Send us your comment related to the topic mentioned on the blog