Обзор элемента управления "TreeView"

TreeView Управления предоставляет способ отображения данных в виде иерархической структуры с помощью сворачиваемых узлов. В данном разделе представлены TreeView и TreeViewItem элементы управления и обеспечивает простые примеры их использования.

Что такое элемент управления TreeView?

TreeView — ItemsControl , создает вложенные элементы с помощью TreeViewItem элементов управления. В следующем примере создается TreeView.

<TreeView Name="myTreeViewEvent" >
  <TreeViewItem Header="Employee1" IsSelected="True">
    <TreeViewItem Header="Jesper Aaberg"/>
    <TreeViewItem Header="Employee Number">
      <TreeViewItem Header="12345"/>
    </TreeViewItem>
    <TreeViewItem Header="Work Days">
      <TreeViewItem Header="Monday"/>
      <TreeViewItem Header="Tuesday"/>
      <TreeViewItem Header="Thursday"/>
    </TreeViewItem>
  </TreeViewItem>
  <TreeViewItem Header="Employee2">
    <TreeViewItem Header="Dominik Paiha"/>
    <TreeViewItem Header="Employee Number">
      <TreeViewItem Header="98765"/>
    </TreeViewItem>
    <TreeViewItem Header="Work Days">
      <TreeViewItem Header="Tuesday"/>
      <TreeViewItem Header="Wednesday"/>
      <TreeViewItem Header="Friday"/>
    </TreeViewItem>
  </TreeViewItem>
</TreeView>

Создание элемента управления TreeView

TreeView Управления содержит иерархию TreeViewItem элементов управления. Объект TreeViewItem элемент управления является HeaderedItemsControl с Header и Items коллекции.

При определении TreeView с помощью XAML, можно явно определить Header содержимое TreeViewItem управления и элементы, входящие в коллекцию. Этот способ был показан на предыдущем рисунке.

Можно также указать ItemsSource данных источника, а затем укажите HeaderTemplate и ItemTemplate для определения TreeViewItem содержимого.

Чтобы определить структуру TreeViewItem элемента управления, можно также использовать HierarchicalDataTemplate объектов. Дополнительные сведения и пример см. в разделе Использование свойств SelectedValue, SelectedValuePath и SelectedItem.

Если элемент не TreeViewItem элемента управления, он автоматически включается в TreeViewItem управления TreeView отображается элемент управления.

Развертывание и свертывание элемента TreeViewItem

Если пользователь разворачивает TreeViewItem, IsExpanded свойству true. Можно также развернуть или свернуть TreeViewItem без непосредственного участия пользователя, задав IsExpanded свойства true (развернуть) или false (свернуть). При изменении свойства, Expanded или Collapsed событием.

Когда BringIntoView вызывается метод TreeViewItem элемента управления, TreeViewItem и его родительским элементом TreeViewItem разверните элементы управления. Если TreeViewItem не является видимым или частично видимым, TreeView выполняет прокрутку, чтобы сделать его видимым.

Выбор элемента TreeViewItem

Когда пользователь щелкает TreeViewItem элемента управления, чтобы выбрать его, Selected происходит событие и его IsSelected свойству true. TreeViewItem Также становится SelectedItem из TreeView элемента управления. И наоборот, при изменении выбора из TreeViewItem элемента управления, его Unselected событием и его IsSelected свойству false.

SelectedItem Свойство TreeView элемент управления является свойством только для чтения; таким образом, нельзя задать явным образом. SelectedItem Свойство устанавливается в том случае, если пользователь щелкает TreeViewItem управления или когда IsSelected свойству true на TreeViewItem элемента управления.

Используйте SelectedValuePath свойство, чтобы указать SelectedValue из SelectedItem. Подробнее см. в разделе Использование свойств SelectedValue, SelectedValuePath и SelectedItem.

Вы можете зарегистрировать обработчик событий на SelectedItemChanged событий, чтобы определить, когда выбранный TreeViewItem изменения. RoutedPropertyChangedEventArgs<T> , Предоставляемый событию указывает обработчик OldValue, являющийся предыдущему выделению и NewValue, который является текущее выделение. Каждое из этих значений может быть равно null, если ни предыдущий, ни текущий выбор не были сделаны ни пользователем, ни в приложении.

Стиль элемента управления TreeView

Стиль по умолчанию для TreeView управления помещает его в StackPanel , содержащий ScrollViewer элемента управления. При задании Width и Height свойства TreeView, эти значения используются для размера StackPanel объекта, который отображает TreeView. Если отображаемого содержимого больше области отображения ScrollViewer автоматически отображает таким образом, пользователь сможет прокручивать TreeView содержимого.

Чтобы настроить внешний вид TreeViewItem , назначьте Style свойства пользовательского Style.

В следующем примере показано, как задать Foreground и FontSize значения свойств TreeViewItem элемента управления с помощью Style.

<Style TargetType="{x:Type TreeViewItem}">
  <Setter Property="Foreground" Value="Blue"/>
  <Setter Property="FontSize" Value="12"/>
</Style>

Добавление изображений и другого содержимого в элемент управления TreeView

Можно включить несколько объектов в Header содержимое TreeViewItem. Чтобы включить несколько объектов в Header содержимого, разместите объекты внутри элемента управления макета, такие как Panel или StackPanel.

В следующем примере показано определение Header из TreeViewItem как CheckBox и TextBlock , которые включены в DockPanel элемента управления.

<TreeViewItem>
  <TreeViewItem.Header>
    <DockPanel>
      <CheckBox/>
      <TextBlock>
        TreeViewItem Text
      </TextBlock>
    </DockPanel>
  </TreeViewItem.Header>
</TreeViewItem>

В следующем примере показано определение DataTemplate , содержащий Image и TextBlock , заключенные в DockPanel элемента управления. Можно использовать DataTemplate присвоить HeaderTemplate или ItemTemplate для TreeViewItem.

<DataTemplate x:Key="NewspaperTVItem">
  <DockPanel>
    <Image Source="images\icon.jpg"/>
    <TextBlock VerticalAlignment="center" Text ="{Binding Path=Name}"/>
  </DockPanel>
</DataTemplate>

См. также

• TreeView
• TreeViewItem
• Практические руководства
• Модель содержимого WPF