Treeview Control Visual Basic (vb.6) Tutorials

Tips >> Visual Basic

MAKE WEB APPLICATION WITHOUT KNOWLEDGE OF CODING? CLICK HERE

TREE DEFINITIONS:

Node A node can be best thought of as a branch on our tree. Each node represents 1 item. A node can hold any number of subnodes.
Sibling A sibliing is another node that exists on the same branch as the refering node.
Children Children are sub-nodes of the current node. Sometimes called Child nodes.
Parent A parent node is the node "up" from your current node. All nodes except the root node have a parent node.

ADDING NODES TO THE TREEVIEW:

Object Type Object Name Instructions
Treeview Treeview1 The Treeview control where it all happens. You'll be using this control though the whole tutorial.
Imagelist ImageList1 This control will hold the images for our nodes. Add 3 images to the image list control.
Image Key
Image of a Closed Folder Closed
Image of an Open Folder Open
Image of a File Leaf
The Treeview Control holds a collection of nodes so to add a node to the Tree you need to define a new node and then add that node to the Treeview's collection. Like this:
 
Dim nodx As Node

'Add root Node
Set nodx = TreeView1.Nodes.Add(, , "Root", "Root Node")
 
Trying running that. You should see only one item in the tree called "Root Node". You will notice that the parent property was left blank in the example above. This is because we want this node to be a top level node or Root node, and not to have any parents. Lets add some more nodes to our tree, but this time we will add images to each of our nodes:

 
Dim nodx As Node

Set TreeView1.ImageList = ImageList1

'Add root Node
Set nodx = TreeView1.Nodes.Add(, , "Root", "Root Node","Closed")

'Expand root node so we can see what's under it
nodx.ExpandedImage = "Open"
nodx.Expanded = True

'Create a child node under the root node
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child1", "Child node 1", "Closed")

'Expand this node so we can see what's under it
nodx.ExpandedImage = "Open"
nodx.Expanded = True

'Create several more children
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child2", _
                                                            "Child node 2", "Leaf")
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child3", _
                                                            "Child node 3", "Leaf")
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child4", _
                                                            "Child node 4", "Leaf")
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child5", _
                                                            "Child node 5", "Leaf")

'Create two child nodes under the first child node of root
Set nodx = TreeView1.Nodes.Add("Child1", tvwChild, "Child1A", _
                                                            "Child node 1 A", "Leaf")
Set nodx = TreeView1.Nodes.Add("Child1", tvwChild, "Child1B", _
                                                            "Child node 1 B", "Leaf")
 
Now if you look at that code you will notice that we now have a reference to that node stored in the nodx object. You can use this reference to modify the properties of that node. That's what's happening on the nodx.expanded = true lines. What those do is open a node so we can see the child nodes under it. It's the same thing as when the user clicks on a node to expand it themselves, except this is done though the code.

Go ahead and run that last bit of code. You should see that the original Root Node now has 5 child nodes under it and the first of these child nodes has two of it's own children.

 

MOVING THROUGH THE TREE IN TREEVIEW CONTROL:

There are many instances where you want to be able to move though the tree to find all the sub nodes under a specific node. Using the above here is a very simple example of how to get all the sub nodes for a specific node and display their text labels:
 
Dim nodx As Node

Set TreeView1.ImageList = ImageList1

'Add root Node
Set nodx = TreeView1.Nodes.Add(, , "Root", "Root Node", "Closed")

'Expand root node so we can see what's under it
nodx.ExpandedImage = "Open"
nodx.Expanded = True

'Create a child node under the root node
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child1", _
"Child node 1", "Closed")

'Expand this node so we can see what's under it
nodx.ExpandedImage = "Open"
nodx.Expanded = True

'Create several more children
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child2", _
"Child node 2", "Leaf")
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child3", _
"Child node 3", "Leaf")
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child4", _
"Child node 4", "Leaf")
Set nodx = TreeView1.Nodes.Add("Root", tvwChild, "Child5", _
"Child node 5", "Leaf")

'Create two child nodes under the first child node of root
Set nodx = TreeView1.Nodes.Add("Child1", tvwChild, "Child1A", _
"Child node 1 A", "Leaf")
Set nodx = TreeView1.Nodes.Add("Child1", tvwChild, "Child1B", _
"Child node 1 B", "Leaf")

'Loop though each child of the root node
Dim i As Long

'Set nodx to the first child node of root.
Set nodx = TreeView1.Nodes("Root").Child

