My customzied nested Accordion becomes very slow when loading more then 50 Entries.
When i start using WPF our Customer wants the WPFToolkit Accordion, but there start the Story of Problems. Because it was not possbile to create a dynamic 3 Level nested Accordion.
Here is my Accordion created with a ListBox and Expanders for each Level.
<DockPanel LastChildFill="True" Margin="10,15,10,0"><!-- Level 1 --><ListBox ItemsSource="{Binding Comunities, UpdateSourceTrigger=PropertyChanged}"
HorizontalContentAlignment="Stretch"
Background="Transparent"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
Margin="0,0,0,0"><ListBox.Style><Style TargetType="{x:Type ListBox}"><Setter Property="Template"><Setter.Value><ControlTemplate><ItemsPresenter></ItemsPresenter></ControlTemplate></Setter.Value></Setter><Style.Triggers><DataTrigger Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Items.Count}" Value="0"><Setter Property="Template"><Setter.Value><ControlTemplate><Border BorderThickness="0.2" BorderBrush="Black" Background="Transparent"><TextBlock Foreground="Black" Text="{x:Static tfProUIStrings:TFProUIStrings.NoScheme}" Margin="20" FontSize="10pt"></TextBlock></Border></ControlTemplate></Setter.Value></Setter></DataTrigger></Style.Triggers></Style></ListBox.Style><!--<ListBox.Template><ControlTemplate TargetType="ListBox"><ItemsPresenter></ItemsPresenter></ControlTemplate></ListBox.Template>--><ListBox.ItemsPanel><ItemsPanelTemplate><StackPanel Background="Transparent" Orientation="Vertical"></StackPanel></ItemsPanelTemplate></ListBox.ItemsPanel><ListBox.ItemTemplate><DataTemplate><Expander HorizontalAlignment="Stretch"
Header="{Binding}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
Style="{DynamicResource ExpanderAccordionStyle}"
Content="{Binding}"
VerticalContentAlignment="Stretch"><Expander.HeaderTemplate><DataTemplate><TextBlock Text="{Binding Description}"
FontWeight="UltraBold"
FontSize="9.5pt"
Margin="0,7,0,0"
Height="25"
HorizontalAlignment="Stretch"></TextBlock></DataTemplate></Expander.HeaderTemplate><Expander.ContentTemplate><DataTemplate><!-- Level 2 --><ListBox ItemsSource="{Binding Years, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
HorizontalContentAlignment="Stretch"
Background="Transparent"
SelectedItem="{Binding DataContext.SelectedHolidayYear,
RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBox}},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
Margin="0,0,0,0"><ListBox.Template><ControlTemplate TargetType="ListBox"><ItemsPresenter /></ControlTemplate></ListBox.Template><ListBox.ItemsPanel><ItemsPanelTemplate><StackPanel Background="Transparent" Orientation="Vertical"></StackPanel></ItemsPanelTemplate></ListBox.ItemsPanel><ListBox.ItemTemplate><DataTemplate><Expander HorizontalAlignment="Stretch"
Header="{Binding}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
Style="{DynamicResource ExpanderAccordionStyle}"
Content="{Binding}"
VerticalContentAlignment="Stretch"><Expander.HeaderTemplate><DataTemplate><TextBlock Text="{Binding Year, UpdateSourceTrigger=PropertyChanged}"
FontWeight="Black"
FontSize="9pt"
Margin="0,7,0,0"
Height="24"
HorizontalAlignment="Stretch"></TextBlock></DataTemplate></Expander.HeaderTemplate><Expander.ContentTemplate><DataTemplate><!-- Input Area --><DockPanel LastChildFill="True" Margin="10,0,10,30"><!-- List-Data --><dg:DataGrid HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
AutoGenerateColumns="False"
CanUserAddRows="False"
SelectionUnit="FullRow"
SelectionMode="Single"
CanUserResizeColumns="False"
CanUserResizeRows="False"
CanUserReorderColumns="False"
CanUserSortColumns="False"
Background="White"
FontSize="9pt"
MaxHeight="400"
RowStyle="{StaticResource RowStyle}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
ItemsSource="{Binding Days, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
VerticalScrollBarVisibility="Visible"><dg:DataGrid.Style><Style TargetType="{x:Type dg:DataGrid}"><Style.Triggers><DataTrigger Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Items.Count}" Value="0"><Setter Property="Template"><Setter.Value><ControlTemplate><Border BorderThickness="0.2" BorderBrush="Black" Background="White" CornerRadius="3"><TextBlock Text="{x:Static tfProUIStrings:TFProUIStrings.NoDay}" Margin="20" FontSize="10pt"></TextBlock></Border></ControlTemplate></Setter.Value></Setter></DataTrigger></Style.Triggers></Style></dg:DataGrid.Style><dg:DataGrid.RowValidationRules><vr:RowDataInfoValidationRule ValidationStep="UpdatedValue" /></dg:DataGrid.RowValidationRules><!-- Cols --><dg:DataGrid.Columns><!-- Date --><dg:DataGridTemplateColumn Width="156" Header="{x:Static prop:Resources.Date}"><dg:DataGridTemplateColumn.CellTemplate><DataTemplate><!-- Start-Date Picker --><dpk:DatePicker Name="Dpk_Start"
Width="150"
Margin="0,0,0,0"
VerticalAlignment="Top"
CalendarTheme="AeroNormal"
CalendarHeight="170"
CalendarWidth="250"
ButtonStyle="Brush"
DateFormat="ddMMyyyy"
IsCheckable="False"
IsChecked="False"
IsReadOnly="False"
Height="24"
Background="White"
Style="{StaticResource DatePicker}"
SelectedDate="{Binding Date, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
Loaded="Dpk_Start_Loaded"></dpk:DatePicker></DataTemplate></dg:DataGridTemplateColumn.CellTemplate></dg:DataGridTemplateColumn><dg:DataGridTemplateColumn Width="*" Header="{x:Static tfProUIStrings:TFProUIStrings.Description}"><dg:DataGridTemplateColumn.CellTemplate><DataTemplate><TextBox MaxLength="50"><TextBox.Style><Style TargetType="{x:Type TextBox}"><Style.Triggers><Trigger Property="Validation.HasError" Value="True"><Setter Property="Background" Value="Pink"/><Setter Property="ToolTip" Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors).CurrentItem.ErrorContent}"/></Trigger></Style.Triggers></Style></TextBox.Style><TextBox.Text><Binding Path="DisplayName" Mode="TwoWay" ValidatesOnDataErrors="True" UpdateSourceTrigger="PropertyChanged"><Binding.ValidationRules><vr:CellDataInfoValidationRule ValidationStep="UpdatedValue" /></Binding.ValidationRules></Binding></TextBox.Text></TextBox></DataTemplate></dg:DataGridTemplateColumn.CellTemplate></dg:DataGridTemplateColumn><!-- Save--><dg:DataGridTemplateColumn Width="Auto" Header=""><dg:DataGridTemplateColumn.CellTemplate><DataTemplate><Button Command="{Binding DataContext.SaveCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"
CommandParameter="{Binding}"
Height="Auto"
Width="Auto"
Style="{StaticResource MouseOverHandStyle}"
Margin="2,2,2,2"><Button.Template><ControlTemplate TargetType="{x:Type Button}"><Image ToolTip="{x:Static tfProUIStrings:TFProUIStrings.DaySave}"
Width="16"
Height="16"
Source="{Binding DataContext.ImageSaveSymbol, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Image></ControlTemplate></Button.Template></Button></DataTemplate></dg:DataGridTemplateColumn.CellTemplate></dg:DataGridTemplateColumn><!-- Delete--><dg:DataGridTemplateColumn Width="Auto" Header=""><dg:DataGridTemplateColumn.CellTemplate><DataTemplate><Button Command="{Binding DataContext.DeleteEntryCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"
CommandParameter="{Binding}"
Height="Auto"
Width="Auto"
Style="{StaticResource MouseOverHandStyle}"
Margin="2,2,2,2"><Button.Template><ControlTemplate TargetType="{x:Type Button}"><Image ToolTip="{x:Static tfProUIStrings:TFProUIStrings.MenuDeleteDay}"
Width="16"
Height="16"
Source="{Binding DataContext.ImageDeleteSymbol, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"></Image></ControlTemplate></Button.Template></Button></DataTemplate></dg:DataGridTemplateColumn.CellTemplate></dg:DataGridTemplateColumn></dg:DataGrid.Columns></dg:DataGrid></DockPanel></DataTemplate></Expander.ContentTemplate></Expander></DataTemplate></ListBox.ItemTemplate></ListBox></DataTemplate></Expander.ContentTemplate></Expander></DataTemplate></ListBox.ItemTemplate></ListBox></DockPanel>The first ItemsSource Comunities contains Comunity Objs they do contains an Array of Years (ItemSource Level 2) and all Year Obj have a Array of Days (ItemsSource - Level 3)
ItemSource - Structure:
1. Comunities
---> 2. Years
--------> 3. Days
How can i optimize the Performance of this nested Accordion ?
Thx