Programming a TreeView

TreeView is a visually compelling way to represent information that Microsoft uses constantly. Virtually any page you pull up at MSDN will have a tree structure at the left side that helps you navigate to exactly what you need in just a few clicks. In addition, it's available in just about any interface technology you like. (It was even in VB6!) You can program it in ...

Windows forms:

TreeView1.Nodes.
    Add(
        "Parent")
TreeView1.Nodes(0).
    Nodes.
        Add(
            "Child 1")
TreeView1.Nodes(0).
    Nodes.
        Add(
            "Child 2")
TreeView1.Nodes(0).
    Nodes(1).
        Nodes.
            Add(
                "Grandchild")
TreeView1.Nodes(0).
    Nodes(1).
        Nodes(0).
            Nodes.
                Add(
                    "Great Grandchild")

ASP.NET

<asp:TreeView ID="TreeView1"
    ExpandDepth="FullyExpand" runat="server"
    Height="175px" Width="336px">
    <Nodes>
        <asp:TreeNode Text="Parent">
            <asp:TreeNode Text="Child 1" />
            <asp:TreeNode Text="Child 2">
                <asp:TreeNode Text="Grandchild">
                    <asp:TreeNode
                    	Text="Great Grandchild" />
                </asp:TreeNode>
            </asp:TreeNode>
        </asp:TreeNode>
    </Nodes>
</asp:TreeView>

The ASP.NET VB.NET code behind equivalent:

Public Class _Default
    Inherits System.Web.UI.Page
    Protected Sub Page_Load(
        ByVal sender As Object,
        ByVal e As System.EventArgs
        ) Handles Me.Load
        ' TreeView1 is added in Design View
        Dim theRootNode As TreeNode = New TreeNode
        Dim theChild1 As TreeNode = New TreeNode
        Dim theChild2 As TreeNode = New TreeNode
        Dim theGrandChild As TreeNode = New TreeNode
        Dim theGreatGrandChild As TreeNode = New TreeNode
        theRootNode.Text = "Parent"
        TreeView1.Nodes.Add(theRootNode)
        theChild1.Text = "Child 1"
        theRootNode.ChildNodes.Add(theChild1)
        theChild2.Text = "Child 2"
        theRootNode.ChildNodes.Add(theChild2)
        theGrandChild.Text = "GrandChild"
        theChild2.ChildNodes.Add(theGrandChild)
        theGreatGrandChild.Text = "GreatGrandChild"
        theGrandChild.ChildNodes.Add(theGreatGrandChild)
    End Sub
End Class

WPF implemented in XAML:

<Window x:Class="MainWindow"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="175" Width="250">
    <Canvas Name="theCanvas">
        <TreeView>
            <TreeViewItem Header="Parent">
                <TreeViewItem Header="Child 1"/>
                <TreeViewItem Header="Child 2">
                    <TreeViewItem Header="GrandChild">
                        <TreeViewItem
                            Header="GreatGrandChild"/>
                    </TreeViewItem>
                </TreeViewItem>
            </TreeViewItem>
        </TreeView>
    </Canvas>
</Window>

--------
Click Here to display the llustration
--------

But less experienced programmers often don't think of using it. This article will explain how to use TreeView, starting with Windows forms on the next page.

Previous

• 1
• 2
• 3

Next