Description
The tree view control is used to display the classified or arranged files or documents or folders in the left side of the Windows Explorer. Nodes are present in tree view. Each node contains one or more child controls.
Example
Create a new window, then go to xaml source and write the following code:
[csharp]
<Window x:Class="WPFTreeview.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="WPF | Treeview" Height="350" Width="525" >
<Grid>
<TreeView Background="Pink">
<TreeViewItem Header="SPlessons Higher Otherity">
<TreeViewItem Header="Dr Narasimha"></TreeViewItem>
<TreeViewItem Header="Divya"></TreeViewItem>
<TreeViewItem Header="Sree Hari"></TreeViewItem>
<TreeViewItem Header="Mani Khanta"></TreeViewItem>
</TreeViewItem>
<TreeViewItem Header="Hyderabad Team">
<TreeViewItem Header="Srinivasreddy"></TreeViewItem>
<TreeViewItem Header="Sarala"></TreeViewItem>
<TreeViewItem Header="Bhanu Avinash"></TreeViewItem>
<TreeViewItem Header="Chinna Rao"></TreeViewItem>
</TreeViewItem>
</TreeView>
</Grid>
</Window>
[/csharp]
Now click F5 to run the application.The output appears as shown in the below figure.
In above window, there are two icons. When clicked on those icons, the output will become like below window:
Example
Above example can be generated using background code.
Write the following code in code view:
[csharp]using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace WPFTreeview
{
///
<summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
TreeViewItem treeItem = null;
treeItem = new TreeViewItem();
treeItem.Header = "SPlessons Higher Otharity";
treeItem.Items.Add(new TreeViewItem() { Header = "Dr. Narasimha" });
treeItem.Items.Add(new TreeViewItem() { Header = "Divya" });
treeItem.Items.Add(new TreeViewItem() { Header = "Sree Hari" });
treeItem.Items.Add(new TreeViewItem() { Header = "Manikantha" });
tv1.Items.Add(treeItem);
}
}
}[/csharp]
Now run the application.The output appears as shown in the below figure.
In above window, there is an icon, if clicked on that then the result becomes like below.
Example
Tree view by using Templates
Create a new window, then go to xaml source and write the following code:
[csharp]
<Window x:Class="WPFTreeview.Treeviewdatabound" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="WPF | TreeView" Height="300" Width="300" Background="LightSkyBlue">
<Grid Margin="10">
<TreeView Name="treeviewMenu" Background="LightGray">
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding Items}">
<TextBlock Text="{Binding Title}" />
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
</Grid>
</Window>
[/csharp]
Now go to code view and write the following code:
[csharp]
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
namespace WPFTreeview
{
///
<summary>
/// Interaction logic for Treeviewdatabound.xaml
/// </summary>
public partial class Treeviewdatabound : Window
{
public Treeviewdatabound()
{
InitializeComponent();
MenuItem path = new MenuItem() { Title = "Menu" };
MenuItem SPlessons = new MenuItem() { Title = "SPlessons Hyderabad Team" };
SPlessons.Items.Add(new MenuItem() { Title = "Srinivasreddy" });
SPlessons.Items.Add(new MenuItem() { Title = "Sarala" });
SPlessons.Items.Add(new MenuItem() { Title = "Bhanu Avinash" });
SPlessons.Items.Add(new MenuItem() { Title = "Chinna Rao" });
path.Items.Add(SPlessons);
treeviewMenu.Items.Add(path);
}
}
public class MenuItem
{
public MenuItem()
{
this.Items = new Collection<MenuItem>();
}
public string Title { get; set; }
public Collection<MenuItem> Items { get; set; }
}
}
[/csharp]
Now run the application.The output appears as shown in below figure.
