UI Virtualizing WrapPanel
The control is a UI Virtualization capable WrapPanel control for WPF, Silverlight, and Windows Phone.
It is extremely helpful in boosting the performance of User-interface and improving the User-experience (UX), especially when you have the need to associate large amounts of data with an ItemsControl that has to display content in an automatic Wrapping fashion.
What Does It Do?
The control works just like the stock .NET WrapPanel control, but in addition, the control automatically virtualizes, realizes, and arranges the associated content, by automatically creating and destroying the containers for the content items on-the-fly.
This means the UI of your ItemsControl or ScrollViewer is completely virtualized, consequently letting you to allow your users to view and scroll through large amounts of visuals / data items very quickly.
Sample Projects (C#):
The control supports virtualization even when grouping – i.e. perform virtualization and also continue to render the collection data using custom grouping setup on it.
The control offers three kinds of header & children content rendering., viz:
The StandaloneRow mode is similar to LineBreak mode, except that in this mode, the group header will live in its own row/column than the relevant grouped items.
Screenshot of the control rendering its virtualized view based on the Grouping and Sorting setup on the its data source:
The control supports being able to customize the various drawing aspects of the Grouped mode, giving you the control on rendering up to the pixel level.
The following are some of the rendering aspects that you can control:
Customizing the Height of the Group Header
By default, the control will render the header with a Height of 24.0 units, but you can specify the header height if you are setting up a custom header via your custom data template (as described above).
To support custom height for the header rendering, there is a property in the control named GroupHeaderItemCustomHeight.
Dynamic Injection Of Control Supported
The control, by default, supports its use directly in XAML -i.e. hosting it inside an ItemsControl or ScrollViewer instance or even using it as a WrapPanel control directly, and be able to transparently use it in a MVVM design-pattern friendly manner.
In addition to that, it also supports some advanced scenarios of usage - i.e. there are scenarios where you would want to dynamically inject the control either via code or swap the control as the panel via some style triggers.
The control supports such advanced scenarios of usage as well, and you enable this usage by simply setting a property in the control - i.e. IsDynamicConstructionCapabilityEnabled to true.
The control can be used to automatically "UI Virtualize" any content that can be scrolled.
The typical Use-case for this control is to use it as the ItemsPanelTemplate for an ItemsControl, but you can use this control to virtualize any scrollable content, not just only as ItemsPanelTemplate.
For example, you can host it inside a scrollviewer (as part of an ItemsControl's ControlTemplate) to UI virtualize the scrollviewer's content.
Screenshot of using the control to virtualize the scrollviewer's content, as part of the ItemsControl's ControlTemplate
Custom Layout Management
The control is written from scratch, and implements custom logic for content layout and scrolling.
The control supports two layout orientations viz., Horizontal and Vertical Orientations, and fully custom implements IScrollInfo interface for scrolling support.
Advanced Alignment Management
The control fully supports Alignment setting - i.e. all modes: Horizontal and Vertical, and all alignments for each of these, like Left, Center and Right, etc.
The control also allows you to control deeper aspects of when aligning, viz.,
whether the control should use a custom set render-time Margin value when re-computing the viewport extent spacing adjustment
On-Demand Realizing of Desired Child Item
The control is capable of realizing a specified item from the associated data-bound source and scroll it into view, given the item's index.
Configurable Virtualization Scheme
The control allows you to choose from two virtualization schemes - viz.,
Custom Item Dimension / Sizing
The child items content hosted in the control can have differing size of Height and Width values.
Animation of Wrapping Action
The control can (optionally) perform an animation while wrapping the child elements from one row/line to the next.
The control is MVVM pattern friendly, and hence the control's capabilities can be used straight from your viewmodel.