Massive memory leak when binding ItemsControl to an Observable Collection

2
votes

I have an ItemsControl in a ScrollViewer. The ItemsControl.ItemSource is set to the Observable Collection.

Every time I add an item to the collection, my application nearly doubles in memory usage and eventually after enough adds.

Here is a rough sketch:

<Scrollviewer Name="MyScroll">
  <ItemsControl Name="MyItemsControl">

        .....standard itemscontrol code here, using <StackPanel> as presenter (VirtualizingStackPanel did not change my problem, btw)
       .........

       ..DataTemplate has three textboxes and a textblock

  </ItemsControl>


Code:

Class MyScroll

   Dim myOBSCol as ObservableCollection(StudyUnit) 'studyunit is the core object of my application
                             'just holds a series of text properties as  Dependency Properties

   Sub New()
      'create studyunit objects
      For x as integer = 0 to 50
         Dim SU as new StudyUnit
         '.then I Set studyunit properties (i.e. Su.Text = "...", Su.IDNum = "2", etc...)
         OBSCol.add(SU)
      Next

    MyItemsControl.ItemsSource=myOBSCol
   End Sub

End Class

(Please forgive I can't reproduce my exact code. My code all compiles fine)

Using ANTS Memory Profiler, I can see all the class instances in my App. When I start the program, I have 150 instances of TextBox (There are three in the datatemplate). When I add a studyunit to the collection, I have 303. Adding another leaves me with 456... 609... etc.

The studyunit objects inherits from dependency objects and I am only binding to its dependency properties. I made the studyunit a series of dependency properties due to this article: http://support.microsoft.com/kb/938416, but it didn't fix anything.

Shucks!

Update 2/22/2010. Here is the actual code (code above was very simplified and created from memory)

Private Sub ObservableCollectionChanged(ByVal sender As Object, ByVal e As System.Collections.Specialized.NotifyCollectionChangedEventArgs)
    If e.Action = NotifyCollectionChangedAction.Remove Then 'q removed
        Dim oldDict As IList = e.OldItems
        If Not TryCast(oldDict(0), studyUnit) Is Nothing Then
            Try

            Catch ex As Exception

            End Try
        Else

        End If

    ElseIf e.Action = NotifyCollectionChangedAction.Add Then   'q added
        'FIND ITEM IN LIST WITH NEW ITEM ID
        Dim newQ As studyUnit
        newQ = e.NewItems(0)

        'set the location to provide focus after the new question is added
        focusIndex = _ObsCol.getObjPosition(newQ)
        Console.WriteLine("fi" + focusIndex.ToString)
    ElseIf e.Action = NotifyCollectionChangedAction.Reset Then 'list "reset"
        'call function that gives focus to the new control. (didn't affect memory issue when commented out'
            giveFocus(focusIndex)



    End If

'Code for creating a new StudyUnit and adding to ObservableCollection

Private Sub addNewQuestion(ByVal location As eInsertQuestion, ByRef sender As TextBox) 'business rule that new questions are created by pressing Enter in a special '"New quesiton" Textbox where you'd like the new Question to appear

 Dim sentText As TextBox = sender


    'get qid of sender from "tag" object of the sender textbox
    Dim senderQID As String = CInt(sentText.Tag)

    'find  this 'sender' question in the existing observable collection
    Dim senderQuestion As studyUnit
    For Each su As studyUnit In _ObsCol
        If su.QID = senderQID Then
            senderQuestion = su
            Exit For
        End If
    Next


    Dim newQuestionSortOrder As Integer
    If location = eInsertQuestion.Before Then
        newQuestionSortOrder = CInt(senderQuestion.sortOrder)  'will take over the sortorder of the previous question
    ElseIf location = eInsertQuestion.After Then
        'insert new question before
        newQuestionSortOrder = CInt(senderQuestion.sortOrder) + 1
    End If


    'create the new question
    Dim newQ As New studyUnit
    'new "sort order"
    newQ.sortOrder = CStr(newQuestionSortOrder)
    'new "displayed order"
    newQ.displayedOrder = generateNewQuestionDisplayedOrder(senderQuestion.displayedOrder) 'create a random question # for the new quesiton
    'set HID to the sender's HID
    newQ.HID = CStr(senderQuestion.HID)
    'set type to "Question"  //possibly not needed
    'newQ.Add("suType", eSUnitType.Question)





    'now send this studyunit to the database (then we can get its QID in the database)
    My.Application.dComm.insertQuestion(newQ)
    'set "NEW Q" = the exact data inserted in the database (as a best practice)
    newQ = Nothing
    newQ = My.Application.dComm.getNewestQuestionStudyUnit()


    'AddHandler newQ.studyUnitChangedEvent, AddressOf StudyUnitAltered


    'add to main question collection...
    'find position of sender question
    Dim senderIndex As Integer = Me._ObsCol.getObjPosition(senderQuestion)
    Dim newLocation As Integer = senderIndex + location  '("location" will be equal to +1 (after) or 0 (before)

    'insert before or after that one
    If newLocation < _ObsCol.Count Then
        _ObsCol.Insert(newLocation, newQ)
    Else
        _ObsCol.Add(newQ)  'can't "insert" if index is greater than the current size of the collection, use add function instead
    End If


    For x As Integer = newLocation + 1 To _ObsCol.Count - 1 'obscol is zero-based
        Dim thisQ As studyUnit = CType(_ObsCol(x), studyUnit)

        If thisQ.suType = eSUnitType.Question Then

            'increase each question's sort order by 1
            thisQ.sortOrder = CStr(CInt(thisQ.sortOrder) + 1)
        Else
            'else: do nothing, this study unit is a heading or section, does not get a change in sortOrder
        End If
    Next

'BELOW IS AN EXCELLENT DEMONSTRATION OF THE PROBLEM 'I attempt to reset the itemsource, but the DataTemplate instances do not get cleared from memory... even if the third line is commented. The itemscontrol will become empty, but all the datatemplate objects remain in memory.

    Me.SP_ItemsControl.ItemsSource = Nothing
    Me.SP_ItemsControl.Items.Clear()
    Me.SP_ItemsControl.ItemsSource = _ObsCol


End Sub

'Below are my datatemplates. These are chosen by a DataTemplateSelector:

<local:BindableRTBConverter x:Key="RTBConverter" />
<local:ColorConverter x:Key="myColorConverter"/>
<local:HeadingsNameConverter x:Key="myHeadingConverter"/>


<!-- Styles that can be used throughout all three datatemplates here-->

<Style x:Key="borderStyleSettings" TargetType="Border">
    <Setter Property="Border.Margin" Value="5,5,5,5"/>
    <Setter Property="Border.BorderBrush" Value="{Binding Source={StaticResource ApplicationUserSettings}, Path=borderColor, Converter={StaticResource myColorConverter}}" />
    <Setter Property="Border.BorderThickness" Value=".9"/>
    <Setter Property="Border.CornerRadius" Value="6"/>
</Style>


<Style x:Key="textStyleSettings" TargetType="TextBlock">
    <Setter Property="TextBlock.FontSize" Value="{Binding Source={StaticResource ApplicationUserSettings}, Path=fontSize}" />
    <Setter Property="TextBlock.TextWrapping" Value="Wrap" />
    <Setter Property="TextBlock.VerticalAlignment" Value="Center"/>
</Style>

<!--end of styles-->


<!--Section RN Template-->
<DataTemplate x:Key="RNSectionTemplate">
    <DataTemplate.Resources>

    </DataTemplate.Resources>

        <Border Tag="{Binding Path=SID, Mode=OneTime}" Style="{StaticResource borderStyleSettings}">
        <StackPanel>
            <TextBlock Margin="3,3,3,0" Foreground="Black" FontStyle="Italic" FontWeight="Bold" HorizontalAlignment="Center" Style="{StaticResource textStyleSettings}">
                 <TextBlock.Text> 
                       <MultiBinding Converter="{StaticResource myHeadingConverter}" 
                                     ConverterParameter="getRNSectionTitle" Mode="OneWay">
                           <Binding Path="num"/>
                           <Binding Path="name"/>
                       </MultiBinding>         
                    </TextBlock.Text>
            </TextBlock>       
        </StackPanel>
        </Border>


</DataTemplate>

<!--Heading RN Template-->
<DataTemplate x:Key="RNHeadingTemplate">
    <DataTemplate.Resources>

    </DataTemplate.Resources>

    <Border Tag="{Binding Path=HID, Mode=OneTime}" Style="{StaticResource borderStyleSettings}">
        <StackPanel>
            <TextBlock Margin="3,3,3,0" Foreground="Black" FontWeight="Bold" HorizontalAlignment="Left" Style="{StaticResource textStyleSettings}">
                 <TextBlock.Text> 
                       <MultiBinding Converter="{StaticResource myHeadingConverter}" 
                                     ConverterParameter="getRNHeadingTitle" Mode="OneWay">
                           <Binding Path="num"/>
                           <Binding Path="name"/>
                       </MultiBinding>         
                    </TextBlock.Text>
            </TextBlock>
        </StackPanel>
    </Border>
</DataTemplate>





<!--Question RN Template-->
<DataTemplate x:Key="RNQuestionTemplate">
    <DataTemplate.Resources>
        <Style TargetType="local:BindableRTB">
            <Setter Property="FontSize" Value="15"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="FontFamily" Value="{Binding Source={StaticResource ApplicationUserSettings}, Path=fontName}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <!--Sets changes container of textbox control from ScrollViewer to Adorner Decorator, as an attempt to
                        reduce the memory waste in "scrollbar" instances.  Didn't help much.  Also didn't impact my memory leak.-->
                    <ControlTemplate TargetType="{x:Type TextBoxBase}">
                        <Border 
                                  Name="Border"
                                  CornerRadius="0" 
                                  Padding="0"
                                  Background="White"
                                  BorderThickness="0"
                         >
                            <AdornerDecorator Margin="0" x:Name="PART_ContentHost"></AdornerDecorator>

                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style TargetType="TextBox">
            <Setter Property="FontSize" Value="15"/>
            <Setter Property="BorderThickness" Value="3"/>
            <Setter Property="FontFamily" Value="{Binding Source={StaticResource ApplicationUserSettings}, Path=fontName}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TextBoxBase}">
                        <Border 
                                  Name="Border"
                                  CornerRadius="0" 
                                  Padding="0"
                                  Background="White"
                                  BorderThickness="0"
                         >
                            <AdornerDecorator Margin="0" x:Name="PART_ContentHost"></AdornerDecorator>

                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style TargetType="TextBlock">
            <Style.Setters>
                <Setter Property="Foreground" Value="Purple"></Setter>
                <Setter Property="FontFamily" Value="{Binding Source={StaticResource ApplicationUserSettings}, Path=fontName}"/>
            </Style.Setters>
        </Style>

    </DataTemplate.Resources>

    <!-- Main border -->
    <Border Style="{StaticResource borderStyleSettings}">
        <Grid Name="myStack" HorizontalAlignment="Stretch"  Margin="4" Tag="{Binding Path=QID, Mode=OneTime}">
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition/>
                <RowDefinition/>

            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
               <!-- last column for controls to be added later, if wanted-->
            </Grid.ColumnDefinitions>


      <!--Row 0-->

            <!-- Displayed Order textbox (editable) -->
                <TextBox Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="1" IsTabStop="False" BorderThickness="0">
                    <TextBox.Text>
                        <Binding Path="displayedOrder"  Mode="TwoWay"  UpdateSourceTrigger="LostFocus"/>
                    </TextBox.Text>
                </TextBox>

            <!-- delete button -->
            <Ellipse  Grid.Column="2" Grid.Row="0" Tag="{Binding Path=QID, Mode=OneTime}" Name="ellipseDelete" Height="12" Width="12"  Stroke="Black" 
                      Fill="LightGray" Stretch="Fill" HorizontalAlignment="Right"></Ellipse>


      <!-- Row 1 -->

            <!-- Main text area -->
            <local:BindableRTB Name="myRTB" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2">
                <local:BindableRTB.Document>
                    <Binding Converter="{StaticResource RTBConverter}" Path="Question" Mode="TwoWay" UpdateSourceTrigger="LostFocus"/>
                </local:BindableRTB.Document>
            </local:BindableRTB>

            <!--Page Ref-->

            <TextBox Name="txtPageRef" Grid.Column="2" Grid.Row="1" Grid.ColumnSpan="1" IsTabStop="False">
                <TextBox.Text>
                    <Binding Path="pageRef"  Mode="TwoWay"  UpdateSourceTrigger="LostFocus"/>
                </TextBox.Text>
            </TextBox>

      <!-- Row 2 -->


            <!-- New question textbox -->
            <StackPanel Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3" HorizontalAlignment="Stretch">
                <StackPanel.Style>
                    <Style TargetType="StackPanel">
                        <Style.Setters>
                            <Setter Property="Background" Value="Transparent" />
                        </Style.Setters>
                        <Style.Triggers>
                            <Trigger Property="IsKeyboardFocusWithin" Value="True">
                                <Setter Property="Background" Value="LightGreen"/>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </StackPanel.Style>

                <!-- Binding the questions "QID" to the 'new quesiton' textbox.  For the bubbling  keydown event,
                This information can help determine where to insert the new question, and then give focus
                to that new question-->
                <TextBox Name="newQuestionTextBox" Tag="{Binding Path=QID, Mode=OneTime}" Background="Transparent" IsReadOnly="True" BorderThickness="0" FontSize="10" HorizontalAlignment="Left">
                    <TextBox.Style>
                        <Style TargetType="TextBox">
                            <Style.Triggers>
                                <Trigger Property="IsKeyboardFocused" Value="True">
                                    <Setter Property="FontStyle" Value="Italic"/>
                                    <Setter Property="Text" Value="(Start typing to create a new question. Press the ALT key to insert a new question above.)"/>
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </TextBox.Style>
                </TextBox>
            </StackPanel>

            <!-- Endof New question textbox -->

        </Grid>
    </Border>

</DataTemplate>
<!--End of reviewnote Templates-->

Data Template Selector

Imports System.Windows.Controls Imports System.Windows Public Class typeDataTemplateSelector Inherits DataTemplateSelector

Public Overrides Function SelectTemplate(ByVal item As Object, ByVal container As System.Windows.DependencyObject) As System.Windows.DataTemplate

    Dim sUnit As studyUnit = DirectCast(item, studyUnit)

    Dim mainWindow As R2_CoreWindow = CType(My.Application.MainWindow, R2_CoreWindow)

    If sUnit.suType = eSUnitType.Heading Then
        Return mainWindow.WpfEditor.FindResource("RNHeadingTemplate")
    ElseIf sUnit.suType = eSUnitType.Section Then

        Return mainWindow.WpfEditor.FindResource("RNSectionTemplate")

    ElseIf sUnit.suType = eSUnitType.Question Then
        Return mainWindow.WpfEditor.FindResource("RNQuestionTemplate")
    End If
End Function

End Class

'ItemsControl XAML

<!-- Scrollviewer_Keydown is looking for bubbling keydown event from New Quesitons-->

<ScrollViewer.Resources>
    <!-- Template selector for each Data Template -->
    <local:typeDataTemplateSelector x:Key="myTempSelector"></local:typeDataTemplateSelector>
</ScrollViewer.Resources>

<ItemsControl Name="SP_ItemsControl" ItemTemplateSelector="{StaticResource myTempSelector}">
    <!--Set the itemssource in code later-->
    <ItemsControl.Template>
        <ControlTemplate TargetType="ItemsControl">
            <ItemsPresenter/>
        </ControlTemplate>
    </ItemsControl.Template>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>

            <StackPanel></StackPanel>

            <!-- Use of virtualizingstackpanel didn't help -->
            <!--<VirtualizingStackPanel VirtualizingStackPanel.IsVirtualizing="True" VirtualizingStackPanel.VirtualizationMode="Recycling" />-->

        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

</ItemsControl>

StudyUnit (condensed... it's just the same thing repeated for 15+ diff properties)

Public Class studyUnit Inherits DependencyObject

Public Property Question() As String
    Get
        Return GetValue(QuestionProperty)
    End Get
    Set(ByVal value As String)
        SetValue(QuestionProperty, value)
    End Set
End Property
Public Shared QuestionProperty As DependencyProperty = DependencyProperty.Register("Question", GetType(String), _
    GetType(DependencyObject), New PropertyMetadata(Nothing, New PropertyChangedCallback(AddressOf OnQuestionPropertyChanged)))
Private Shared Sub OnQuestionPropertyChanged(ByVal d As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)

'not using this callback at the moment... Will place code here to talk to my database, which is the original source for my content End Sub 'all the other properties are set EXACTLY like the one above

2
.netwpfvb.netmemory-leaksitemscontrol
The problem's in your StudyUnit class, not in the code you've posted. – Robert Rossney
What problem could that be? It is is a dependencyObject that holds 17 different dependency properties. Each dependency property has a ref. to shared propertyChangdeCallback (i.e. "OnDocumentPropertyChanged")... nothing unusual...? – Matt H.
I think we might need to see some more code here. From the numbers, it looks like when you update the collection, you're not only adding the single new item, you're also adding all the existing items over again. Either that, or something in your template is causing problems; but binding ItemsControl to ObservableCollection is a pretty well-tested scenario by now, so I'd be surprised if any normal binding could cause this. But hard to offer details without seeing a bit more I'm afraid. – itowlson
Also for a business object like a StudyUnit it's usually recommended to implement it as a non-DependencyObject and implement INotifyPropertyChanged (option 2 in the KB article you linked). DependencyObjects are generally more for WPF objects that need to be binding targets; it's not required for binding sources. – itowlson
Ok I updated, hopefully the extra code is useful. Thanks for your help! – Matt H.

2 Answers

2
votes

All better!

The problem is with binding my observable collection to the ItemsSource property of my ItemsControl.

For whatever reason (and maybe someone can explain this), every time I add an item to the observable collection, the ItemsControl has to re-create all of the items in my list. This was resulting in very irregular memory issues (doubling sometimes, increasing slowly, or even descreasing with each item added).

Due to my requirements, I was able to accept the less-elegant solution of manually managing the Items collection. (I am able to keep each item's binding to a studyunit object without issue, which was the core need of my application.

To force changes in the ObservableCollection to update the UI, I simply needed to add this code (I've only shown the code necessary for ADDING a single item):

 Private Sub obscolchanged(ByVal sender As Object, ByVal e As System.Collections.Specialized.NotifyCollectionChangedEventArgs)


    If e.Action = NotifyCollectionChangedAction.Add Then   'q added
        Dim newSU As studyUnit

        newSU = e.NewItems(0)

        dim newIndex as Integer = _ObsCol.IndexOf(newSU)

        If newIndex < Me.ItemsControl.Items.Count
           Me.ItemsControl.Items.Insert(newIndex, newSU)
        Else
           'when newSU is the last item, simply add to the end of the collection, or you will get an IndexOutOfRange exception
           Me.ItemsControl.Items.Add(newSU)
        End If

     End If
End Sub

Similar code can be written to handle move events and deletion events. This obviously isn't as convenient as using the ItemsSource property, but I have experienced no Memory Issues, and adding an items is remarkably faster, because the ItemsControl does not have to regenerate each DataTemplate when I alter the Collection.

And thank you, ItemsControl, for absorbing nearly 40 hours when I scoped out 30 minutes :)

0
votes

the problem is on the framework, change the itemsource to datagrid or datagridview and all be working fine and faster