Virtualising WrapPanel
World’s first Virtualising Wrap Panel. Allows Grouping and Filtering whilst Virtualising the WrapPanel.
Feature Highlights
- World's first Virtualising Wrap Panel
- Grouping of content enabled even when virtualising
- Can render group header, and also the ability to customise it
- Supports IEditableCollectionView data sources
- Automatic re-virtualisation/realisation of items
- Many more features!
A quick peek into some features...
What is Virtualising WrapPanel all about?
The control is a UI Virtualisation capable WrapPanel control for WPF.
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?
UI Virtualisation
The control works just like the stock .NET WrapPanel control, but in addition, the control automatically virtualises, realises, 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 virtualised, consequently letting you to allow your users to view and scroll through large amounts of visuals / data items very quickly.
Grouping of content during virtualisation enabled
The control supports virtualisation even when grouping – i.e. perform virtualisation 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:
Continuation: The grouped data (header and children) will continue to flow one group after the other, wrapping lines in a standard manner
LineBreak: Each group header (and its grouped child items) will start to render in the new row/column
StandaloneRow: Each group header will live in a new row/column, and its children will start to render in the next row/column.
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.
UI Virtualise anything that can be scrolled
The control can be used to automatically UI Virtualise 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 virtualise the scrollviewer’s content.
Screenshot of using the control to virtualise the scrollviewer’s content, as part of the ItemsControl’s ControlTemplate
Customised Group Header Summary Rendering
- The control supports drawing a group header summary row
- The group header is fully customisable via custom data template
- A property ItemPositioningMode is also available, with two possible options: Greedy and Safe – to manage the available space for rendering the virtualised child items
Deep Customisation of Drawing the Grouped mode Visuals
The control supports being able to customise 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:
- Custom extra spacing between group header row and data item row
- Custom extra spacing between group rendering completion and where the group header row rendering begins
- Should the control render the default item dimension worth of height spacing between group header and data item row
- Should the control render the default item dimension height worth of spacing after a group has been rendered
Should the control render the default extra line before rendering the group header.
Customising 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.
Supports Transactional Updates, Data Filtering and Sorting
IEditableCollectionView data sources: The control’s virtualisation engine will support the transactional edits to the ItemsControl’s items source data, and the control will automatically re-virtualise/realise the contents for rendering in its viewport.
Dynamic update of the viewport, based on Filter and Sort: The control is capable of dynamic and automatic re-virtualisation / realisation of child items for re-rendering in the view port, on dynamically filtered and sorted data (for ICollectionView data sources)
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, Centre 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
whether the control should adjust right HorizontalAlignment setup considering scroll info
whether the control should share unused space equally between left and right sides of the panel when aligning for HorizontalAlignment
On-Demand Realising of Desired Child Item
The control is capable of realising a specified item from the associated data-bound source and scroll it into view, given the item’s index.
Configurable Virtualisation Scheme
The control allows you to choose from two virtualisation schemes – viz.,
- dispose off (virtualise) the children the moment they leave the bounds of the viewport, OR
- let the control perform a light-weight cache of the virtualised items.
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.
MVVM Design Pattern Friendly
The control is MVVM pattern friendly, and hence the control’s capabilities can be used straight from your viewmodel.