Introduction
Any data that could be represented in an hierarchical way is a candidate for a treeview listing. This article will show you how to use the MS Active X treeview control in your own applications in a simple way, populate it fast and apply drag&drop to it. Note that this control is not included in the ActiveX controls list by default, so you will need to add it via the ‘Tools\Options\Controls’ menu. While working with the treeview control you can press ‘F1’ to get help about its properties, events, and methods. As with other VFP objects, you can right click on this control and select ‘Treeview control properties’ to get the property pages dialog box. In this article we will refer to the MS Active X treeview control as simply the OleTreeview.
The Basics
Treeview data in its simple form is much like a 3 columns table. Each node has a unique key identifying itself (NodeKey - Primary Key), link to parent node (ParentKey - Foreign Key) and text that user sees (NodeText).
Tables 1 and 2 show how treeview data table might look like if it were a directory listing or data listing. Treeview samples for these are shown in Figures 1 and 2.
Table 1 : Directory structure
Table 2 : Hierarchical data
Figure 1 : Treeview viewing of a directory structure
Figure 2 : Treeview view of data
Treeview Methods
To add a new node, use this method:
OleTree.Nodes.Add(cParentKey, tvwChild, cNodeKey, cNodeText, cImage1, cImage2)
Syntax: object.Add(relative, relationship, key, text, image, selectedimage)
Note that cImage1 and cImage2 are optional even though syntax says ‘selectedimage’ for the second it’s actually ‘expandedimage’ and shows when item is expanded ( e.g.: Open Folder in explorer).
Here are the constants used in the node add:
#Define tvwFirst 0 #Define tvwLast 1 #Define tvwNext 2 #Define tvwPrevious 3 #Define tvwChild 4
OleTree.Nodes.Add(, tvwFirst, cNodeKey, cNodeText, cImage1, cImage2)
OleTree.Nodes.Remove(nIndex)
To place a node before a node use tvwPrevious :
OleTree.Nodes.Add(loTarget.Key, tvwPrevious, lcSourceKey, lcSourceText)
Populating Nodes
The disadvantage of the OleTreeview is that it is slow. Think of a treeview control that would be populated with drive and directory list like Windows Explorer’s left pane. Even if the node collection was ready for it to fill, it would take ages to populate the treeview. Add time to collect directory structure and it’s dog slow. The same goes with data showing in treeview.
To solve this issue think of a treeview as a kind of a pageframe. It’s a well-known trick to save page contents in a pageframe as classes and instantiate them only on first visit to the page. Use the same approach with a treeview control by showing only when needed. Logic goes like this :
I mentioned you could use any data that could be expressed in an hierarchical way in a treeview. Well right, but drive & directory listing best resembles a treeview hierarchical structure. For this reason I’ll use directory listing in my code samples (I think treeview like data display is actually another set of ActiveX controls’ job and hope to talk about this in a future issue).
Comments about code
Besides Treeview control sample code uses ImageList ActiveX control to provide node images (folder, drive, CDRom etc) and Sripting.FileSystemObject as well.
When you drag&drop a node with no shift identifier key than it’s assumed as either a reorder (parent same) or copy. Using ‘shift’ signals a move and ‘ctrl’ a copy operation. In a copy operation with same parent or move what we do is :
If it’s a reordering than we also call _Subfolders method to set + sign if has children.
Normally it would be done in all operations but remember here I’m just demonstrating with existing folders and not doing a physical copy, move on disk. Also I must warn you about the logic in copy, move, reordering that I was lazy not to do it bulletproof. Just consider it does its job as a sampling on Treeview drag&drop. As a last note if you want to drag&drop to or from VFP native controls then you need to use OLEDrag, OLEDragDrop methods which are available in VFP6 and up. If you use a prior version also note that DropHighLight calls are expected to be problematic if OCX version is not SP4.
OK I hear you say let’s see code and here it is: Treeview.zip
