VirtualizingWrapPanel

repository·master·Indexed 18 days ago

https://github.com/sbaeumlisberger/virtualizingwrappanel

A high-performance WPF control for managing large collections of up to 1 million items using virtualization. It supports .NET Framework 4.6.2+ and .NET 6.0+, offering horizontal and vertical orientations, recycling and standard virtualization modes, and configurable caching strategies. The library includes a GridView control for out-of-the-box grid layouts, a VirtualizingItemsControl, and support for grouping, hierarchical virtualization, and items of different sizes via the IItemSizeProvider interface.

Tokens: 2.8K
Snippets: 9
Records: 12
Agent score: 14%

What's inside VirtualizingWrapPanel

Overview of VirtualizingWrapPanel and GridView
master
VirtualizingWrapPanel is a feature-rich WPF control designed for high-performance virtualization of large item collections. It supports both horizontal and vertical orientations, grouping/hierarchical virtualization, and configurable spacing and alignment. It can handle up to 1 million items and supports different item sizes through various caching strategies (pages, items, or pixels).
Additionally, the library provides a GridView control, which offers an easy-to-use, out-of-the-box experience for displaying data in a grid format using the underlying virtualization logic.
https://github.com/sbaeumlisberger/virtualizingwrappanel/blob/master/src/VirtualizingWrapPanel/nuget/README.md
Overview of VirtualizingWrapPanel
master
VirtualizingWrapPanel is a feature-rich WPF control designed for high-performance item virtualization. It supports both .NET Framework 4.6.2+ and .NET 6.0+. It is suitable for large datasets, having been tested with up to 1 million items.
Key capabilities include:
- Orientation: Supports both horizontal and vertical layouts.
- Virtualization Modes: Offers both recycling and standard virtualization.
- Caching: Configurable caching strategies based on pages, items, or pixels.
- Layout Flexibility: Supports different sized items, configurable spacing behavior, and item alignment.
- Advanced Virtualization: Supports grouping and hierarchical virtualization.
For an easier out-of-the-box experience, the library also provides a GridView control.
https://github.com/sbaeumlisberger/virtualizingwrappanel/blob/master/README.md
Install VirtualizingWrapPanel
master
To use the library in your WPF project, add the NuGet package via the .NET CLI:
dotnet add package VirtualizingWrapPanel
Then, register the namespace in your XAML files to access the controls:
xmlns:vwp="clr-namespace:WpfToolkit.Controls;assembly=VirtualizingWrapPanel"
```
dotnet add package VirtualizingWrapPanel
```
https://github.com/sbaeumlisberger/virtualizingwrappanel

Use VirtualizingWrapPanel with existing ItemsControls

master

You can replace the default ItemsPanel of an existing control (like ListView) with vwp:VirtualizingWrapPanel to enable wrapping and virtualization.

Note: When using ListView, it is recommended to set HorizontalContentAlignment and VerticalContentAlignment to Stretch in the ItemContainerStyle to ensure items fill the panel correctly.

<ListView
    ItemsSource="{Binding YourItemsSource}"
    ItemTemplate="{StaticResource YourItemTemplate}">
    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <vwp:VirtualizingWrapPanel/>
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
    <ListView.ItemContainerStyle>
        <Style TargetType="{x:Type ListViewItem}">
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        </Style>
    </ListView.ItemContainerStyle>
</ListView>

Implement Grouping with Virtualization

master

Grouping is supported by combining a CollectionViewSource with GroupStyle. To maintain virtualization while grouping, you must set VirtualizingPanel.IsVirtualizingWhenGrouping="True" on the host control (e.g., ListView).

Supported Orientation Combinations:

VirtualizingStackPanel.Orientation="Vertical" AND VirtualizingWrapPanel.Orientation="Horizontal": Vertical scrolling through groups, items wrap horizontally.
VirtualizingStackPanel.Orientation="Horizontal" AND VirtualizingWrapPanel.Orientation="Vertical": Horizontal scrolling through groups, items wrap vertically.

Note: Any other combination is not supported.

