MemoryLeak with RadTreeView

6 posts, 0 answers
  1. Aleksandar
    Aleksandar avatar
    5 posts
    Member since:
    Aug 2008

    Posted 09 Sep Link to this post

    Hi,

    I'm trying to find reason of memory leak which occurs in data binding to RadTreeView.

    In data set there is 270 items, and I checked all DAO methods which are used for retrieving data, and during execution there is no memory increase, in moment

    when I fire PropertyChangeNotify memory starts to increase.

    Memory increase is about 70MB per each call.

    Also, it seems that virtualization doesn't work, because binding of this data takes about 1-2s.

    I'll put all relevant xaml files. In first snippet is file where we define RadTreeView, itemssource is HierarchyFolderList which holds individual items.

    Next is FolderTemplateSelector... The most complicated is last one in which defined style "SecureItemsListBoxStyle" in which RadDropDownButton is referenced also. It is a lot of code but I wanted to show everything that is related in order to give more details for troubleshooting.

    Is there some potential places where memory leak could occur? I tryed to remove some parts of SecureItemsListBoxStyle, but didn' get any success.

    <telerik:RadTreeView x:Name="treeView" ItemsSource="{Binding HierarchyFolderList}"
    ItemTemplateSelector="{StaticResource FolderTemplateSelector}"  AllowDrop="True" ScrollViewer.HorizontalScrollBarVisibility="Disabled" Margin="5" IsDropPreviewLineEnabled="False" IsVirtualizing="True"  telerik:TreeViewPanel.IsVirtualizing="True"
    telerik:AnimationManager.IsAnimationEnabled="False"                              telerik:TreeViewPanel.TreeVirtualizationMode="Hierarchical"   >

    <myHelpers:TreeDataTemplateSelector x:Key="FolderTemplateSelector" FolderTemplate="{StaticResource HierarchicalTemplate}" myListTemplate="{StaticResource ListOfItems}"  />
    <HierarchicalDataTemplate x:Key="HierarchicalTemplate"
    ItemsSource="{Binding ChildList}"  >
    <StackPanel Orientation="Horizontal"
    Tag="{Binding DataContext.FolderActions, RelativeSource={RelativeSource AncestorType={x:Type telerik:RadTreeView}}}">
    <TextBlock FontSize="12" FontWeight="Bold"  Text="{Binding FolderName,Converter={StaticResource StringToUppercase}}" />
    <TextBlock FontSize="12" FontWeight="Bold"  Text=" (" />
    <TextBlock FontSize="12" FontWeight="Bold"  Text="{Binding Count}" />
    <TextBlock FontSize="12" FontWeight="Bold"  Text=")" />
    <Image Visibility="{Binding Shared, Converter={StaticResource BoolToVisibility}}"
    Margin="5 0"  Grid.Column="4"   Height="12" Style="{DynamicResource SharedIconStyle}"/>
    </StackPanel>
    </HierarchicalDataTemplate>

     

    <DataTemplate x:Key="ListOfItems">
               <StackPanel Orientation="Vertical"
                           Margin="{Binding RelativeSource={RelativeSource AncestorType={x:Type telerik:RadTreeViewItem}},Converter={StaticResource NodeLevelToMargine}}">
                    
                   <Rectangle Fill="{DynamicResource LightGrayTextForegroundColor}"
                              Height="1"
                              Margin="0 0 0 5"
                              HorizontalAlignment="Stretch" />
                    
                  <ListBox x:Name="secureItemsList"
                            ItemsSource="{Binding SecureList}"
                            Style="{DynamicResource SecureItemsListBoxStyle}"                       
                            behaviors:ListBoxDragDropBehavior.IsEnabled="True"    helpers:ListBoxSelector.Enabled="False"             
                            helpers:ListBoxHelper.SelectedItems="{Binding SelectedItems,Mode=TwoWay}">
                  
                   </ListBox>
               </StackPanel>
     
           </DataTemplate>

    <Style x:Key="SecureItemsListBoxStyle" TargetType="{x:Type ListBox}" >
            <Setter Property="ContextMenu" Value="{x:Null}" />
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="SelectionMode" Value="Extended"/>
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
            <Setter Property="ItemContainerStyle" Value="{StaticResource SIWithContextMenuListBoxItemStyle}"/>
            <Setter Property="VirtualizingStackPanel.IsVirtualizing" Value="True" />
            <Setter Property="VirtualizingStackPanel.VirtualizationMode" Value="Recycling" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBox}">
                        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="1" SnapsToDevicePixels="true">
                            <ScrollViewer Focusable="false" Padding="{TemplateBinding Padding}">
                                <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                            </ScrollViewer>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <DataTrigger Binding="{Binding DataContext.IsTileView,RelativeSource={RelativeSource FindAncestor,  AncestorType={x:Type telerik:RadTreeView}}}" Value="True">
                    <Setter Property="ItemsPanel">
                        <Setter.Value>
                            <ItemsPanelTemplate >
                                <WrapPanel Orientation="Horizontal" IsItemsHost="True"/>
                            </ItemsPanelTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding DataContext.IsTileView,RelativeSource={RelativeSource FindAncestor,  AncestorType={x:Type telerik:RadTreeView}}}" Value="False">
                    <Setter Property="ItemsPanel">
                        <Setter.Value>
                            <ItemsPanelTemplate >
                                <VirtualizingStackPanel  />
                            </ItemsPanelTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
     
                 <!--<DataTrigger Binding="{Binding DataContext.IsTileView,RelativeSource={RelativeSource FindAncestor,  AncestorType={x:Type telerik:RadTreeView}}}" Value="True">
                    <Setter Property="ItemTemplate" Value="{DynamicResource TileSecureItemTemplate}" />
                </DataTrigger>
                <DataTrigger Binding="{Binding DataContext.IsTileView,RelativeSource={RelativeSource FindAncestor,  AncestorType={x:Type telerik:RadTreeView}}}" Value="False">
                    <Setter Property="ItemTemplate" Value="{DynamicResource ListSecureItemTemplate}" />
                </DataTrigger>-->
     
                <DataTrigger Binding="{Binding DataContext.IsTileView,RelativeSource={RelativeSource FindAncestor,  AncestorType={x:Type telerik:RadTreeView}}}" Value="True">
                    <Setter Property="ItemTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <Border x:Name="mainBorder" Width="142" BorderBrush="Transparent" BorderThickness="1" Margin="0,0,15,10" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                    <Grid  HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="75"/>
                                            <RowDefinition MinHeight="23" Height="auto" />
                                        </Grid.RowDefinitions>
                                        <Grid Background="{DynamicResource WhiteColor}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                            <Grid Background="{Binding Background}" Grid.Column="0"  Margin="5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"  >
                                                <Grid Visibility="{Binding IsWebSiteLogo,Converter={StaticResource InvertedBooleanToVisibility}}">
                                                <Image x:Name="dataImg"  Visibility="{Binding IsDefaultImage,Converter={StaticResource InvertedBooleanToVisibility}}"
                                Source="{Binding Image}" Stretch="Fill" >
                                                </Image>
                                                <Image   MaxHeight="50" VerticalAlignment="Center" Visibility="{Binding IsDefaultImage,Converter={StaticResource BoolToVisibility}}"
                                Source="{Binding Image}" Stretch="Uniform" >
                                                </Image>
                                                </Grid>
                                                <uc:WebSiteLogo Width="50" Height="50" FontSize="22" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5, 0.5"
                                                            URL="{Binding Name}" Brush="{Binding Background}" Visibility="{Binding IsWebSiteLogo,Converter={StaticResource BoolToVisibility}}"/>
     
                                            </Grid>
     
                                            <Image Margin="1" Visibility="{Binding Favorite, Converter={StaticResource BoolToVisibility}}" HorizontalAlignment="Left" VerticalAlignment="Top"
                                Source="{DynamicResource star_green_21x20}"  Width="17" Height="16"  ToolTip="{DynamicResource Favorite}"/>
     
                                            <Image Margin="1"  Visibility="{Binding Shared, Converter={StaticResource BoolToVisibility}}" Grid.Column="4"  Width="20" Height="16"
                                                   Style="{DynamicResource SharedIconStyle}" HorizontalAlignment="Right" VerticalAlignment="Top"/>
                                        </Grid>
     
                                        <Border x:Name="MouseOverBorder" Grid.RowSpan="2" Visibility="Collapsed" Opacity="0.45" Background="{DynamicResource MyAppGreenColor}"/>
     
                                        <TextBlock x:Name="txtName" VerticalAlignment="Top" HorizontalAlignment="Center" Grid.Row="1" Margin="0 5 0 0"
                                    Foreground="{DynamicResource LightGrayTextForegroundColor}" TextWrapping="Wrap" TextAlignment="Center"
                                    FontSize="10pt" FontWeight="Normal" MaxHeight="36"  LineStackingStrategy="BlockLineHeight" LineHeight="18"
                                    FontFamily="{DynamicResource ProximaRegular}" Text="{Binding Name}" />
     
                                        <StackPanel x:Name="MouseOverPanel"  Visibility="Collapsed" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0 25 0 0">
     
                                            <telerik:RadDropDownButton x:Name="settingsButton" Style="{DynamicResource RadDropDownButtonWithArowStyle}"
                                                       Grid.Column="1"  Margin="12 0" IsOpen="{Binding ShowItemMenu,Mode=TwoWay}"
                               BorderThickness="0">
                                                <telerik:RadDropDownButton.Content>
                                                    <Image Height="35" Width="35"  ContextMenu="{x:Null}" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality">
                                                        <Image.Style>
                                                            <Style TargetType="{x:Type Image}">
                                                                <Setter Property="Source" Value="{DynamicResource menu_green}"/>
                                                                <Style.Triggers>
                                                                    <Trigger Property="IsMouseOver" Value="True">
                                                                        <Setter Property="Source" Value="{DynamicResource menu_white}"/>
                                                                    </Trigger>
                                                                </Style.Triggers>
                                                            </Style>
                                                        </Image.Style>
                                                    </Image>
                                                </telerik:RadDropDownButton.Content>
                                                <telerik:RadDropDownButton.DropDownContent>
                                                    <ListBox ItemsSource="{Binding Actions}"
                                                             ItemContainerStyle="{DynamicResource SecureItemsListBoxItemStyle}" 
                                                             BorderThickness="0" >
                                                        <ListBox.ItemTemplate>
                                                            <DataTemplate>
                                                                <telerik:RadMenuItem Style="{DynamicResource RadMenuItemStyle}" Width="200"/>
                                                            </DataTemplate>
                                                        </ListBox.ItemTemplate>
                                                    </ListBox>
                                                </telerik:RadDropDownButton.DropDownContent>
                                            </telerik:RadDropDownButton>
     
                                            <Border   Margin="12 0" VerticalAlignment="Center" HorizontalAlignment="Center"
                               RenderOptions.BitmapScalingMode="HighQuality" Background="Transparent" Visibility="{Binding IsWebSite,Converter={StaticResource BoolToVisibility}}"
                               BorderThickness="0" Tag="{Binding DataContext,RelativeSource={RelativeSource Mode=Self}}">
                                                <Image Height="41" Width="41" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality">
                                                    <Image.Style>
                                                        <Style TargetType="{x:Type Image}">
                                                            <Setter Property="Source" Value="{DynamicResource open_site_green}"/>
                                                            <Style.Triggers>
                                                                <Trigger Property="IsMouseOver" Value="True">
                                                                    <Setter Property="Source" Value="{DynamicResource open_site_white}"/>
                                                                </Trigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </Image.Style>
                                                </Image>
                                                <Border.InputBindings>
                                                    <MouseBinding MouseAction="LeftClick" Command="{Binding DoubleClickCommand}" />
                                                </Border.InputBindings>
                                            </Border>
                                        </StackPanel>
                                    </Grid>
                                    <Border.InputBindings>
                                        <MouseBinding MouseAction="LeftDoubleClick" Command="{Binding DoubleClickCommand}" />
                                    </Border.InputBindings>
                                </Border>
                                <DataTemplate.Triggers>
                                    <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}, Mode=FindAncestor}}" Value="True">
                                        <Setter TargetName="mainBorder" Property="BorderBrush" Value="{DynamicResource MyAppGreenColor}"/>
                                        <Setter TargetName="mainBorder" Property="BorderThickness" Value="1"/>
                                    </DataTrigger>
                                    <Trigger Property="Border.IsMouseOver" Value="True">
                                        <Setter TargetName="MouseOverPanel" Property="Visibility" Value="Visible"/>
                                        <Setter TargetName="MouseOverBorder" Property="Visibility" Value="Visible"/>
                                        <Setter TargetName="txtName" Property="Foreground" Value="White"/>
                                    </Trigger>
                                </DataTemplate.Triggers>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
                <DataTrigger Binding="{Binding DataContext.IsTileView,RelativeSource={RelativeSource FindAncestor,  AncestorType={x:Type telerik:RadTreeView}}}" Value="False">
                    <Setter Property="ItemTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <Border x:Name="mainBorder" Margin="0" Padding="5 0 14 0" Height="51"  BorderThickness="1" BorderBrush="Transparent"
                    CornerRadius="2" Background="{DynamicResource WhiteColor}" HorizontalAlignment="Stretch">
                                    <Grid x:Name="gridlist" ContextMenu="{x:Null}"  HorizontalAlignment="Stretch" VerticalAlignment="Stretch"     Background="{DynamicResource WhiteColor}" UseLayoutRounding="True">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="auto"/>
                                            <ColumnDefinition Width="auto" />
                                            <ColumnDefinition MinWidth="280" Width="*"/>
                                            <ColumnDefinition Width="130"/>
                                            <ColumnDefinition Width="50"/>
                                            <ColumnDefinition  Width="50"/>
                                            <ColumnDefinition  Width="50"/>
                                            <ColumnDefinition  Width="50"/>
                                        </Grid.ColumnDefinitions>
     
                                        <Grid Background="{Binding Background}" Grid.Column="0"  Margin="0 0 12 0" HorizontalAlignment="Center" Width="90" Height="45"  VerticalAlignment="Center">
                                            <Grid Visibility="{Binding IsWebSiteLogo,Converter={StaticResource InvertedBooleanToVisibility}}">
                                            <Image x:Name="dataImg"  Visibility="{Binding IsDefaultImage,Converter={StaticResource InvertedBooleanToVisibility}}"
                                Source="{Binding Image}" Stretch="Fill" >
                                            </Image>
                                            <Image   MaxHeight="35" Width="90" Visibility="{Binding IsDefaultImage,Converter={StaticResource BoolToVisibility}}"
                                Source="{Binding Image}" Stretch="Uniform" VerticalAlignment="Center" >
                                            </Image>
                                            </Grid>
                                            <uc:WebSiteLogo Width="35" Height="35" FontSize="16" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5, 0.5"
                                                            URL="{Binding Name}" Brush="{Binding Background}" Visibility="{Binding IsWebSiteLogo,Converter={StaticResource BoolToVisibility}}"/>
     
     
                                        </Grid>
                                        <telerik:RadDropDownButton x:Name="settingsButton" Style="{DynamicResource RadDropDownButtonWithArowStyle}" Grid.Column="1" Height="30" Width="30" Margin="12 0" VerticalAlignment="Center" HorizontalAlignment="Center"
                               RenderOptions.BitmapScalingMode="HighQuality" Visibility="Hidden" Background="Transparent"
                               BorderThickness="0" IsOpen="{Binding ShowItemMenu,Mode=TwoWay}">
                                            <telerik:RadDropDownButton.Content>
                                                <Image Height="30" Width="30"  ContextMenu="{x:Null}" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality">
                                                    <Image.Style>
                                                        <Style TargetType="{x:Type Image}">
                                                            <Setter Property="Source" Value="{DynamicResource menu_grey}"/>
                                                            <Style.Triggers>
                                                                <Trigger Property="IsMouseOver" Value="True">
                                                                    <Setter Property="Source" Value="{DynamicResource menu_green}"/>
                                                                </Trigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </Image.Style>
                                                </Image>
                                            </telerik:RadDropDownButton.Content>
                                            <telerik:RadDropDownButton.DropDownContent>
                                                <ListBox ItemsSource="{Binding Actions}"             ItemContainerStyle="{DynamicResource SecureItemsListBoxItemStyle}"  BorderThickness="0" >
                                                    <ListBox.ItemTemplate>
                                                        <DataTemplate>
                                                            <telerik:RadMenuItem  HorizontalAlignment="Stretch" />
                                                        </DataTemplate>
                                                    </ListBox.ItemTemplate>
                                                </ListBox>
                                            </telerik:RadDropDownButton.DropDownContent>
                                        </telerik:RadDropDownButton>
                                        <!--</Border>-->
     
                                        <StackPanel x:Name="LeftPartOfItemGrid" Grid.Column="2" Background="Transparent" VerticalAlignment="Center" Margin="0 0 12 0" >
     
                                            <Grid Margin="3 0 0 0">
                                                <TextBlock x:Name="dataTb" HorizontalAlignment="Left" Width="260"
                                    Foreground="{DynamicResource MyAppBlackBackgroundColor}" TextWrapping="Wrap" TextAlignment="Left"
                                    Padding="0,0,0,0" VerticalAlignment="Bottom" FontSize="11pt" FontWeight="Bold"
                                    FontFamily="{DynamicResource ProximaRegular}" Text="{Binding Name}" />
                                                <TextBox x:Name="editDataTb" HorizontalAlignment="Left" Width="260" Margin="-4 0 0 0"
                                    Foreground="{DynamicResource MyAppBlackBackgroundColor}" TextWrapping="Wrap" TextAlignment="Left" Style="{DynamicResource TextBoxTemplate}" Grid.RowSpan="2"
                                    Padding="0" VerticalAlignment="Bottom" FontSize="11pt" FontWeight="Bold"
                                    FontFamily="{DynamicResource ProximaRegular}" Text="{Binding Name,Mode=TwoWay, UpdateSourceTrigger=LostFocus}" Visibility="Collapsed" >
                                                    <i:Interaction.Triggers>
                                                        <i:EventTrigger EventName="LostFocus">
                                                            <i:InvokeCommandAction  Command="{Binding Path=NameLostFocusCommand}" />
                                                        </i:EventTrigger>
                                                    </i:Interaction.Triggers>
                                                </TextBox>
                                            </Grid>
                                            <TextBlock x:Name="UsernameTextBlock" HorizontalAlignment="Left" TextAlignment="Left" Margin="3 2 0 0"
                                Foreground="{DynamicResource LightGrayTextForegroundColor}" Grid.Column="0" Grid.Row="2"
                                Padding="0,0,0,0" VerticalAlignment="Top" FontSize="10pt" FontWeight="Normal"   TextWrapping="Wrap"
                                FontFamily="{DynamicResource ProximaRegular}" Text="{Binding ListViewSecondName}" />
     
                                        </StackPanel>
     
                                        <Grid x:Name="lastUsedGrid"  HorizontalAlignment="Left" Grid.Column="3" Margin="0 0 12 0" Background="Transparent" Visibility="Collapsed" >
                                            <StackPanel VerticalAlignment="Center" Visibility="{Binding ShowLastModifiedDate,Converter={StaticResource InvertedBooleanToVisibility}}">
     
                                                <TextBlock HorizontalAlignment="Left" Visibility="{Binding IsWebSite,Converter={StaticResource BoolToVisibility}}" Foreground="{DynamicResource MyAppBlackBackgroundColor}" TextWrapping="Wrap" TextAlignment="Left"
                                    Padding="0,0,0,0" VerticalAlignment="Bottom" FontSize="10pt" FontWeight="Thin"
                                    FontFamily="{DynamicResource ProximaRegular}" Text="{DynamicResource LastUsedAndroidSort}" />
     
     
     
                                                <TextBlock  Visibility="{Binding IsWebSite,Converter={StaticResource BoolToVisibility}}" HorizontalAlignment="Left" TextAlignment="Left"
                                Foreground="{DynamicResource LightGrayTextForegroundColor}" Grid.Column="0" Grid.Row="2" 
                                Padding="0,2,0,0" VerticalAlignment="Top" FontSize="10pt" TextWrapping="Wrap" FontWeight="Thin"
                                FontFamily="{DynamicResource ProximaRegular}" Text="{Binding LastAcceessTime}" />
     
                                            </StackPanel>
                                            <StackPanel VerticalAlignment="Center"  Visibility="{Binding ShowLastModifiedDate,Converter={StaticResource BoolToVisibility}}">
     
                                                <TextBlock HorizontalAlignment="Left" Foreground="{DynamicResource MyAppBlackBackgroundColor}" TextWrapping="Wrap" TextAlignment="Left"
                                    Padding="0,0,0,0" VerticalAlignment="Bottom" FontSize="10pt" FontWeight="Thin"
                                    FontFamily="{DynamicResource ProximaRegular}" Text="{DynamicResource MenuLastModified}" />
     
                                                <TextBlock
                           HorizontalAlignment="Left" TextAlignment="Left"
                                Foreground="{DynamicResource LightGrayTextForegroundColor}" Grid.Column="0" Grid.Row="2" 
                                Padding="0,2,0,0" VerticalAlignment="Top" FontSize="10pt" TextWrapping="Wrap" FontWeight="Thin"
                                FontFamily="{DynamicResource ProximaRegular}" Text="{Binding LastModifiedDate,StringFormat='{}{0:MMM yyyy}'}" />
                                            </StackPanel>
                                        </Grid>
     
     
                                        <Image Visibility="{Binding Shared, Converter={StaticResource BoolToVisibility}}" x:Name="listBoxShare"  Margin="12 0"  Grid.Column="4"  Width="22" Height="18"
                                               Style="{DynamicResource SharedIconStyle}"/>
                                        <Image  Visibility="{Binding Favorite, Converter={StaticResource BoolToVisibility}}" Grid.Column="5" Margin="12 0" x:Name="favoritesGridImage" Source="{DynamicResource star_green_21x20}"  Width="21" Height="20" VerticalAlignment="Center" HorizontalAlignment="Center"  ToolTip="{DynamicResource Favorite}"/>
                                        <Image Visibility="{Binding HasNote, Converter={StaticResource BoolToVisibility}}" x:Name="notesGridImage" Margin="12 0"  Grid.Column="6"  ToolTip="{DynamicResource Notes}" Source="{DynamicResource imgNotes}" Width="17" Height="20" />
     
                                        <Border x:Name="DeleteImageBorder" Visibility="Hidden" Margin="12 -1 12 0" Grid.Column="7" Background="Transparent" Cursor="Hand">
                                            <Border Height="26" Width="26" BorderBrush="{DynamicResource LightGrayTextForegroundColor}" >
                                                <i:Interaction.Triggers>
                                                    <i:EventTrigger EventName="MouseLeftButtonUp">
                                                        <i:InvokeCommandAction Command="{Binding DeleteItemCommand}" CommandParameter="{Binding Id}" />
                                                    </i:EventTrigger>
                                                </i:Interaction.Triggers>
                                                <Border.Style>
                                                    <Style>
                                                        <Setter Property="Border.BorderThickness" Value="0"/>
                                                        <Style.Triggers>
                                                            <Trigger Property="Border.IsMouseOver" Value="True">
                                                                <Setter Property="Border.BorderThickness" Value="1"/>
                                                            </Trigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </Border.Style>
                                                <Image HorizontalAlignment="Center" VerticalAlignment="Center" Height="20" Width="20" Source="{DynamicResource imgTrashMedium}" RenderOptions.BitmapScalingMode="HighQuality"  ToolTip="{DynamicResource Delete}" />
                                            </Border>
                                        </Border>
                                    </Grid>
                                    <Border.InputBindings>
                                        <MouseBinding MouseAction="LeftDoubleClick" Command="{Binding DoubleClickCommand}" />
                                    </Border.InputBindings>
                                </Border>
                                <DataTemplate.Triggers>
                                    <DataTrigger Binding="{Binding IsMouseOver, ElementName=mainBorder}" Value="True">
                                        <Setter Property="Visibility" TargetName="settingsButton" Value="Visible"/>
                                        <Setter Property="Visibility" TargetName="DeleteImageBorder" Value="Visible" />
                                        <Setter Property="Visibility" TargetName="settingsButton" Value="Visible" />
                                        <Setter Property="Visibility" TargetName="lastUsedGrid" Value="Visible" />
                                        <Setter Property="Border.BorderBrush" TargetName="mainBorder"  Value="{DynamicResource MyAppGreenColor}" />
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding IsMouseOver, ElementName=dataTb}" Value="True">
                                        <Setter Property="Visibility" TargetName="editDataTb" Value="Visible"/>
                                        <Setter Property="Visibility" TargetName="dataTb" Value="Collapsed"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding IsMouseOver, ElementName=editDataTb}" Value="True">
                                        <Setter Property="Visibility" TargetName="dataTb" Value="Collapsed"/>
                                        <Setter Property="Visibility" TargetName="editDataTb" Value="Visible"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType={x:Type ListBoxItem}, Mode=FindAncestor}}" Value="True">
                                        <Setter TargetName="mainBorder" Property="BorderBrush" Value="{DynamicResource MyAppGreenColor}"/>
                                        <Setter TargetName="mainBorder" Property="BorderThickness" Value="1"/>
                                    </DataTrigger>
                                </DataTemplate.Triggers>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
            </Style.Triggers>
       
        </Style>
  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 13 Sep Link to this post

    Hello Aleksandar,

    In general, UI virtualization works when the control in question have a fixed Height set or when it is in panel which is not measured with infinity. For example, ScrollViewer, StackPanel and Grid with Row.Height=Auto or Column.Width=Auto will measure it in that way. You can place the RadTreeView in RowDefinition with Height="*" instead or set some Height like 300 / 400 / 500 etc.

    Once you set up this, the virtualization should improve the performance and minimize the initial memory used. Then you can test both Hierarchical and Recycling mode which performs better in your scenario. In an average big tree with many levels and many items in every level, the Recycling mode should perform better.

    Regards,
    Petar Mladenov
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. UI for WPF is Visual Studio 2017 Ready
  4. Aleksandar
    Aleksandar avatar
    5 posts
    Member since:
    Aug 2008

    Posted 13 Sep in reply to Petar Mladenov Link to this post

    Thanks for you reply Petar...

    It is already defined as you described, so even with RowDefinition Height = auto we experience issues.

    Here is whole part:

    <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
                <Button x:Name="showAllBtn" Margin="0 10 30 0" HorizontalAlignment="Right" Visibility="{Binding ShowAllBtn,Converter={StaticResource BoolToVisibility}}"
                        Style="{DynamicResource BlueSettingsButton}" Content="{DynamicResource ShowAll}" Command="{Binding ShowAllFoldersCommand}"/>
                <ScrollViewer CanContentScroll="True" Grid.Row="1" PreviewMouseWheel="ScrollViewer_PreviewMouseWheel">
                <Grid  >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <telerik:RadTreeView x:Name="treeView" ItemsSource="{Binding HierarchyFolderList}"
                                 ItemTemplateSelector="{StaticResource FolderTemplateSelector}"  AllowDrop="True" ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                                  Margin="5" IsDropPreviewLineEnabled="False" IsVirtualizing="True"  telerik:TreeViewPanel.IsVirtualizing="True" telerik:AnimationManager.IsAnimationEnabled="False"
                                     telerik:TreeViewPanel.TreeVirtualizationMode="Hierarchical"   >          
                </telerik:RadTreeView>
                </Grid>
            </ScrollViewer>       
        </Grid>

  5. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 14 Sep Link to this post

    Hello Aleksandar,

    In your scenario , the Tree is in single-row Grid which is in Auto-row Grid with two Rows. This is the same as Tree in Auto -row Grid. But in order to kick in, the virtualization needs panels which do not measure with infinity - for example *-sized row.

    You can check the test application which uses setup similar to yours.

    Variant 1)
    <Grid.RowDefinitions>
               <RowDefinition Height="*"/>
               <RowDefinition Height="*"/>
           </Grid.RowDefinitions>
     
           <Grid>
               <Grid.RowDefinitions>
                   <RowDefinition Height="*"/>
               </Grid.RowDefinitions>
     
               <telerik:RadTreeView IsVirtualizing="True"
    This way treeview gets half of the WPF Window Height , you see the tree's scrollviewer and ItemPrepared fires for example 26 times (but the root level items are 100) - the virtualization works.

    Variant 2 (your setup)
    <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
     
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
     
                <telerik:RadTreeView IsVirtualizing="True"
    This way the treeview gets the entire window height, there is no scrollviewer and the ItemPrepared event fires 100 times - the virtualization does not work.

    Regards,
    Petar Mladenov
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  6. Aleksandar
    Aleksandar avatar
    5 posts
    Member since:
    Aug 2008

    Posted 15 Sep in reply to Petar Mladenov Link to this post

    Hi Petar,

    I have tried with this one without success: :(

    <Grid  >
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <ScrollViewer CanContentScroll="True" Grid.Row="1" PreviewMouseWheel="ScrollViewer_PreviewMouseWheel">
        <telerik:RadTreeView x:Name="treeView" ItemsSource="{Binding HierarchyFolderList}"
            ItemTemplateSelector="{StaticResource FolderTemplateSelector}"  AllowDrop="True" ScrollViewer.HorizontalScrollBarVisibility="Disabled"
            Margin="5" IsDropPreviewLineEnabled="False" IsVirtualizing="True"  telerik:TreeViewPanel.IsVirtualizing="True" telerik:AnimationManager.IsAnimationEnabled="False"
            telerik:TreeViewPanel.TreeVirtualizationMode="Hierarchical"   >          
        </telerik:RadTreeView>
    </ScrollViewer>       
    </Grid>

  7. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 19 Sep Link to this post

    Hello Aleksandar,

    Putting the TreeView / ListBox / GridView in ScrollViewer again breaks the virtualization unless you set Height on the Tree or on the ScrollViewer. This is expected behavior. 

    Is there any reason for using ScrollViewer to wrap the TreeView, actually the tree has built-in one in the template and you do not need external one.

    Regards,
    Petar Mladenov
    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for WPF is Visual Studio 2017 Ready