WPF之TreeView操作实战
1、绑定层级数据源
绘制名称为TreeView_NodeList的TreeView控件，使用HierarchicalDataTemplate类将具有层级结构的数据源绑定至TreeView控件。
本文为CSDN博主「三五月儿」
<TreeView Name="TreeView_NodeList">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type local:Node}" ItemsSource="{Binding Nodes,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}">
<StackPanel Orientation="Horizontal" Margin="0,2,0,2">
<TextBlock Text="{Binding NodeName,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" ToolTip="{Binding NodeName,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.Resources>
</TreeView>其中Node类的定义如下所示。Node对象使用NodeId作为主键进行区分，NodeId为32位的GUID。Node的属性Nodes保存节点的子节点集合。属性IsDeleted 标记节点是否被删除。
public class Node
public Node()
this.NodeId = Guid.NewGuid().ToString();
this.IsDeleted = false;
this.Nodes = new List<Node>();
/// <summary>
/// 节点ID
/// </summary>
public string NodeId { get; set; }
/// <summary>
/// 节点名称
/// </summary>
public string NodeName { get; set; }
/// <summary>
/// 节点携带的内容
/// </summary>
public string NodeContent { get; set; }
/// <summary>
/// 被删除
/// </summary>
public bool IsDeleted { get; set; }
/// <summary>
/// 节点类型
/// </summary>
public NodeType NodeType { get; set; }
/// <summary>
/// 子节点集合
/// </summary>
public List<Node> Nodes { get; set; }
}枚举类型的NodeType属性表示节点的类型，节点具有根节点、叶子节点和结构节点三种类别。叶子节点不支持增加节点操作、非叶子结点不支持删除节点的操作。
public enum NodeType
RootNode,//根节点
LeafNode,//叶子节点
StructureNode//结构节点，仅起到组织配置文件结构的作用，不参与修改
}下面的方法生成TreeView使用到的示例数据。生产环境中往往通过解析xml或者ini等文件或者访问数据库得到层级数据源。
private List<Node> GetNodeList()
Node leafOneNode = new Node();
leafOneNode.NodeName = "叶子节点一";
leafOneNode.NodeContent = "我是叶子节点一";
leafOneNode.NodeType = NodeType.LeafNode;
leafOneNode.Nodes = new List<Node>();
Node leafTwoNode = new Node();
leafTwoNode.NodeName = "叶子节点二";
leafTwoNode.NodeContent = "我是叶子节点二";
leafTwoNode.NodeType = NodeType.LeafNode;
leafTwoNode.Nodes = new List<Node>();
Node leafThreeNode = new Node();
leafThreeNode.NodeName = "叶子节点三";
leafThreeNode.NodeContent = "我是叶子节点三";
leafThreeNode.NodeType = NodeType.LeafNode;
leafThreeNode.Nodes = new List<Node>();
Node secondLevelNode = new Node();
secondLevelNode.NodeName = "二级节点";
secondLevelNode.NodeContent = "我是二级节点";
secondLevelNode.NodeType = NodeType.StructureNode;
secondLevelNode.Nodes = new List<Node>() { leafOneNode, leafTwoNode, leafThreeNode };
Node firstLevelNode = new Node();
firstLevelNode.NodeName = "一级节点";
firstLevelNode.NodeContent = "我是一级节点";
firstLevelNode.NodeType = NodeType.StructureNode;
firstLevelNode.Nodes = new List<Node>() { secondLevelNode };
return new List<Node>()
new Node(){NodeName="根节点",NodeContent="我是根节点",NodeType=NodeType.RootNode,Nodes=new List<Node>(){firstLevelNode}}
}程序使用nodeList接收返回的测试数据，并在页面的Loaded事件中进行数据绑定。
public List<Node> nodeList { get; set; }
private void Window_Loaded(object sender, RoutedEventArgs e)
nodeList = GetNodeList();
this.TreeView_NodeList.ItemsSource = nodeList;
ExpandTree();
}2、展开所有节点
其中使用到的ExpandTree()方法实现展开TreeView的所有节点。
private void ExpandTree()
if (this.TreeView_NodeList.Items != null && this.TreeView_NodeList.Items.Count > 0)
foreach (var item in this.TreeView_NodeList.Items)
DependencyObject dependencyObject = this.TreeView_NodeList.ItemContainerGenerator.ContainerFromItem(item);
if (dependencyObject != null)//第一次打开程序，dependencyObject为null，会出错
((TreeViewItem)dependencyObject).ExpandSubtree();
}执行程序，可以得到下面的执行结果。
3、增加和删除节点
下面给TreeView增加右键弹出菜单，实现“增加节点”和“删除节点”的操作。
画面代码中设置TreeView的ContextMenu属性，增加弹出菜单项。
<TreeView.ContextMenu>
<ContextMenu x:Name="ContextMenu_EditNode">
<MenuItem Header="新增节点" Name="MenuItem_AddNode" Click="MenuItem_AddNode_Click"/>
<MenuItem Header="删除节点" Name="MenuItem_DeleteNode" Click="MenuItem_DeleteNode_Click"/>
</ContextMenu>
</TreeView.ContextMenu>下面是增加节点和删除节点的具体逻辑代码。
/// <summary>
/// 新增节点
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void MenuItem_AddNode_Click(object sender, RoutedEventArgs e)
var currentNode = FindTheNode(nodeList, selectedNode.NodeId);
if (currentNode != null)
if (currentNode.NodeType == NodeType.LeafNode)
MessageBox.Show("叶子节点不支持新增节点操作!");
MessageBox.Show("开始新增节点操作!");
/// <summary>
/// 删除节点
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void MenuItem_DeleteNode_Click(object sender, RoutedEventArgs e)
var currentNode = FindTheNode(nodeList, selectedNode.NodeId);
if (currentNode != null)
if (currentNode.NodeType != NodeType.LeafNode)
MessageBox.Show("非叶子节点不支持删除操作!");
MessageBoxResult dr = MessageBox.Show("确定要删除这个节点吗？", "提示", MessageBoxButton.OKCancel);
if (dr == MessageBoxResult.OK)
DeleteTheNode(nodeList, currentNode);
MessageBox.Show("成功删除节点！");
return;
}其中删除节点需要使用下面的DeleteTheNode()方法，该方法使用递归思想实现删除指定节点的逻辑。
private void DeleteTheNode(List<Node> nodeList, Node deleteNode)
foreach (Node node in nodeList)
if (node.Nodes != null && node.Nodes.Count > 0)
DeleteTheNode(node.Nodes, deleteNode);
if (node == deleteNode)
node.IsDeleted = true;
}不管是删除节点还是新增节点，都需要获取当前选中的节点，使用FindTheNode()方法实现。
private Node FindTheNode(List<Node> nodeList, string nodeId)
Node findedNode = null;
foreach (Node node in nodeList)
if (node.Nodes != null && node.Nodes.Count > 0)
if ((findedNode = FindTheNode(node.Nodes, nodeId)) != null)
return findedNode;
if (node.NodeId == nodeId)
return node;
return findedNode;
}4、处理PreviewMouseRightButtonDown事件
因为叶子节点不支持增加节点操作，非叶子结点不支持删除节点操作，所以在点击鼠标右键时，需要检测选中节点的类型并进行控制。
为了实现这个功能，可以为TreeView绑定事件PreviewMouseRightButtonDown，在事件处理器中进行相应的控制即可。
<TreeView.ItemContainerStyle>
<Style TargetType="{x:Type TreeViewItem}">
<EventSetter Event="TreeViewItem.PreviewMouseRightButtonDown" Handler="TreeViewItem_PreviewMouseRightButtonDown"/>
</Style>
</TreeView.ItemContainerStyle>下面是PreviewMouseRightButtonDown事件的事件处理器代码。
private void TreeViewItem_PreviewMouseRightButtonDown(object sender, MouseButtonEventArgs e)
var treeViewItem = VisualUpwardSearch<TreeViewItem>(e.OriginalSource as DependencyObject) as TreeViewItem;
if (treeViewItem != null)
Node currentNode = treeViewItem.Header as Node;
if (currentNode.NodeType != NodeType.LeafNode)
MenuItem_AddNode.IsEnabled = true;
MenuItem_DeleteNode.IsEnabled = false;
MenuItem_AddNode.IsEnabled = false;
MenuItem_DeleteNode.IsEnabled = true;
treeViewItem.Focus();
e.Handled = true;
}代码中使用到VisualUpwardSearch()方法，该方法用于寻找控件的最外层父控件。
private DependencyObject VisualUpwardSearch<T>(DependencyObject source)
while (source != null && source.GetType() != typeof(T))
source = VisualTreeHelper.GetParent(source);
return source;
}5、查找下一个节点
有时候，还需要实现循环“查找下一个”的功能，在画面中增加输入框和按钮。
<TextBox x:Name="TextBox_FindNextNode" Grid.Column="1" HorizontalAlignment="Left" Height="23" Margin="49,20,-160,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120" LostFocus="TextBox_FindNextNode_LostFocus"/>
<Button x:Name="Button_FindNextNode" Content="查找下一个" Grid.Column="1" HorizontalAlignment="Left" Margin="188,20,-254,0" VerticalAlignment="Top" Width="75" Click="Button_FindNextNode_Click"/>为了实现循环“查找下一个”，定义了下面两个对象。
private int nextSearchedNodeIndex = -1;
public List<Node> searchedNodeList { get; set; }searchedNodeList 记录根据关键字查找到的所有匹配的节点，nextSearchedNodeIndex 记录当前查看节点的位置。
搜索框失去焦点时，查找匹配的节点并保存至searchedNodeList ，同时将索引置为-1。
private void TextBox_FindNextNode_LostFocus(object sender, RoutedEventArgs e)
if (!string.IsNullOrEmpty(this.TextBox_FindNextNode.Text.Trim()))
nextSearchedNodeIndex = -1;
searchedNodeList = FindMatchedNodes(nodeList, this.TextBox_FindNextNode.Text.Trim());
}点击“查找下一个”按钮，新增nextSearchedNodeIndex ，再使用nextSearchedNodeIndex 从searchedNodeList拿到当前展示的节点。这里需要注意的是一轮循环结束后，nextSearchedNodeIndex 再次置为-1，循环重新开始。
private void Button_FindNextNode_Click(object sender, RoutedEventArgs e)
if (string.IsNullOrEmpty(this.TextBox_FindNextNode.Text.Trim()))
MessageBox.Show("请输入查找条件!");
return;
if (searchedNodeList != null && searchedNodeList.Count > 0)
//循环查找下一个
if (nextSearchedNodeIndex >= searchedNodeList.Count - 1)
nextSearchedNodeIndex = -1;
nextSearchedNodeIndex += 1;
selectedNode = searchedNodeList[nextSearchedNodeIndex];
SelectTheCurrentNode();
MessageBox.Show("没有找到满足条件的节点");
}其中，查找匹配节点的逻辑由FindMatchedNodes()方法完成，该方法同样使用递归思想来实现。
private List<Node> FindMatchedNodes(List<Node> srcNodeList, string filterString)
List<Node> destNodeList = new List<Node>();
foreach (Node node in srcNodeList)
if (node.NodeName.Contains(filterString))
destNodeList.Add(node);
if (node.Nodes != null && node.Nodes.Count > 0)
destNodeList.AddRange(FindMatchedNodes(node.Nodes, filterString));
return destNodeList;
}其中，SelectTheCurrentNode()方法实现选中当前节点，并将焦点置于当前选中节点。这里同样离不开递归的功劳。
private void SelectTheCurrentNode()
if (this.TreeView_NodeList.Items != null && this.TreeView_NodeList.Items.Count > 0)
foreach (var item in this.TreeView_NodeList.Items)
DependencyObject dependencyObject = this.TreeView_NodeList.ItemContainerGenerator.ContainerFromItem(item);
if (dependencyObject != null)//第一次打开程序，dependencyObject为null，会出错
TreeViewItem tvi = (TreeViewItem)dependencyObject;
if ((tvi.Header as Node).NodeId == selectedNode.NodeId)
tvi.IsSelected = true;
tvi.Focus();
SetNodeSelected(tvi);
private void SetNodeSelected(TreeViewItem Item)
foreach (var item in Item.Items)
DependencyObject dependencyObject = Item.ItemContainerGenerator.ContainerFromItem(item);
if (dependencyObject != null)
TreeViewItem treeViewItem = (TreeViewItem)dependencyObject;
if ((treeViewItem.Header as Node).NodeId == selectedNode.NodeId)
treeViewItem.IsSelected = true;
treeViewItem.Focus();
treeViewItem.IsSelected = false;
if (treeViewItem.HasItems)
SetNodeSelected(treeViewItem);
}6、处理SelectedItemChanged事件
操作TreeView，不然会选中节点，触发SelectedItemChanged事件，下面是SelectedItemChanged事件的处理代码。
private void TreeView_NodeList_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e)
Node node = this.TreeView_NodeList.SelectedItem as Node;