Binding 1000usercontrols to listbox is slow wpf

Question

I am having a listbox to which i am binding around 1000usercontrols with itemspaneltemplate as grid and i am placing each usercontrol by specifying rows and columns which is working fine. But problem is it takes too much of time to load i even used backgroundworker process also but also no use. Please help me what is the solution for the above problem.


<ListBox VerticalAlignment="Top" ItemsSource="{Binding Session.LstPlannedLightChkEntity,ElementName=uc, IsAsync=True}"  Grid.Row="0" 
                               VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.VirtualizationMode="Recycling"
                              local:DragDropHelper.IsDragSource="true" local:DragDropHelper.IsDropTarget="true" 
                              local:DragDropHelper.DragDropTemplate="{StaticResource planetTemplateDrag}"  
                              ScrollViewer.VerticalScrollBarVisibility="Hidden" ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
                              ScrollViewer.CanContentScroll="True"  
                            >
  <ListBox.ItemContainerStyle>
    <Style TargetType="ListBoxItem">
      <Setter Property="Grid.Row" Value="{Binding Row}"/>
      <Setter Property="Grid.Column" Value="{Binding Column}"/>
      <Setter Property="Grid.ColumnSpan" Value="{Binding ColumnSpan}" />
    <Style.Resources>
    <!-- Background of selected item when focussed -->
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/>
    <!-- Background of selected item when not focussed -->
    <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" />
      </Style.Resources>
    </Style>
  </ListBox.ItemContainerStyle>
  <ListBox.ItemsPanel>
    <ItemsPanelTemplate>
      <local:GridControl x:Name="gcMenuPlanned" VerticalAlignment="Stretch"  Margin="-1,-1,0,0"
         ShowCustomGridLines="True" GridLineBrush="#FFE4E7EB" GridLineThickness="0.5" SnapsToDevicePixels="True">
        <local:GridControl.ContextMenu>
        <ContextMenu >
          <MenuItem Foreground="Black"  Header="Add Task" Click="AddTask_Click" Tag="{Binding CheckType}"  />
          <MenuItem Foreground="Black"  Header="Goto..."  Click="miGoto_Click" Tag="{Binding CheckType}"  />
        </ContextMenu>
      </local:GridControl.ContextMenu>
    </local:GridControl>
  </ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
  <DataTemplate>
    <local:LightFCCheckBlockControl  CheckColor="#FFA2CAEB" MouseLeftButtonDown="LightFCCheckBlockControl_MouseLeftButtonDown">
      <local:LightFCCheckBlockControl.ContextMenu>
        <ContextMenu >
          <MenuItem Foreground="Black"  Header="Edit" Click="miEdit_Click" Tag="{Binding CheckType}" Visibility="{Binding Path=OpacityForCCheck,Converter={StaticResource opacityToVisibility}}"/>
          <MenuItem Foreground="Black" Style="{StaticResource MenuItemBindingStyle }"  Click="miFreeze_Click" Tag="{Binding CheckType}" Visibility="{Binding Path=OpacityForCCheck,Converter={StaticResource opacityToVisibility}}">
          </MenuItem>
          <MenuItem Foreground="Black" Click="RemoveChecks_Click"  Header="Remove Checks" Tag="{Binding CheckType}"/>
          <MenuItem Foreground="Black" Click="DeleteChecks_Click"  Header="Delete Checks" Tag="{Binding CheckType}" Visibility="{Binding Path=OpacityForCCheck,Converter={StaticResource opacityToVisibility}}"/>
          <MenuItem Foreground="Black"  Header="Goto..."  Click="miGoto_Click" Tag="{Binding CheckType}" Visibility="{Binding Path=OpacityForCCheck,Converter={StaticResource opacityToVisibility}}"/>
        </ContextMenu>
      </local:LightFCCheckBlockControl.ContextMenu>
    </local:LightFCCheckBlockControl>
  </DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

Thanks Yogaraj I

Related: https://stackoverflow.com/q/4563856/6131611 – Pavel May 24 '20 at 18:43 — Pavel, May 24 '20 at 18:43

score 0 · Answer 1 · answered Jan 21 '13 at 13:11

0

Well it sounds a bit odd. First of all, you should answer the question...Is it really necessary to bind 1000 items to a list, which should be shown in UI? The usability would not be the best. Perhaps you could choose an approach with deferred loading.

Second, did you disable the Virtualization in the ListBox? Usually, there are only rendered the visuals for the elements, which are visible. The controls will be reused in case of scrolling.

answered Jan 21 '13 at 13:11

DHN

4,807
3
31
45

Yes i disabled VirtualizingStackPanel because i want listbox background as grid so that i can place my items accordingly.Its like a gantt chart. – Yogaraj Jan 21 '13 at 13:19
@Yogaraj I don't understand, sorry. Can you please illustrate your intention? – DHN Jan 21 '13 at 13:21
I have disabled VirtualizingStackPanel and in place of that i added Grid which helps me to add the usercontrols inside the listbox to specified row and column of the grid. So now i am binding observablecollection to the listbox itemssource. – Yogaraj Jan 21 '13 at 13:26
@Yogaraj Ok, and you're rendering thousand elements at the same time, because they all are visible? What does the underlying viewmodel look like? – DHN Jan 21 '13 at 13:34
if i bind 1000usercontrols with only few properties lets say around 5properties per usercontrol then listbox loads with in 5secs and sometimes even lesser then that, but with around 50properties and converters for around 10properties it takes around 55secs. so is the problem lies in loading too many controls or it is problem with binding too many properties to the usercontrol. – Yogaraj Jan 21 '13 at 13:40
@Yogaraj Exactly, I'm only trying to find out, why you have chosen this approach. Disabling the `Virtualization` is not a good idea in the most cases. So if we know the `ViewModel` we may find a better approach. Probably, there might be another cause. Do you controls contain `DropShadows`or `OpacitityMasks`? Both are causing a poor render performance, at least in WPF 3.5. I'm not sure about newer versions. – DHN Jan 21 '13 at 13:47
If it's taking 55 sec to load the problem is most likely not with the WPF rendering but more likely either some Bindings or Converters are slow. You should check to make sure you're not doing anything like on-demand database access or doing calculations involving lots of loops. – John Bowen Jan 21 '13 at 14:13
I have added the XAML code please have a look at it and let me know where i am going wrong. – Yogaraj Jan 21 '13 at 14:14
@JohnBowen You're right. Yogaraj, I can only suggest, that you reconsider your approach. From what I'm seeing, I'm assuming that you're relatively new to WPF, probably. So please have a look into articles about MVVM and strategies of handling a large amount of data. Rendering 1000 elements should not be necessary, because they cannot be visible at the same time. Otherwise, the UI should be redesigned. – DHN Jan 21 '13 at 14:22
my usercontrols are like rectangles on my screen i can show atleast 400usercontrols with lot of properties binding to the usercontrol. – Yogaraj Jan 21 '13 at 14:28

Binding 1000usercontrols to listbox is slow wpf

1 Answers1