Comment : créer des arborescences simples ou complexes
Mise à jour : novembre 2007
Cet exemple montre comment créer des contrôles TreeView simples ou complexes.
Un TreeView se compose d'une hiérarchie de contrôles TreeViewItem qui peuvent contenir des chaînes de texte simples ainsi qu'un contenu plus complexe, tel que des contrôles Button ou un StackPanel avec contenu incorporé. Vous pouvez définir explicitement le contenu TreeView ou une source de données peut fournir le contenu. Cette rubrique fournit des exemples de ces concepts.
Exemple
La propriété Header du TreeViewItem contient le contenu que le TreeView affiche pour cet élément. Un TreeViewItem peut également disposer de contrôles TreeViewItem comme éléments enfants et vous pouvez définir ces derniers en utilisant la propriété Items.
L'exemple suivant montre comment définir explicitement le contenu TreeViewItem en affectant une chaîne de texte à la propriété Header.
<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 les éléments enfants d'un TreeViewItem en définissant les Items qui sont des contrôles 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>
L'exemple suivant montre comment créer un TreeView où un XmlDataProvider fournit le contenu TreeViewItem et un HierarchicalDataTemplate définit l'apparence du contenu.
<XmlDataProvider x:Key="myEmployeeData" XPath="/EmployeeData">
<x:XData>
<EmployeeData >
<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 où le contenu TreeViewItem contient des contrôles DockPanel avec 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>