<ListView 
    VirtualizingPanel.IsVirtualizingWhenGrouping="True"  
    ItemsSource="{Binding Source={StaticResource GroupingItemsSource}}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <vwp:VirtualizingWrapPanel/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.GroupStyle>
        <GroupStyle>
            <GroupStyle.Panel>
                <ItemsPanelTemplate>
                    <VirtualizingStackPanel Orientation="Vertical"/>
                </ItemsPanelTemplate>
            </GroupStyle.Panel>
            <GroupStyle.ContainerStyle>
                <Style TargetType="{x:Type GroupItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type GroupItem}">
                                <StackPanel>
                                    <ContentPresenter Name="PART_Header" />
                                    <ItemsPresenter Name="ItemsPresenter" Margin="0" />
                                </StackPanel>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </GroupStyle.ContainerStyle>
        </GroupStyle>
     </ItemsControl.GroupStyle>
</ListView>

Configure SpacingMode and Item Stretching

master

The SpacingMode property determines how extra space in a layout row is distributed. When StretchItems is set to true, items expand to their maximum size to fill available space before the remaining space is distributed via SpacingMode.

SpacingMode	Description
`None`	Items are placed next to each other without spacing.
`Uniform`	Remaining space is distributed evenly between items and at the start/end of the row.
`BetweenItemsOnly`	Remaining space is distributed between items, but not at the start/end of the row.
`StartAndEndOnly`	Remaining space is distributed only at the start and end of the row.

Default SpacingMode: Uniform

<!-- Example with Uniform spacing and no item stretching -->
<vwp:VirtualizingWrapPanel SpacingMode="Uniform" StretchItems="false"/>

<!-- Example with GridView -->
<vwp:GridView SpacingMode="Uniform" StretchItems="false"/>

Use Different Sized Items (v2.x only)
master
To support items with varying sizes, set AllowDifferentSizedItems="true".
Important: It is strongly recommended to also set the ItemSizeProvider property to an instance of the IItemSizeProvider interface. Without a provider, the panel assumes item sizes based on already realized items, which can cause incorrect positioning during fast scrolling.
https://github.com/sbaeumlisberger/virtualizingwrappanel
Use the GridView control
master
The vwp:GridView is a high-level control that uses a VirtualizingWrapPanel by default, providing a simpler way to implement a wrapping layout without manually configuring the ItemsPanel.
```
<Window xmlns:vwp="clr-namespace:WpfToolkit.Controls;assembly=VirtualizingWrapPanel">
    <vwp:GridView
        ItemsSource="{Binding YourItemsSource, Mode=OneWay}"
        ItemTemplate="{StaticResource YourItemTemplate}">
    </vwp:GridView>
</Window>
```
https://github.com/sbaeumlisberger/virtualizingwrappanel
Use GridDetailsView for inline expansion
master
The GridDetailsView allows you to show an inline details view for items using the ExpandedItemTemplate property.
```
<vwp:GridDetailsView
    ItemsSource="{Binding YourItemsSource, Mode=OneWay}"
    ItemTemplate="{StaticResource ItemTemplate}"
    ExpandedItemTemplate="{StaticResource ExpandedItemTemplate}">
```
https://github.com/sbaeumlisberger/virtualizingwrappanel
Use VirtualizingItemsControl
master
The vwp:VirtualizingItemsControl is a specialized extension of the standard WPF ItemsControl that includes built-in support for virtualization.
```
<vwp:VirtualizingItemsControl
    ItemsSource="{Binding YourItemsSource, Mode=OneWay}"
    ItemTemplate="{StaticResource ItemTemplate}">
```
https://github.com/sbaeumlisberger/virtualizingwrappanel
Configure Orientation (v2.x only)
master
The Orientation property defines how items are arranged:
- Horizontal (Default): Items wrap to the next row when the edge is reached. Scroll direction is vertical.
- Vertical: Items wrap to a new column when the bottom is reached. Scroll direction is horizontal.
```
<vwp:VirtualizingWrapPanel Orientation="Vertical"/>
<vwp:GridView Orientation="Vertical"/>
```
https://github.com/sbaeumlisberger/virtualizingwrappanel
Configure Virtualization Caching
master
You can control the virtualization cache behavior using the standard WPF attached properties VirtualizingPanel.CacheLength and VirtualizingPanel.CacheLengthUnit. This allows you to pre-render items outside the visible viewport to improve scrolling smoothness.
```
<ListView
    VirtualizingPanel.CacheLength="200"
    VirtualizingPanel.CacheLengthUnit="Pixel">
    <ListView.ItemsPanel>
         <ItemsPanelTemplate>
            <vwp:VirtualizingWrapPanel/>
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
</ListView>
```
https://github.com/sbaeumlisberger/virtualizingwrappanel