TreeView 树形结构控件

TreeView 树形结构控件

TreeView 是一个以树形层级结构展示数据的控件，适合用来呈现具有父子关系的数据，比如文件目录、组织架构、菜单导航等。

基本使用

可以直接在设计器中通过 Nodes 属性编辑器添加节点，也可以在后台代码中动态添加。

后台动态添加节点

public Form1()
{
    InitializeComponent();

    for (int i = 0; i < 10; i++)
    {
        this.treeView1.Nodes.Add("jiedian" + i);
    }
}Code language: JavaScript (javascript)

添加子节点

// 添加根节点
TreeNode rootNode = new TreeNode("根节点");
this.treeView1.Nodes.Add(rootNode);

// 为根节点添加子节点
TreeNode childNode1 = new TreeNode("子节点1");
TreeNode childNode2 = new TreeNode("子节点2");
rootNode.Nodes.Add(childNode1);
rootNode.Nodes.Add(childNode2);

// 继续嵌套
childNode1.Nodes.Add("孙子节点1");
childNode1.Nodes.Add("孙子节点2");Code language: JavaScript (javascript)

为节点添加图标

需要配合 ImageList 使用：

this.treeView1.ImageList = this.imageList1;
this.treeView1.ImageIndex = 0;        // 默认节点图标
this.treeView1.SelectedImageIndex = 1; // 选中时节点图标

// 为单个节点指定图标
TreeNode node = new TreeNode("带图标的节点", 2, 3); // 正常时索引2，选中时索引3
this.treeView1.Nodes.Add(node);Code language: JavaScript (javascript)

属性	说明
ImageList	关联的 ImageList 控件
ImageIndex	节点默认显示的图标索引
SelectedImageIndex	节点被选中时显示的图标索引
StateImageList	状态图标列表（如勾选框）

获取点击的节点

private void treeView1_NodeMouseClick(object sender, TreeNodeMouseClickEventArgs e)
{
    TreeView tv = (TreeView)sender;

    if ((sender as TreeView) != null)
    {
        tv.SelectedNode = tv.GetNodeAt(e.X, e.Y);
    }

    MessageBox.Show(tv.SelectedNode.Text);
}Code language: JavaScript (javascript)

也可以通过 AfterSelect 事件获取：

private void treeView1_AfterSelect(object sender, TreeViewEventArgs e)
{
    MessageBox.Show(e.Node.Text);
    MessageBox.Show(e.Node.FullPath); // 完整路径，如 "根节点\子节点1"
}Code language: JavaScript (javascript)

常用属性

属性	说明
Nodes	根节点集合
SelectedNode	当前选中的节点
CheckBoxes	是否显示勾选框
ShowLines	是否显示节点之间的连接线
ShowPlusMinus	是否显示展开/折叠按钮（+/-）
ShowRootLines	是否显示根节点之间的连接线
HideSelection	失去焦点后是否仍高亮选中项
LabelEdit	是否允许编辑节点文本
Scrollable	是否显示滚动条
Sorted	是否按字母排序节点
PathSeparator	节点路径分隔符（默认 “）
TopNode	第一个可见的根节点
VisibleCount	可见节点数量

this.treeView1.CheckBoxes = true;
this.treeView1.ShowLines = true;
this.treeView1.ShowPlusMinus = true;
this.treeView1.LabelEdit = true;
this.treeView1.HideSelection = false; // 失去焦点仍高亮
this.treeView1.PathSeparator = " > ";Code language: JavaScript (javascript)

常用方法

方法	说明
ExpandAll()	展开所有节点
CollapseAll()	折叠所有节点
GetNodeAt(int x, int y)	获取指定坐标处的节点
GetNodeCount(bool)	获取节点数量（true 包含子节点）
BeginUpdate()	开始批量更新（暂停重绘，提升性能）
EndUpdate()	结束批量更新（恢复重绘）

// 批量添加节点时使用 BeginUpdate/EndUpdate 提升性能
this.treeView1.BeginUpdate();
for (int i = 0; i < 1000; i++)
{
    this.treeView1.Nodes.Add("节点" + i);
}
this.treeView1.EndUpdate();Code language: JavaScript (javascript)

常用事件

事件	说明
AfterSelect	节点选中后触发
BeforeSelect	节点选中前触发（可取消）
NodeMouseClick	节点被鼠标点击时触发
NodeMouseDoubleClick	节点被双击时触发
AfterExpand	节点展开后触发
AfterCollapse	节点折叠后触发
AfterCheck	勾选状态改变后触发
BeforeLabelEdit	编辑节点文本前触发
AfterLabelEdit	编辑节点文本后触发

// 勾选框联动
private void treeView1_AfterCheck(object sender, TreeViewEventArgs e)
{
    // 父节点勾选时，子节点全部同步
    foreach (TreeNode child in e.Node.Nodes)
    {
        child.Checked = e.Node.Checked;
    }
}Code language: PHP (php)

遍历所有节点

private void TraverseNodes(TreeNodeCollection nodes)
{
    foreach (TreeNode node in nodes)
    {
        Console.WriteLine(node.Text);
        TraverseNodes(node.Nodes); // 递归遍历子节点
    }
}

// 调用
TraverseNodes(this.treeView1.Nodes);Code language: JavaScript (javascript)

删除节点

// 删除选中节点
if (this.treeView1.SelectedNode != null)
{
    this.treeView1.Nodes.Remove(this.treeView1.SelectedNode);
}

// 按索引删除
this.treeView1.Nodes.RemoveAt(0);

// 清空所有
this.treeView1.Nodes.Clear();Code language: JavaScript (javascript)

与 ListView 的对比

对比项	TreeView	ListView
数据结构	树形层级	列表/网格
适合场景	目录结构、层级导航	文件列表、数据表格
展开/折叠	支持	不支持
勾选框	支持	支持（Details 模式）
推荐用途	资源管理器左侧目录树	文件列表、数据展示