Gewusst wie: Verbessern der Leistung von TreeView

Aktualisiert: Juli 2008

Falls eine TreeView viele Elemente enthält, kann die Zeit, die zum Laden benötigt wird, zu einer erheblichen Verzögerung in der Benutzeroberfläche führen. Sie können die Ladezeit verbessern, indem Sie die angefügte VirtualizingStackPanel.IsVirtualizing-Eigenschaft auf true festlegen. Die Reaktion der Benutzeroberfläche kann auch langsam sein, wenn der Benutzer den Bildlauf von TreeView durch Bewegen des Mausrads oder Ziehen des Bildlauffelds ausführt. Die Leistung von TreeView wird verbessert, wenn der Benutzer einen Bildlauf durch Festlegen der angefügten VirtualizingStackPanelVirtualizationMode()-Eigenschaft auf Recycling ausführt.

Beispiel

Beschreibung

Im folgenden Beispiel wird eine TreeView erstellt, die zur Leistungsoptimierung VirtualizingStackPanel.IsVirtualizing auf wahr und VirtualizingStackPanelVirtualizationMode() auf Recycling festlegt.

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>

Im folgenden Beispiel werden die im vorherigen Beispiel verwendeten Daten veranschaulicht.

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());
        }
    }
}

Siehe auch

Konzepte

Optimieren der Leistung: Steuerelemente

Änderungsprotokoll

Date	Versionsgeschichte	Grund
Juli 2008	Hinzugefügtes Thema, um die neue Virtualisierung der Benutzeroberfläche und Containerwiederverwendungsfeatures darzustellen.	SP1-Featureänderung.