Share via


Comment : créer des arborescences simples ou complexes

Cet exemple montre comment créer des contrôles simples ou complexes TreeView .

Il TreeView se compose d’une hiérarchie de TreeViewItem contrôles, qui peut contenir des chaînes de texte simples et également du contenu plus complexe, tel que Button des contrôles ou un StackPanel contenu incorporé. Vous pouvez définir explicitement le TreeView contenu ou une source de données peut fournir le contenu. Cette rubrique fournit des exemples de ces concepts.

Exemple

La Header propriété du TreeViewItem contenu contient le contenu affiché TreeView pour cet élément. Un TreeViewItem peut également avoir TreeViewItem des contrôles en tant qu’éléments enfants et vous pouvez définir ces éléments enfants à l’aide de la Items propriété.

L’exemple suivant montre comment définir TreeViewItem explicitement du contenu en définissant la Header propriété sur une chaîne de texte.

<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>

L’exemple suivant montre comment définir des éléments enfants d’un TreeViewItem en définissant Items qui sont Button des contrôles.

<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>

L’exemple suivant montre comment créer un TreeView emplacement où un XmlDataProvider contenu fournit TreeViewItem et définir HierarchicalDataTemplate l’apparence du contenu.

<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}"/>

L’exemple suivant montre comment créer un TreeView emplacement où le TreeViewItem contenu contient DockPanel des contrôles qui ont du contenu incorporé.

<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>

Voir aussi