Posted by: Zeeshan Amjad | October 3, 2009

Introduction to Tree view control in C#


Using Tree control in WPF is very easy. We can display hierarchal data in the tree control. Here is a simple C# code to make a tree control.

  1: using System;
  2: using System.Collections.Generic;
  3: using System.Linq;
  4: using System.Text;
  5: using System.Windows;
  6: using System.Windows.Controls;
  7: using System.Windows.Data;
  8: using System.Windows.Documents;
  9: using System.Windows.Input;
 10: using System.Windows.Media;
 11: using System.Windows.Media.Imaging;
 12: using System.Windows.Navigation;
 13: using System.Windows.Shapes;
 14: using System.ComponentModel;
 15: 
 16: namespace TreeView
 17: {
 18:     /// <summary>
 19:     /// Interaction logic for Window1.xaml
 20:     /// </summary>
 21:     public partial class Window1 : Window
 22:     {
 23:         public Window1()
 24:         {
 25:             InitializeComponent();
 26:         }
 27: 
 28:         private void Window_Loaded(object sender, RoutedEventArgs e)
 29:         {
 30:             TreeViewItem item1 = new TreeViewItem();
 31:             item1.Header = "Maryland";
 32:             tree.Items.Add(item1);
 33: 
 34:             TreeViewItem subitem11 = new TreeViewItem();
 35:             subitem11.Header = "Annapolis";
 36:             item1.Items.Add(subitem11);
 37: 
 38:             TreeViewItem subitem12 = new TreeViewItem();
 39:             subitem12.Header = "Baltimore";
 40:             item1.Items.Add(subitem12);
 41: 
 42:             TreeViewItem item2 = new TreeViewItem();
 43:             item2.Header = "California";
 44:             tree.Items.Add(item2);
 45: 
 46:             TreeViewItem subitem21 = new TreeViewItem();
 47:             subitem21.Header = "Los Angeles";
 48:             item2.Items.Add(subitem21);
 49: 
 50:             TreeViewItem subitem22 = new TreeViewItem();
 51:             subitem22.Header = "San Francisco";
 52:             item2.Items.Add(subitem22);
 53: 
 54:             TreeViewItem subitem23 = new TreeViewItem();
 55:             subitem23.Header = "San Diego";
 56:             item2.Items.Add(subitem23);
 57: 
 58:             TreeViewItem subitem24 = new TreeViewItem();
 59:             subitem24.Header = "Sacramento";
 60:             item2.Items.Add(subitem24);
 61: 
 62:             TreeViewItem item3 = new TreeViewItem();
 63:             item3.Header = "Massachusetts";
 64:             tree.Items.Add(item3);
 65: 
 66:             TreeViewItem subitem31 = new TreeViewItem();
 67:             subitem31.Header = "Sacramento";
 68:             item3.Items.Add(subitem31);
 69:         }
 70:     }
 71: }
 72: 

Here is the output of this program.

TreeView

Advertisements

Responses

  1. Hi Zeeshan Amjad.
    It was an useful article. Thanks.
    I have a trouble :

    I’ve created a TreeViewItem in WPF via C# :

    ///////////////////////////////////////////////////
    //History
    TreeView1.Items.Clear();

    Image imageHistory = new Image();
    imageHistory.Source = new BitmapImage(new Uri(@”/passwordManager;component/images/TreeView/history.png”, UriKind.Relative));
    imageHistory.Width = imageHistory.Height = 16;

    Label labelHistory = new Label();
    labelHistory.Content = “History”;

    StackPanel stackPanelHistory = new StackPanel();
    stackPanelHistory.Orientation = Orientation.Horizontal;
    stackPanelHistory.Children.Add(imageHistory);
    stackPanelHistory.Children.Add(labelHistory);

    TreeViewItem treeViewHistory = new TreeViewItem();
    treeViewHistory.Name = “TreeViewItemHistory”;
    treeViewHistory.Header = stackPanelHistory;

    TreeView1.Items.Add(treeViewHistory);
    ///////////////////////////////////////////////////////

    The result of above codes :

    ///////////////////////////////////////////////////////

    ///////////////////////////////////////////////////////

    After that, I’m gonna add some TreeViewItems within TreeViewItemHistory,
    For doing it , I’ve written the following C# codes :

    ///////////////////////////////////////////////////////
    private void MenuItem_Click(object sender, System.Windows.RoutedEventArgs e)
    {
    for (int i = 0; i < 10; i++)
    {
    Image img1 = new Image();
    img1.Source = new BitmapImage(new Uri(@"/passwordManager;component/images/TreeView/empty-bookmark.png", UriKind.Relative));
    img1.Width = img1.Height = 16;

    Label label = new Label();
    label.Content = "Test " + i;

    StackPanel sp = new StackPanel();
    sp.Orientation = Orientation.Horizontal;
    sp.Children.Add(img1);
    sp.Children.Add(label);

    TreeViewItem treeViewItem = new TreeViewItem();
    treeViewItem.Name = "TreeViewItem" + i;
    treeViewItem.Header = sp;

    TreeViewItemHistory.Items.Add(treeViewItem);
    }
    }
    ///////////////////////////////////////////////////////

    The above method runs without any Exceptions , but nothing happen and no TreeViewItem doesn't add to TreeViewItemHistory.
    I don't know what wrong is with it!
    Could you please guide me ?

    Thanks.

    BTW : I added the XAML code of TreeViewItemHistory within TreeView1 at first. Then, in a method I have cleared all TreeView's TreeVewItems with TreeView1.Items.Clear();. finally I've added TreeViewItemHistory via C# again.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Categories

%d bloggers like this: