Click here to Skip to main content
11,413,548 members (71,868 online)
Click here to Skip to main content

MultiColumnTree

, 5 Sep 2010 CPOL
Rate this:
Please Sign up or sign in to vote.
A treeview with multiple columns

Multiline text on the node text or subitem value.

allowmultiline.JPG

TreeNode Checkboxes. The check box of the tree node doesn't automatically appear when you set the CheckBoxes property of the MultiColumnTree object to true, it will only appear when the tree node is selected, on hover, or the value of the CheckState property is not unchecked.

checkboxes.JPG

The first column is frozen.

column0frozen.JPG

The first column is sorted in descending order.

column0sorted.JPG

The second column has custom background painting.

columncustombackground.JPG

Custom filter button on filter popup window.

columncustomfilter.JPG

Column options popup window. It will display columns that have EnableHidden or EnableFrozen property set to true. It allows you to hide or freeze the column on runtime.

columnoptions.JPG

Custom tooltip. However, it will be shown if you set the NodeToolTip property on the MultiColumnTree object to true and the tree node has tooltip title, tooltip contents, or tooltip image. If the FullRowSelect property of the MultiColumnTree object is set to true, the tooltip will be displayed when the mouse pointer hovers on the whole node, otherwise, the tooltip will be displayed only when the mouse pointer hovers on the node text.

customtooltip.JPG

The appearance when the FullRowSelect property of the MultiColumnTree object is set to true.

fullrowselect.JPG

Introduction

I need to show additional nodes on a tree, just like what a listview did.  However there is no such control in standard WinForms control.  So, I decided to create on my own. A lot of improvement is needed to make this control fully useful.

Changes

I don't use TreeColumn class anymore. That class has been replaced with ColumnHeader class because I use it along with my ListView, and Items property of the TreeNode has been replaced with SubItems property.

Classes

There are classes that correspond with MultiColumnTree class.

Column (ColumnHeader Class)

Represent a column object for a tree.

  • Supports multiple column.
  • Supports 4 different types of column size: fixed size, percent, auto, and fill.
  • Supports runtime sorting.
  • Supports display formatting, DateTime, Numeric, Bar, and Custom. However, display format on the column 0 will be ignored.
  • When Bar is used in column format property, you can also specify the minimum and maximum range for the bar.
  • Supports column filtering, column filtering based on the column format used.
  • Supports column background painting. You can paint your custom background of each column here.
  • Two different alignments. The alignment of the Text on Column Header depends on TextAlign property, and the alignment of the SubItem value depends on ColumnAlign property.
  • Supports tooltip. You can specify the tooltip title, tooltip contents, or tooltip image for each column.

