Procedura: migliorare le prestazioni di un controllo TreeView

Aggiornamento: Luglio 2008

Se un controllo TreeView contiene molti elementi, il tempo necessario perché venga caricato può comportare un notevole ritardo nell'interfaccia utente. Per migliorare i tempi di caricamento, impostare la proprietà associata VirtualizingStackPanel.IsVirtualizing su true. Sono inoltre possibili lentezze dell'interfaccia utente quando un utente scorre il controllo TreeView agendo sulla rotellina del mouse o trascinando il cursore di una barra di scorrimento. È possibile migliorare le prestazioni di TreeView quando l'utente scorre la visualizzazione impostando la proprietà associata VirtualizingStackPanelVirtualizationMode() su Recycling.

Esempio

Descrizione

Nell'esempio seguente viene creato un controllo TreeView in cui la proprietà VirtualizingStackPanel.IsVirtualizing viene impostata su true e la proprietà VirtualizingStackPanelVirtualizationMode() su Recycling per ottimizzare le prestazioni.

Code

<StackPanel>
  <StackPanel.Resources>
    <src:TreeViewData x:Key="dataItems"/>


    <HierarchicalDataTemplate DataType="{x:Type src:ItemsForTreeView}"
                              ItemsSource="{Binding Path=SecondLevelItems}">

      <!--Display the TopLevelName property in the first level.-->
      <TextBlock Text="{Binding Path=TopLevelName}"/>
      
      <!--Display each string in the SecondLevelItems property in
          the second level.-->
      <HierarchicalDataTemplate.ItemTemplate>
          <DataTemplate>
              <TextBlock Text="{Binding}"/>
          </DataTemplate>
      </HierarchicalDataTemplate.ItemTemplate>
      
      <!--Set the foreground of the items in the second level
          to Navy.-->
      <HierarchicalDataTemplate.ItemContainerStyle>
        <Style TargetType="TreeViewItem">
          <Setter Property="Foreground" Value="Navy"/>
        </Style>
      </HierarchicalDataTemplate.ItemContainerStyle>  
    </HierarchicalDataTemplate>
  </StackPanel.Resources>

  <TreeView Height="200" ItemsSource="{Binding Source={StaticResource dataItems}}"
            VirtualizingStackPanel.IsVirtualizing="True"
            VirtualizingStackPanel.VirtualizationMode="Recycling">
    <TreeView.ItemContainerStyle>
      
      <!--Expand each TreeViewItem in the first level and 
          set its foreground to Green.-->
      <Style TargetType="TreeViewItem">
        <Setter Property="IsExpanded" Value="True"/>
        <Setter Property="Foreground" Value="Green"/>
      </Style>
    </TreeView.ItemContainerStyle>
  </TreeView>
</StackPanel>

Nell'esempio seguente vengono illustrati i dati utilizzati nell'esempio precedente.

public class TreeViewData : ObservableCollection<ItemsForTreeView>
{

    public TreeViewData()
    {
        for (int i = 0; i < 100; ++i)
        {
            ItemsForTreeView item = new ItemsForTreeView();
            item.TopLevelName = "item " + i.ToString();
            Add(item);
        }
    }
}


public class ItemsForTreeView
{
    public string TopLevelName { get; set; }
    private ObservableCollection<string> level2Items;

    public ObservableCollection<string> SecondLevelItems
    {
        get 
        {
            if (level2Items == null)
            {
                level2Items = new ObservableCollection<string>();
            }
            return level2Items;
        }
    }

    public ItemsForTreeView()
    {
        for (int i = 0; i < 10; ++i)
        {
            SecondLevelItems.Add("Second Level " + i.ToString());
        }
    }
}

Vedere anche

Concetti

Ottimizzazione delle prestazioni: controlli

Cronologia delle modifiche