1、运行效果：
2、前端代码
1 &UserControl x:Class="iPIS.UI.Base.Tree.VideoTreeControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:iPIS.UI.Base.Tree"
mc:Ignorable="d"
d:DesignHeight="50" d:DesignWidth="80"&
&UserControl.Resources&
<span style="color: #
&ResourceDictionary&
<span style="color: #
&ResourceDictionary.MergedDictionaries&
<span style="color: #
&ResourceDictionary Source="/iPIS.UI.Themes.Bcomponent/Base/Tree/VideoTreeControlImages.xaml"/&
<span style="color: #
&/ResourceDictionary.MergedDictionaries&
<span style="color: #
&Style TargetType="TextBlock" x:Key="fontstyle"&
<span style="color: #
&Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:VideoTreeControl},Path=VideoTreeControlFontColor}"&&/Setter&
<span style="color: #
&Setter Property="FontSize" Value="14"&&/Setter&
<span style="color: #
&Setter Property="VerticalAlignment" Value="Center"&&/Setter&
<span style="color: #
<span style="color: #
&/ResourceDictionary&
<span style="color: #
&/UserControl.Resources&
<span style="color: #
<span style="color: #
&TreeView x:Name="tree"
<span style="color: #
AllowDrop="True"
<span style="color: #
ItemsSource="{Binding DataList}"
<span style="color: #
Background="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:VideoTreeControl},Path=VideoTreeControlBackground}"
<span style="color: #
<span style="color: #
&TreeView.ItemTemplate&
<span style="color: #
&HierarchicalDataTemplate ItemsSource="{Binding Children}"&
<span style="color: #
&Grid x:Name="grid"
<span style="color: #
Margin="-1 0 0 0"
<span style="color: #
Background="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:VideoTreeControl},Path=VideoTreeControlBackground}"
<span style="color: #
<span style="color: #
&StackPanel Grid.Column="1"
<span style="color: #
Orientation="Horizontal"
<span style="color: #
Cursor="Hand"
<span style="color: #
Height="40"
<span style="color: #
VerticalAlignment="Center"
<span style="color: #
<span style="color: #
&Image x:Name="icon" Width="19" Height="16" VerticalAlignment="Center" Margin="0 0 5 0"&&/Image&
<span style="color: #
&TextBlock Text="{Binding Text}" Style="{StaticResource fontstyle}"&&/TextBlock&
<span style="color: #
&StackPanel x:Name="cc"
<span style="color: #
Orientation="Horizontal"
<span style="color: #
Visibility="Collapsed"
<span style="color: #
Margin="0 0 -1 0"
<span style="color: #
Background="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=local:VideoTreeControl},Path=VideoTreeControlBackground}"
<span style="color: #
<span style="color: #
&TextBlock Style="{StaticResource fontstyle}"&(&/TextBlock&
<span style="color: #
&TextBlock Text="{Binding FileCount}" Style="{StaticResource fontstyle}"&&/TextBlock&
<span style="color: #
&TextBlock Style="{StaticResource fontstyle}"&)&/TextBlock&
<span style="color: #
&/StackPanel&
<span style="color: #
&/StackPanel&
<span style="color: #
&!--模拟通行下划线--&
<span style="color: #
<span style="color: #
&Line X1="0" Y1="39" X2="1000" Y2="39" Stroke="#4a4a4a" Margin="-500 0 0 0" StrokeThickness="1"&&/Line&
<span style="color: #
<span style="color: #
<span style="color: #
&HierarchicalDataTemplate.Triggers&
<span style="color: #
&DataTrigger Binding="{Binding Type}" Value="-1"&
<span style="color: #
&Setter TargetName="icon" Property="Source" Value="{StaticResource icon_default}"&&/Setter&
<span style="color: #
&/DataTrigger&
<span style="color: #
&DataTrigger Binding="{Binding Type}" Value="0"&
<span style="color: #
&Setter TargetName="icon" Property="Source" Value="{StaticResource icon_yuan}"&&/Setter&
<span style="color: #
&/DataTrigger&
<span style="color: #
&DataTrigger Binding="{Binding Type}" Value="1"&
<span style="color: #
&Setter TargetName="icon" Property="Source" Value="{StaticResource icon_pian}"&&/Setter&
<span style="color: #
&/DataTrigger&
<span style="color: #
&DataTrigger Binding="{Binding Type}" Value="2"&
<span style="color: #
&Setter TargetName="icon" Property="Source" Value="{StaticResource icon_xulie}"&&/Setter&
<span style="color: #
&/DataTrigger&
<span style="color: #
&DataTrigger Binding="{Binding Type}" Value="-1"&
<span style="color: #
&Setter TargetName="cc" Property="Visibility" Value="Visible"&&/Setter&
<span style="color: #
&/DataTrigger&
<span style="color: #
&/HierarchicalDataTemplate.Triggers&
<span style="color: #
&/HierarchicalDataTemplate&
<span style="color: #
&/TreeView.ItemTemplate&
<span style="color: #
&/TreeView&
<span style="color: #
<span style="color: # &/UserControl&
3、控件的后台代码
1 using iPIS.UI.Base.M
2 using iPIS.UI.Base.ViewM
4 using System.Collections.G
5 using System.L
6 using System.T
7 using System.Threading.T
8 using System.W
9 using System.Windows.C
10 using System.Windows.D
11 using System.Windows.D
12 using System.Windows.I
13 using System.Windows.M
14 using System.Windows.Media.I
15 using System.Windows.N
16 using System.Windows.S
18 namespace iPIS.UI.Base.Tree
/// &summary&
/// VideoTreeControl.xaml 的交互逻辑
/// &/summary&
public partial class VideoTreeControl : UserControl
public VideoTreeControl()
InitializeComponent();
this.DataContext = new VideoTreeControlViewModel();
//默认样式
VideoTreeControlBackground = "#36353a";
VideoTreeControlFontColor = "#9a9a9a";
tree.SelectedItemChanged += Tree_SelectedItemC
tree.MouseDoubleClick += Tree_MouseDoubleC
/// &summary&
/// 上下文
/// &/summary&
VideoTreeControlViewModel vm
return this.DataContext as VideoTreeControlViewM
/// &summary&
/// 背景颜色
/// &/summary&
public string VideoTreeControlBackground
get { return (string)GetValue(VideoTreeControlBackgroundProperty); }
set { SetValue(VideoTreeControlBackgroundProperty, value); }
/// &summary&
/// 字体颜色
/// &/summary&
public string VideoTreeControlFontColor
get { return (string)GetValue(VideoTreeControlFontColorProperty); }
set { SetValue(VideoTreeControlFontColorProperty, value); }
#region 附加属性
public static readonly DependencyProperty VideoTreeControlFontColorProperty =
DependencyProperty.Register("VideoTreeControlFontColor", typeof(string), typeof(VideoTreeControl), new PropertyMetadata(""));
public static readonly DependencyProperty VideoTreeControlBackgroundProperty =
DependencyProperty.Register("VideoTreeControlBackground", typeof(string), typeof(VideoTreeControl), new PropertyMetadata(""));
#endregion
#region 公开事件
/// &summary&
/// 双击节点
/// &/summary&
public event EventHandler&VideoTreeControlItemModel& DoubleClickTreeI
/// &summary&
/// 节点选中变更
/// &/summary&
public event EventHandler&VideoTreeControlItemModel& SelectedItemC
#endregion
/// &summary&
/// 选中时
/// &/summary&
/// &param name="sender"&&/param&
/// &param name="e"&&/param&
private void Tree_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs&object& e)
var datamodel = e.NewValue as VideoTreeControlItemM
if (datamodel.Type == VideoTreeControlItemType.Root) return;//过滤root
SelectedItemChanged?.Invoke(vm, datamodel);
//获取方式
e.Data.GetData(typeof(Base.Model.VideoTreeControlItemModel))
DragDrop.DoDragDrop(sender as FrameworkElement, datamodel, DragDropEffects.Copy);
<span style="color: #0
<span style="color: #1
DragDrop.DoDragDrop(sender as FrameworkElement, new ImageTreeControlImageModel()
<span style="color: #2
<span style="color: #3
Text = "我是拖进来的",
<span style="color: #4
Type = ImageTreeControlImageType.AlreadyMatting,
<span style="color: #5
ImageSource = new BitmapImage(new Uri("D:\\上传资源\\xxx.png", UriKind.Absolute))
<span style="color: #6
}, DragDropEffects.Copy);
<span style="color: #7
<span style="color: #8
<span style="color: #9
<span style="color: #0
/// &summary&
<span style="color: #1
/// 双击节点
<span style="color: #2
/// &/summary&
<span style="color: #3
/// &param name="sender"&&/param&
<span style="color: #4
/// &param name="e"&&/param&
<span style="color: #5
private void Tree_MouseDoubleClick(object sender, MouseButtonEventArgs e)
<span style="color: #6
<span style="color: #7
var datamodel = tree.SelectedValue as VideoTreeControlItemM
<span style="color: #8
if (datamodel == null || datamodel.Type == VideoTreeControlItemType.Root) return;//过滤root
<span style="color: #9
DoubleClickTreeItem?.Invoke(vm, datamodel);
<span style="color: #0
<span style="color: #1
<span style="color: #2 }
4、控件的datacontext对象
1 using iPIS.UI.Base.M
3 using System.Collections.G
4 using System.Collections.ObjectM
5 using System.ComponentM
6 using System.L
7 using System.T
8 using System.Threading.T
9 using System.Windows.I
<span style="color: #
<span style="color: # namespace iPIS.UI.Base.ViewModel
<span style="color: # {
<span style="color: #
public class VideoTreeControlViewModel : INotifyPropertyChanged
<span style="color: #
<span style="color: #
public event PropertyChangedEventHandler PropertyC
<span style="color: #
<span style="color: #
private ObservableCollection&VideoTreeControlItemModel& _DataL
<span style="color: #
<span style="color: #
/// &summary&
<span style="color: #
/// 数据源
<span style="color: #
/// &/summary&
<span style="color: #
public ObservableCollection&VideoTreeControlItemModel& DataList
<span style="color: #
<span style="color: #
get =& _DataL
<span style="color: #
<span style="color: #
<span style="color: #
//检查是否有roo，不存在生成默认root
<span style="color: #
if (value.Where(c =& c.Type == VideoTreeControlItemType.Root).Count() == <span style="color: #)
<span style="color: #
<span style="color: #
_DataList = new ObservableCollection&VideoTreeControlItemModel&() {
<span style="color: #
new VideoTreeControlItemModel(){
<span style="color: #
Text = "默认",
<span style="color: #
Children = value,
<span style="color: #
Type = VideoTreeControlItemType.Root//标示为root
<span style="color: #
<span style="color: #
<span style="color: #
<span style="color: #
<span style="color: #
_DataList =
<span style="color: #
PropertyChanged?.Notify(() =& this.DataList);
<span style="color: #
<span style="color: #
<span style="color: #
<span style="color: # }
5、数据实体&
2 using System.Collections.G
3 using System.Collections.ObjectM
4 using System.L
5 using System.T
6 using System.Threading.T
8 namespace iPIS.UI.Base.Model
/// &summary&
/// 视频图片树状控件，数据映射实体
/// &/summary&
public class VideoTreeControlItemModel
private string _id = string.E
/// &summary&
/// 唯一标示符
/// &/summary&
public string Id
//如果调用者未显示给入唯一标识符，将默认生成一个唯一标识符
if (string.IsNullOrEmpty(_id)) _id = Guid.NewGuid().ToString();
/// &summary&
/// 显示值
/// &/summary&
public string Text { get; set; }
/// &summary&
/// 绑定值
/// &/summary&
public object Value { get; set; }
/// &summary&
/// 类型，-1：根；0：原始视频；1：片段
/// &/summary&
public VideoTreeControlItemType Type { get; set; } = VideoTreeControlItemType.O
/// &summary&
/// &/summary&
public ObservableCollection&VideoTreeControlItemModel& Children { get; set; } = new ObservableCollection&VideoTreeControlItemModel&();
/// &summary&
/// 文件个数，Type=root时有效
/// &/summary&
public int FileCount
if (Type != VideoTreeControlItemType.Root) return <span style="color: #;
List&VideoTreeControlItemModel& outlist = new List&VideoTreeControlItemModel&();
GetFiles(this, outlist);
return outlist.C
/// &summary&
/// 获取当前model下所有的文件实体，包含自己
/// &/summary&
/// &param name="model"&指定的对象&/param&
/// &param name="outlist"&匹配到的从这里返回&/param&
private void GetFiles(VideoTreeControlItemModel model, List&VideoTreeControlItemModel& outlist)
if (outlist == null) outlist = new List&VideoTreeControlItemModel&();
if (model.Type != VideoTreeControlItemType.Root)
outlist.Add(model);
foreach (var item in model.Children)
GetFiles(item, outlist);
/// &summary&
/// 视频树，子项类型
/// &/summary&
public enum VideoTreeControlItemType
/// &summary&
/// &/summary&
Root = -<span style="color: #,
/// &summary&
/// 原始视频
/// &/summary&
Original = <span style="color: #,
<span style="color: #0
/// &summary&
<span style="color: #1
<span style="color: #2
/// &/summary&
<span style="color: #3
Fragment = <span style="color: #,
<span style="color: #4
/// &summary&
<span style="color: #5
/// 序列化
<span style="color: #6
/// &/summary&
<span style="color: #7
Sequence = <span style="color: #
<span style="color: #8
<span style="color: #9 }
上面是完整效果的全部源码，下面我讲介绍我在封装的时候遇到的问题，并附上解决方案
1、如何自定义图标
答：系统内置一些图标在资源里面，通过属性值绑定不同的图片，因为图标总共就3个所有无需调用者指定，直接内置，通过类型区分匹配即可
下面圈注关键代码
2、如何生成通行的分割线
答：通过Canvas来画线，线条尽可能的长，已达到通行的效果，并且还要距左为负数，已抵消数字控件的子集缩进
附上关键代码
3、自定义树的背景效果加上上，发现一个很囧的问题，获得焦点和失去焦点的节点背景很丑，默认获得焦点是蓝色背景，失去焦点是白色背景，欧码噶
答：肯定是要干掉，必须干掉
附上关键代码
4、由于问题3，又新出一个诡异的问题，就是遮挡不完全，会出现一个1-2像素的竖线，经过调试查看发现是节点内置了border导致的，然后这个又没办法重写掉
答：几经周折，发现利用Margin可以抵消，真是大快人心
这是获得焦点
这是失去焦点
解决的关键代码
阅读(...) 评论()ASP.NET TreeView鼠标移动到叶节点改变颜色和显示下划线问题
[问题点数：20分，结帖人ljz_08]
本版专家分：80
结帖率 65.52%
CSDN今日推荐
本版专家分：81
本版专家分：80
本版专家分：0
匿名用户不能发表回复！|
其他相关推荐如何在每个treeview节点上动态增加子节点？
[问题点数：30分，结帖人Jonvy2016]
本版专家分：10
结帖率 90.91%
CSDN今日推荐
本版专家分：4801
本版专家分：48219
2018年5月 Delphi大版内专家分月排行榜第一2018年2月 Delphi大版内专家分月排行榜第一2018年1月 Delphi大版内专家分月排行榜第一2017年12月 Delphi大版内专家分月排行榜第一2017年8月 Delphi大版内专家分月排行榜第一2017年7月 Delphi大版内专家分月排行榜第一2017年5月 Delphi大版内专家分月排行榜第一2017年3月 Delphi大版内专家分月排行榜第一2017年2月 Delphi大版内专家分月排行榜第一2016年12月 Delphi大版内专家分月排行榜第一2016年11月 Delphi大版内专家分月排行榜第一2016年10月 Delphi大版内专家分月排行榜第一2016年9月 Delphi大版内专家分月排行榜第一2016年8月 Delphi大版内专家分月排行榜第一2016年7月 Delphi大版内专家分月排行榜第一2016年6月 Delphi大版内专家分月排行榜第一2016年5月 Delphi大版内专家分月排行榜第一2016年4月 Delphi大版内专家分月排行榜第一2016年3月 Delphi大版内专家分月排行榜第一2016年2月 Delphi大版内专家分月排行榜第一2016年1月 Delphi大版内专家分月排行榜第一2015年12月 Delphi大版内专家分月排行榜第一2015年11月 Delphi大版内专家分月排行榜第一2015年10月 Delphi大版内专家分月排行榜第一2015年9月 Delphi大版内专家分月排行榜第一2015年8月 Delphi大版内专家分月排行榜第一2015年7月 Delphi大版内专家分月排行榜第一2015年6月 Delphi大版内专家分月排行榜第一2015年5月 Delphi大版内专家分月排行榜第一2015年4月 Delphi大版内专家分月排行榜第一2015年3月 Delphi大版内专家分月排行榜第一2015年2月 Delphi大版内专家分月排行榜第一2015年1月 Delphi大版内专家分月排行榜第一2014年12月 Delphi大版内专家分月排行榜第一2014年11月 Delphi大版内专家分月排行榜第一
2017年11月 Delphi大版内专家分月排行榜第二2017年4月 Delphi大版内专家分月排行榜第二2017年1月 Delphi大版内专家分月排行榜第二2014年10月 Delphi大版内专家分月排行榜第二2014年9月 Delphi大版内专家分月排行榜第二
本版专家分：3899
2017年4月 Delphi大版内专家分月排行榜第一2017年1月 Delphi大版内专家分月排行榜第一
2017年3月 Delphi大版内专家分月排行榜第二2016年12月 Delphi大版内专家分月排行榜第二
本版专家分：10
匿名用户不能发表回复！|
其他相关推荐——空间经济分析
如何在右键单击treeview的某节点时，同时选中该节点？
右键单击treeview弹出菜单，但选中的节点却是之前用左键选中的那个节点，而不是这时用右键选中的那个。
解决方法：
private void treeView1_NodeMouseClick(object sender, TreeNodeMouseClickEventArgs e)
if (e.Button == MouseButtons.Right)
treeView1.SelectedNode = treeView1.GetNodeAt(e.X, e.Y);//选中该节点
Point p = this.treeView1.PointToClient(Cursor.Position);
this.contextMenuStrip1.Show(this.treeView1,p);
}注意，必须通过GetNodeAt函数获取node，而不能将一个node直接赋给SelectedNode
C# winform TreeView设置为选中状态（蓝底白字）
求助:程序如何模拟鼠标点击一个TreeView节点?
c# 右键并选中treeview节点
C# treeview默认选中一个节点
默认选中TreeView某个节点的方法
没有更多推荐了，treeview1如何在子节点下添加子节点_百度知道
treeview1如何在子节点下添加子节点
从数据库中读取C#treeView1.Nodes[].Nodes.Add(node)我表里也有具体的标识,就是不知道,我对treeView属性不太了解,不知道子节点的子节点,该怎么自动判断添加...
从数据库中读取 C#treeView1.Nodes[].Nodes.Add(node)我表里也有具体的标识,就是不知道,我对treeView属性不太了解,不知道子节点的子节点,该怎么自动判断添加
&#xe6b9;答题抽奖
首次认真答题后
即可获得3次抽奖机会，100%中奖。
nicelife2014知道合伙人
来自知道合伙人认证行家
nicelife2014
知道合伙人
互联网类行家
采纳数：22679
获赞数：82499
从事多年网络方面工作，有丰富的互联网经验。
&private&void&AddNode(TreeNode&ParentNode,&TreeNode&childNode,&string&nodeText,&string&nodeValue,&string&nodeNavigateUrl)&&&&{&&&&&&&&childNode.Text&=&nodeT//设置子节点的显示文字&&&&&&&&childNode.Value&=&nodeV//设置子节点的数值&&&&&&&&childNode.NavigateUrl&=&nodeNavigateU//设置子节点的链接路径&&&&&&&&ParentNode.ChildNodes.Add(childNode);&&&&&&&&&&&&&}&&&&protected&void&TreeView2_SelectedNodeChanged(object&sender,&EventArgs&e)&&&&{&&&&&&&&TreeNode&parentNode&=&this.TreeView2.SelectedN&&&&&&&&TreeNode&childNode&=&new&TreeNode();&&&&&&&&AddNode(parentNode,&childNode,&&显示文字&,&&节点值&,&&);&&&&&&&&this.TreeView2.SelectedNode.Selected&=&&&&&&&&&Response.Write(parentNode.Text);&&&&}&&&&这样单击节点，就可以添加新的节点。注意，树中每个节点的Value值最好都设置成不一样，因为它添加节点是按valuePath来寻找的，如果value值一样的话，路径很可能会找错，从而添加都另外的节点下。
时比西风知道合伙人
采纳数：78
获赞数：323
这需要数据库设计的支持了.要在这张表里添加个字段：FartherNode,以此为标识，用循环程序控制，父节Node1，从数据库中选出所有FartherNode是Node1的，循环添加。哦，我明白你什么意思了.建树形应该用递归的。这样可以么，就是在数据库里在加一个字段存储子节点即ChildNode，它是bool型的,如果下面还有子节点的话就是true，反之为false，然后递归判断,只要不是false，就new 一个Node,然后node.aad();..你写的方法行不通，因为数据都是动态的，你不可能知道所有的节点数据的.如果是固态的,何必写程序控制呢.
本回答被提问者采纳
ksca知道合伙人
采纳数：88
获赞数：288
选中你想要再添加子节点的节点，然后再点添加“添加子级”
为你推荐：
其他类似问题
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。}