Change TreeNode image on expand-collapse events

5
votes

I have a treeView with many nodes. I want that some nodes change their image when node collapsed/expanded. How can I do it ?

Unfortunately, TreeNode don't have properties like ExpandNodeImage, CollapseNodeImage \

TreeView can change very often, so nodes can be deleted/added.. i can delete child nodes and so on...

Maybe, there is a class like ExpandAndCollapseNode ?

5
c#winformstreeview

5 Answers

8
votes

1). Add an ImageList Control to your WinForm.

2). Populate the ImageList with the pictures/icons you wish to change/display in response to what the user does at run-time with the TreeView, such as expanding, or collapsing nodes.

3). Assign the 'ImageList Control to the 'ImageList property of the 'TreeView

At this point you may want to make an initial pass over the TreeView, assuming it is populated, assigning the Node.ImageIndex property to point to the Image ... in the ImageList ... you want to use for the Node depending on whether it has children, or whatever.

4). If a user expands a Node, for example, you can use the BeforeExpand Event of the TreeView to change the Node's picture : like so : in this case we use the index of the Picture in the ImageList :

    private void treeView1_BeforeExpand(object sender, TreeViewCancelEventArgs e)
    {
        e.Node.ImageIndex = 3;
    }

5) You can also set the Node's image by using the ImageKey property which is the string name of the Image

6) There lots of other possible Node Picture variations to use : check out : SelectedImageIndex and SelectedImageKey : You can change Node pictures in the BeforeSelect, AfterSelect and BeforeExpand, events also, depending on the effect you are after.

2
votes

TreeViews have the following events that will be be fired when nodes are collapsed/expaned.

BeforeCollapse
BeforeExpand
AfterCollapse
AfterExpand
2
votes

It's better to use :

treeNode.SelectedImageIndex = 1;
2
votes
BeforeCollapse
BeforeExpand
AfterCollapse
AfterExpand

Use both ImageIndex & SelectedImageIndex:

private void treeView_BeforeExpand(object sender, TreeViewCancelEventArgs e)
    {
        e.Node.ImageIndex = 1;
        e.Node.SelectedImageIndex = 1;
    }
0
votes

you can use the events AfterCollapse & AfterExpand (that are avilable on the TreeView itself) to modify the image of a node.

you can get the node using the TreeViewEventArgs input parameter:

private void treeView1_AfterCollapse(object sender, TreeViewEventArgs e)
{
    e.Node.ImageIndex = 1;
}