'Loop though each child nod assigning it to nodx
For i = 1 To TreeView1.Nodes("Root").Children
     MsgBox nodx.Text
     Set nodx = nodx.Next
Next

 
Only the last block of code is new in the above example. You can use the Children property to tell you how many child nodes a node contains. The Child property points to the first child node and the Next property points to the next child node after the current one.

 

 

EVENTS IN TREEVIEW:

 

Ok time to try something new.
For this example we will just add two nodes that resemble directories on your system. When you click on a node it will give your the absolute file path to get to that folder:

 
Private Sub Form_Load()
Dim nodx As Node

Set TreeView1.ImageList = ImageList1

'Add Drive
Set nodx = TreeView1.Nodes.Add(, , , "c:", "Closed")
nodx.ExpandedImage = "Open"
nodx.Expanded = True

'Add Folder
Set nodx = TreeView1.Nodes.Add(nodx, tvwChild, , "Windows", "Closed")
nodx.ExpandedImage = "Open"
nodx.Expanded = True

'Add Another Folder
Set nodx = TreeView1.Nodes.Add(nodx, tvwChild, , "System", "Closed")
nodx.ExpandedImage = "Open"
nodx.Expanded = True

End Sub

Private Sub TreeView1_NodeClick(ByVal Node As MSComctlLib.Node)
     MsgBox Node.FullPath
End Sub

 
When you click on a node in the tree, the NodeClick event gets fired and it passes you the node that was clicked, so it's then easy to manipulate it. Notice anything strange about the above example? That right there are no Keys for any of the nodes. The key is optional and does not have to be specified. Also note that since I don't have a key I have to give the whole node instead of just the node's key to the add function to be able to add a new node to the tree. That is why nodx is being passed into the add function, since it is really just a pointer to the previous node.

You should be able to see from the above example that the Treeview control works very well for showing the file system, like in Windows Explorer, the FullPath property gives us everything we need to tell where the file is located.

Here is an example of the NodeCheck, Collapse, and Expand Events:
 
Try running that and clicking on the checkboxes you should get a message telling you which node you just checked. Then try UnChecking a node, and you should get a message telling you which node was unchecked. Now try collapsing and expanding some nodes and you should get a message from the Expand and Collapse events.
Private Sub Form_Load()
Dim nodx As Node
Dim nodr As Node

'Show Root Lines
TreeView1.LineStyle = tvwRootLines

'Display Checkboxes
TreeView1.Checkboxes = True

'Add Items
Set nodx = TreeView1.Nodes.Add(, , , "Item 1")
Set nodx = TreeView1.Nodes.Add(, , , "Item 2")
Set nodx = TreeView1.Nodes.Add(, , , "Item 3")
Set nodx = TreeView1.Nodes.Add(, , , "Item 4")
Set nodx = TreeView1.Nodes.Add(, , , "Item 5")
nodx.Expanded = True

Set nodr = TreeView1.Nodes.Add(nodx, tvwChild, , "Item 6")
nodr.Expanded = True

Set nodx = TreeView1.Nodes.Add(nodr, tvwChild, , "Item 7")
Set nodx = TreeView1.Nodes.Add(nodr, tvwChild, , "Item 8")
Set nodx = TreeView1.Nodes.Add(nodr, tvwChild, , "Item 9")
Set nodx = TreeView1.Nodes.Add(nodr, tvwChild, , "Item 10")
Set nodx = TreeView1.Nodes.Add(nodr, tvwChild, , "Item 11")

Set nodx = TreeView1.Nodes.Add(, , , "Item 12")
End Sub

Private Sub TreeView1_Collapse(ByVal Node As MSComctlLib.Node)
     MsgBox "Colapsing node: " & Node.Text
End Sub

Private Sub TreeView1_Expand(ByVal Node As MSComctlLib.Node)
     MsgBox "Expanding node: " & Node.Text
End Sub

Private Sub TreeView1_NodeCheck(ByVal Node As MSComctlLib.Node)
     If Node.Checked Then
          MsgBox "Node " & Node.Text & " was checked"
     Else
          MsgBox "Node " & Node.Text & " was Unchecked"
     End If
End Sub

 

If you don't find what you are looking for. Please click here to submit your query, our experts will reply soon.

 

E-mail : sales@virtualsplat.com
Phone : +91-9892413501

Whatsapp Icon +91-9967648641

Whatsapp Icon +91-9967648641