New features of the Column:

  • Custom filter. Enable custom filtering operation on each column. This feature will appear if you set EnableFiltering and EnableCustomFilter properties to true on the ColumnHeader class. Custom filter will raise ColumnCustomFilter event on MultiColumnTree class, and you can set the custom filtering operation to the related column by setting the CustomFilter property of the ColumnHeader. Custom filter property has reference type to Delegate Function CustomFilterFunction(ByVal value As Object) As Boolean.
  • Enable Frozen and Frozen properties (I don't know how to name this feature). Just like Freeze Pane feature on Microsoft Excel. The Frozen columns will shown on the first order and above on the UnFrozen columns.
  • Enable Hidden and Visible properties. Capability to show and hide the column.

Node (TreeNode Class)

Represent a node object for a tree. Below are additional behaviour.

  • Supports tooltip title, contents, and image for each node.
  • Supports multiline text for node. However, multiline text will appear when the AllowMultiline property of the MultiColumnTree is set to true.
  • SubItems property. To set additional information as SubItem for the TreeNode.
  • One property I adopted from ListViewItem, UseNodeStyleForSubItems property (I changed the name here for node).

SubItem (TreeNode.TreeNodeSubItem Class) :

Represent a SubItem of a Node in the MultiColumnTree. This class has the same behaviours with ListViewItem.ListViewSubItem class, with several additional features.

  • Supports multiline value
  • PintValueOnBar property. This property allows you to show the value over the Bar, when the Column Format is set to Bar.

Collections

There are 4 collection classes to support MultiColumnTree class.

  • TreeNodeCollection Class. Represent the collection of TreeNode objects in a MultiColumnTree control.
  • TreeNode.TreeNodeSubItemCollection Class. Represent the collection of TreeNode.TreeNodeSubItem objects in a TreeNode object.
  • MultiColumnTree.ColumnHeaderCollection Class. Represent the collection of ColumnHeader objects in a MultiColumnTree control.
  • MultiColumnTree.CheckedTreeNodeCollection Class. Represent the collection on checked TreeNode objects in a MultiColumnTree control.

Disadvantages

There are a lot of disadvantages (only the ones I know) compared with standard TreeView control, and I hope I can cover it, or maybe someone can help to improve this.

  • Doesn't support ImageList, so, it can't be used to populate a thing like explorer that uses Win32Api calls.
  • Doesn't support drag and drop operation (this factor makes this control very useless, in my opinion).

Implementation

To use the control, just drag and drop it from toolbox window in your IDE to your form in design view, just like another control.

To add columns to the tree control programmatically, use Columns.Add method.

' Assumes that you have created an instance of MultiColumnTree, for example : tree
Dim aColumn As ColumnHeader = New ColumnHeader      ' Create an instance of ColumnHeader
aColumn.Text = "Column 1"                           ' You can set the other 
                                                    ' properties like this
tree.Columns.Add(aColumn)                           ' Add this column to tree

To add a node to the tree control, use Nodes.Add method. To add additional items to a node to be shown in the tree control based on its column, use Items.Add method on a node object.

' Adding a node and additional information to tree
Dim aNode As TreeNode = New TreeNode                ' Create an instance of TreeNode
aNode.Text = "Parent Node"                          ' Set another properties of 
                                                    ' the node here
aNode.SubItems.Add("Parent Sub 1")                  ' Add another items to this node here
tree.Nodes.Add(aNode)                               ' Add this node to tree

To add another node as child node to an existing node, use Nodes.Add method on a node object.

' Adding a node and additional information to an existing node. For example : aNode
Dim childNode As TreeNode = New TreeNode      ' Create an instance of TreeNode
childNode.Text = "Child Node"                 ' Set another properties of this node here
childNode.Items.Add("Child Sub 1")            ' Add another items to this node here
aNode.Nodes.Add(childNode)                    ' Add this node to aNode

Create custom painting on a column(with index 1) background example.

' tree.BackgroundColumnPaint event handler
' On e (ColumnBackgroundPaintEventArgs) parameter, it has 4 fields :
' Column, column to be painted.
' ColumnIndex, index of the column in MultiColumnTree.Columns collection.
' Graphics, graphis object used to paint.
' Rectangle, rectangle in which to paint.
Private Sub tree_BackgroundColumnPaint(ByVal sender As Object, _
	ByVal e As ColumnBackgroundPaintEventArgs) Handles tree.BackgroundColumnPaint
    If e.ColumnIndex = 1 Then
        Dim aBrush As LinearGradientBrush = New LinearGradientBrush_
	(e.Rectangle, Color.White, Color.LightBlue, LinearGradientMode.Horizontal)
        e.Graphics.FillRectangle(aBrush, e.Rectangle)
        aBrush.Dispose()
    End If
End Sub

Handling the ColumnCustomFilter event on MultiColumnTree object.

' tree.ColumnCustomFilter event handler
Private Sub tree_ColumnCustomFilter(ByVal sender As Object, _
    ByVal e As Ai.Control.ColumnCustomFilterEventArgs) Handles tree.ColumnCustomFilter
    ' Perform your custom filter dialog here.
    ' If you want to cancel the operation, set e.CancelFilter to true.
    ' Add your custom filtering like this.
    e.Column.CustomFilter = AddressOf column1CustomFilter
End Sub
' A function that have matching parameter and return types with 
' Delegate Function CustomFilterFunction(ByVal value As Object) As Boolean
Private Function column1CustomFilter(ByVal value As Object) As Boolean
    ' This is just a sample, to perform custom filtering operation on specified column.
    ' Return true if the value is meet your custom filter parameter, false otherwise.
    Return True
End Function

There are several bugs I received from others, and (hopefully, because I am working all alone, I can't test this control completely) have been fixed.

  • Lost label after editing bug.
  • Check box doesn't automatically appears when you set the CheckBoxes property to true, it will appear when the CheckState of the node is not unchecked, or the mouse pointer is hovering on a node, or the node is selected.
  • I create my test project using Tab control, a Button on page 1, and MultiColumnTree control on page 2, and I can populate the node in MultiColumnTree control on Button click event.

This is my update, I'm sorry for taking a very long time.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

red_moon
Software Developer (Senior) Ai Software
Indonesia Indonesia
Keep moving ...
Learn the different ...
Get the advantages ...

And ... knowing everything ...

Comments and Discussions

 
Questionoffer Pin
mzsystem at 7-Feb-15 22:38
membermzsystem7-Feb-15 22:38 
QuestionRightToLeft for persian Pin
ATondtar at 18-Apr-13 11:15
memberATondtar18-Apr-13 11:15 
GeneralMy vote of 5 Pin
Polinia at 11-Jan-13 4:42
memberPolinia11-Jan-13 4:42 
BugAdding Child Items in Column0 on Expand giving a view of mixed up child items. [modified] Pin
purab at 10-Dec-12 8:36
memberpurab10-Dec-12 8:36 
QuestionIs there an easy way to assign a button to a treenode ? Pin
stepdecl at 12-Jul-12 23:53
memberstepdecl12-Jul-12 23:53 
AnswerRe: Is there an easy way to assign a button to a treenode ? Pin
red_moon at 13-Jul-12 17:01
memberred_moon13-Jul-12 17:01 
QuestionFind a Bug? Pin
Member 9183021 at 28-Jun-12 1:44
memberMember 918302128-Jun-12 1:44 
AnswerRe: Find a Bug? Pin
Member 9183021 at 28-Jun-12 1:46
memberMember 918302128-Jun-12 1:46 
GeneralMy vote of 5 Pin
Polinia at 29-May-12 8:04
memberPolinia29-May-12 8:04 
GeneralMy vote of 5 Pin
micky_bird86 at 28-May-12 16:32
membermicky_bird8628-May-12 16:32 
Questiongood Pin
legendjslc at 5-Feb-12 2:11
memberlegendjslc5-Feb-12 2:11 
GeneralMy vote of 5 Pin
legendjslc at 5-Feb-12 2:11
memberlegendjslc5-Feb-12 2:11 
QuestionCan it be used in VB6? Pin
j_taq at 9-Jan-12 1:52
memberj_taq9-Jan-12 1:52 
GeneralMy vote of 5 Pin
hadre at 11-May-11 21:17
memberhadre11-May-11 21:17 
GeneralAdding Checkbox or ComboBox Pin
muffmolch at 13-Apr-11 23:59
membermuffmolch13-Apr-11 23:59 
GeneralNode backcolor does not work? Pin
babbelut at 13-Apr-11 7:39
memberbabbelut13-Apr-11 7:39 
GeneralMy vote of 5 Pin
Milk_soft at 9-Dec-10 1:33
memberMilk_soft9-Dec-10 1:33 
QuestionHow to clear list & get selected child node value Pin
adamc at 28-Oct-10 10:00
memberadamc28-Oct-10 10:00 
AnswerRe: How to clear list & get selected child node value Pin
adamc at 2-Nov-10 6:41
memberadamc2-Nov-10 6:41 
GeneralExpand Problem Pin
M2M_Brian at 28-Sep-10 11:10
memberM2M_Brian28-Sep-10 11:10 
GeneralRe: Expand Problem Pin
red_moon at 28-Sep-10 13:56
memberred_moon28-Sep-10 13:56 
AnswerRe: Expand Problem Pin
Pierfrancesco Farilla at 20-Oct-10 0:48
memberPierfrancesco Farilla20-Oct-10 0:48 
GeneralRe: Expand Problem Pin
M2M_Brian at 20-Oct-10 4:48
memberM2M_Brian20-Oct-10 4:48 
General"fresh" bugs Pin
T_uRRiCA_N at 13-Sep-10 4:45
memberT_uRRiCA_N13-Sep-10 4:45 
GeneralRe: "fresh" bugs Pin
red_moon at 13-Sep-10 23:49
memberred_moon13-Sep-10 23:49 
Generalrunning the code in C# Pin
Christ Kennedy at 6-Sep-10 3:49
memberChrist Kennedy6-Sep-10 3:49 
GeneralRe: running the code in C# Pin
red_moon at 6-Sep-10 4:02
memberred_moon6-Sep-10 4:02 
GeneralRe: running the code in C# Pin
Christ Kennedy at 6-Sep-10 5:24
memberChrist Kennedy6-Sep-10 5:24 
GeneralRe: running the code in C# Pin
red_moon at 6-Sep-10 7:51
memberred_moon6-Sep-10 7:51 
GeneralRe: running the code in C# Pin
Christ Kennedy at 6-Sep-10 8:08
memberChrist Kennedy6-Sep-10 8:08 
GeneralRe: running the code in C# Pin
red_moon at 6-Sep-10 9:31
memberred_moon6-Sep-10 9:31 
GeneralRe: running the code in C# Pin
Christ Kennedy at 6-Sep-10 12:49
memberChrist Kennedy6-Sep-10 12:49 
Questioncan you include additional checkboxes Pin
T_uRRiCA_N at 5-Sep-10 23:25
memberT_uRRiCA_N5-Sep-10 23:25 
AnswerRe: can you include additional checkboxes Pin
red_moon at 6-Sep-10 1:45
memberred_moon6-Sep-10 1:45 
GeneralRe: can you include additional checkboxes Pin
T_uRRiCA_N at 6-Sep-10 9:12
memberT_uRRiCA_N6-Sep-10 9:12 
GeneralRe: can you include additional checkboxes Pin
red_moon at 6-Sep-10 9:27
memberred_moon6-Sep-10 9:27 
Questionno source code? Pin
Christ Kennedy at 5-Sep-10 5:43
memberChrist Kennedy5-Sep-10 5:43 
AnswerRe: no source code? Pin
red_moon at 5-Sep-10 10:10
memberred_moon5-Sep-10 10:10 
GeneralRe: no source code? Pin
red_moon at 5-Sep-10 16:20
memberred_moon5-Sep-10 16:20 
GeneralRe: no source code? Pin
Christ Kennedy at 5-Sep-10 16:36
memberChrist Kennedy5-Sep-10 16:36 
Generalpopulate MultiColumn Pin
sergio58 at 25-Aug-10 12:03
membersergio5825-Aug-10 12:03 
GeneralRe: populate MultiColumn Pin
red_moon at 5-Sep-10 16:23
memberred_moon5-Sep-10 16:23 
GeneralUpdate Progress on Hold Pin
red_moon at 22-Aug-10 17:53
memberred_moon22-Aug-10 17:53 
GeneralCheckBoxes Pin
sergio58 at 22-Aug-10 9:28
membersergio5822-Aug-10 9:28 
GeneralRe: CheckBoxes Pin
red_moon at 5-Sep-10 16:27
memberred_moon5-Sep-10 16:27 
GeneralRe: CheckBoxes Pin
M2M_Brian at 28-Sep-10 10:24
memberM2M_Brian28-Sep-10 10:24 
GeneralMy vote of 5 Pin
Bigdeak at 16-Aug-10 5:57
memberBigdeak16-Aug-10 5:57 
Generalanother bug, lost label after edit Pin
T_uRRiCA_N at 12-Aug-10 1:48
memberT_uRRiCA_N12-Aug-10 1:48 
GeneralRe: another bug, lost label after edit Pin
red_moon at 15-Aug-10 9:26
memberred_moon15-Aug-10 9:26 
GeneralA little bug Pin
T_uRRiCA_N at 12-Aug-10 1:34
memberT_uRRiCA_N12-Aug-10 1:34 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web03 | 2.8.150427.1 | Last Updated 5 Sep 2010
Article Copyright 2010 by red_moon
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid