Condividi tramite

Procedura: creare controlli TreeView semplici o complessi

  • Articolo

In questo esempio viene illustrato come creare controlli semplici o complessi TreeView .

Un TreeView oggetto è costituito da una gerarchia di TreeViewItem controlli, che può contenere stringhe di testo semplici e anche contenuto più complesso, ad esempio Button controlli o un StackPanel oggetto con contenuto incorporato. È possibile definire in modo esplicito il TreeView contenuto o un'origine dati può fornire il contenuto. In questo argomento vengono forniti esempi di questi concetti.

Esempio

La Header proprietà dell'oggetto TreeViewItem contiene il contenuto visualizzato dall'oggetto TreeView per tale elemento. Un TreeViewItem oggetto può anche avere TreeViewItem controlli come elementi figlio ed è possibile definire questi elementi figlio usando la Items proprietà .

Nell'esempio seguente viene illustrato come definire TreeViewItem in modo esplicito il contenuto impostando la Header proprietà su una stringa di testo.

<TreeView>
  <TreeViewItem Header="Employee1">
    <TreeViewItem Header="Jesper"/>
    <TreeViewItem Header="Aaberg"/>
    <TreeViewItem Header="12345"/>
  </TreeViewItem>
 <TreeViewItem Header="Employee2">
    <TreeViewItem Header="Dominik"/>
    <TreeViewItem Header="Paiha"/>
    <TreeViewItem Header="98765"/>
  </TreeViewItem>
</TreeView>

Nell'esempio seguente viene illustrato come definire gli elementi figlio di un TreeViewItem oggetto definendo Items controlli Button .

<TreeView>
  <TreeViewItem Header ="Employee1">
    <TreeViewItem.Items>
      <Button>Jesper</Button>
      <Button>Aaberg</Button>
      <Button>12345</Button>
    </TreeViewItem.Items>
  </TreeViewItem>
  <TreeViewItem Header="Employee2">
    <TreeViewItem.Items>
      <Button>Dominik</Button>
      <Button>Paiha</Button>
      <Button>98765</Button>
    </TreeViewItem.Items>
  </TreeViewItem>
</TreeView>

Nell'esempio seguente viene illustrato come creare un oggetto TreeView in cui fornisce XmlDataProviderTreeViewItem contenuto e un HierarchicalDataTemplate oggetto definisce l'aspetto del contenuto.

<XmlDataProvider x:Key="myEmployeeData" XPath="/EmployeeData">
  <x:XData>
    <EmployeeData xmlns="">
      <EmployeeInfo>
        <EmployeeInfoData>Employee1</EmployeeInfoData>
        <Item Type="FirstName">Jesper</Item>
        <Item Type="LastName">Aaberg</Item>
        <Item Type="EmployeeNumber">12345</Item>
      </EmployeeInfo>
      <EmployeeInfo>
        <EmployeeInfoData>Employee2</EmployeeInfoData>
        <Item Type="FirstName">Dominik</Item>
        <Item Type="LastName">Paiha</Item>
        <Item Type="EmployeeNumber">98765</Item>
      </EmployeeInfo>
    </EmployeeData>
  </x:XData>
</XmlDataProvider>

<HierarchicalDataTemplate DataType="EmployeeInfo" 
  ItemsSource ="{Binding XPath=Item}">
  <TextBlock Text="{Binding XPath=EmployeeInfoData}" />
</HierarchicalDataTemplate>

<TreeView ItemsSource="{Binding Source={StaticResource myEmployeeData}, 
  XPath=EmployeeInfo}"/>

Nell'esempio seguente viene illustrato come creare un oggetto TreeView in cui il TreeViewItem contenuto contiene DockPanel controlli con contenuto incorporato.

<TreeView>
  <TreeViewItem Header="Animals">
    <TreeViewItem.Items>
    <DockPanel>
      <Image Source="data\fish.png"/>
      <TextBlock Margin="5" Foreground="Brown"
                 FontSize="12">Fish</TextBlock>
    </DockPanel>
    <DockPanel>
      <Image Source="data\dog.png"/>
      <TextBlock Margin="5" Foreground="Brown"
                 FontSize="12">Dog</TextBlock>
    </DockPanel>
    <DockPanel>
      <Image Source="data\cat.png"/>
      <TextBlock Margin="5" Foreground="Brown"
                 FontSize="12">Cat</TextBlock>
    </DockPanel>
  </TreeViewItem.Items>
  </TreeViewItem>      
</TreeView>

Vedi anche