Ndtyjky

I've got a calendar-like control with a column for each day of the week and seven ObservableCollections which can contain up to a hundred or more items each.

I'd like to be able to vertically scroll through them [Edit] simultaniously [/Edit] while having them virtualized.

Right now I've got the following layout

<ScrollViewer>

    <Grid>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="1*"></ColumnDefinition>

            <ColumnDefinition Width="1*"></ColumnDefinition>

            <ColumnDefinition Width="1*"></ColumnDefinition>

            <ColumnDefinition Width="1*"></ColumnDefinition>

            <ColumnDefinition Width="1*"></ColumnDefinition>

            <ColumnDefinition Width="1*"></ColumnDefinition>

            <ColumnDefinition Width="1*"></ColumnDefinition>

        </Grid.ColumnDefinitions>



        <!-- Monday -->

        <Border Grid.Column="0">

            <ItemsControl ItemsSource="{Binding Monday}">

                <ItemsControl.ItemsPanel>

                    <ItemsPanelTemplate>

                        <VirtualizingStackPanel IsVirtualizing="True" VirtualizationMode="Recycling" ... />

                    </ItemsPanelTemplate>

                </ItemsControl.ItemsPanel>

                <ItemsControl.ItemTemplate>

                    <DataTemplate>

                        <MyControl Item="{Binding}" ... />

                    </DataTemplate>

                </ItemsControl.ItemTemplate>

            </ItemsControl>

        </Border>



        ...



    </Grid>

</ScrollViewer>

However, the performance is questionable and I think it's due to the ScrollViewer allowing the Grid -> Border -> VirtualizingStackPanel to vertically expand and not virtualize at all. Is that the case?

(Sidenote: I've tried to remove the ScrollViewer and add CanVerticallyScroll="True" to the VirtualizingStackPanels and expected them to scroll independently to check if performance is any better but they wouldn't scroll at all)

What could be a correct layout for this?

Edit: Displaying 100 elements for each column (700 total) takes 13 seconds, scrolling is actually okay

[Edit2]:
Due to the required simultanious scrolling, I've tried to create a new collection that contains "one row" (7 items) and that as template in a listview. Horrible results [/Edit2]

To make a ItemsControl virtualizing you not only need to use the VirtualizingStackPanel but also add a ScrollViewer to the template of the ItemsControl (normally the ItemsControl does not have a ScrollViewer).

Add this template inside your ItemsControl:

<ItemsControl.Template>

    <ControlTemplate>

        <Border BorderThickness="{TemplateBinding Border.BorderThickness}"

                Padding="{TemplateBinding Control.Padding}"

                BorderBrush="{TemplateBinding Border.BorderBrush}"

                Background="{TemplateBinding Panel.Background}"

                SnapsToDevicePixels="True">

            <ScrollViewer Padding="{TemplateBinding Control.Padding}"

                          Focusable="False">

                <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />

            </ScrollViewer>

        </Border>

    </ControlTemplate>

</ItemsControl.Template>

As an different solution you can of course replace your ItemsControl with a ListBox, which already has everything needed for virtualizing your list.

The solution to the issue was to not render the seven columns each with one virtualized ItemsControl in a ScrollViewer (which seemed to expand the ItemsControls and make them draw all controls) but render with one ItemsControl, solving the scrolling through ItemsControl.Template and displaying one row at a time.

I created a new collection and grabbed the objects "per row"

for(int PI = 0; PI < MathHelper.Max(Monday.Count, Tuesday.Count, Wednesday.Count, Thursday.Count, Friday.Count, Saturday.Count, Sunday.Count); PI++)

{

    Presentation.Add(new WeekRow(

        Monday.Count > PI ? Monday[PI] : null,

        Tuesday.Count > PI ? Tuesday[PI] : null,

        Wednesday.Count > PI ? Wednesday[PI] : null,

        Thursday.Count > PI ? Thursday[PI] : null,

        Friday.Count > PI ? Friday[PI] : null,

        Saturday.Count > PI ? Saturday[PI] : null,

        Sunday.Count > PI ? Sunday[PI] : null

        ));

}

And displayed them using this

<ItemsControl ItemsSource="{Binding Presentation}" VirtualizingPanel.ScrollUnit="Pixel">

    <ItemsControl.Template>

        <ControlTemplate>

            <ScrollViewer CanContentScroll="True" Focusable="False">

                <ItemsPresenter />

            </ScrollViewer>

        </ControlTemplate>

    </ItemsControl.Template>

    <ItemsControl.ItemsPanel>

        <ItemsPanelTemplate>

            <VirtualizingStackPanel 

                Orientation="Vertical" 

                IsVirtualizing="True"

                VirtualizationMode="Recycling">

            </VirtualizingStackPanel>

        </ItemsPanelTemplate>

    </ItemsControl.ItemsPanel>

    <ItemsControl.ItemTemplate>

        <DataTemplate>

            <Grid>

                <Grid.ColumnDefinitions>

                    <ColumnDefinition Width="*"/>

                    <ColumnDefinition Width="*"/>

                    <ColumnDefinition Width="*"/>

                    <ColumnDefinition Width="*"/>

                    <ColumnDefinition Width="*"/>

                    <ColumnDefinition Width="*"/>

                    <ColumnDefinition Width="*"/>

                </Grid.ColumnDefinitions>



                <MyControl Item="{Binding Monday}" Grid.Column="0" ... />



                ...



            </Grid>

        </DataTemplate>

    </ItemsControl.ItemTemplate

</ItemsControl>

What's really important here, is to set the CanContentScroll-Property of the ScrollViewer to true or otherwise the virtualization will not work (who knows why). This was missing in @Marc's answer.

Edit: What's also worth mentioning is, that to get "smooth scrolling" (well, as "smooth" as wpf can get..), one has to set VirtualizingPanel.ScrollUnit to "Pixel". But it only works when set to the ItemsControl, and not to the ScrollViewer, ItemsPresenter or VirtualizingStackPanel itself. For whatever reason.