首先来谈一下实现将自定义的类TreeMode绑定到TreeView控件上的一个基本的思路,由于每一个节点都要包含很多自定义的一些属性信息,因此我们需要将该类TreeMode进行封装,TreeView的每一个节点的类型都是TreeMode,我们还定义一些Children属性,Parent属性用于定义当前节点的子节点和父节点,当然还定义了一些常见的Name、ToolTip、ID、IsExpand、IsChecked(主要是在每一个节点前面添加了一个CheckBox)等属性,另外的一些属性就是具体需要使用的一些属性,并且该类还实现了INotifyPropertyChanged接口,从而使属性发生改变的时候提供通知,从而更新到UI上面。

另外一部分就是前台代码部分,这里贴出部分代码:

<TreeView.ItemTemplate>
<!--ItemsSource指定该类数据的子集,即下一层(HierarchicalDataTemplate.ItemTemplate)显示那些数据-->
   <HierarchicalDataTemplate DataType="{x:Type localex:TreeMode}" ItemsSource="{Binding Children}">
      <Border Name="fatherNod" MouseLeftButtonDown="fatherNod_MouseLeftButtonDown">
          <StackPanel Orientation="Horizontal" ContextMenu="{StaticResource sampleContextMenu1}" ToolTip="{Binding ToolTip}">
             <CheckBox Tag="{Binding Children}" IsChecked="{Binding IsChecked, Mode=TwoWay}" Margin="0,5,2,0" Checked="CheckBox_Checked" />
             <Image VerticalAlignment="Center" Source="{Binding Icon}"/>
         <StackPanel Orientation="Vertical">
        <TextBlock Text="{Binding CameraName}" HorizontalAlignment="Center" Width="550"/>
        <TextBox x:Name="renametextbox" Text="{Binding CameraName}" HorizontalAlignment="Center" Margin="0,-20,0,0" Width="550"
            Visibility="Collapsed" LostFocus="renametextbox_LostFous"/>
</StackPanel>
</StackPanel>
</Border>
<!--采用级联的数据模板的方式进行数据绑定-->
 <HierarchicalDataTemplate.ItemTemplate>
  <DataTemplate>
     <Border Name="sonNod" MouseLeftButtonDown="sonNod_MouseLeftButtonDown">
    <StackPanel Orientation="Horizontal" ContextMenu="{StaticResource sampleContextMenu2}" ToolTip="{Binding ToolTip}">
     <CheckBox Tag="{Binding Children}" IsChecked="{Binding IsChecked, Mode=TwoWay}" Margin="0,5,2,0" Checked="CheckBox_Checked"/>
    <Image VerticalAlignment="Center" Source="{Binding Icon}"/>
       <StackPanel Orientation="Vertical">
           <TextBlock Text="{Binding CameraInstallAdress}" HorizontalAlignment="Center" Width="450"/>
           <TextBox x:Name="renametextbox" Text="{Binding CameraName}" HorizontalAlignment="Center" Margin="0,-20,0,0" Width="460" Height="40"
            Visibility="Collapsed" LostFocus="renametextbox_LostFous"/>
       </StackPanel>
       </StackPanel>
     </Border>
   </DataTemplate>
  </HierarchicalDataTemplate.ItemTemplate>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>

前台代码的话采用级联的数据模板来进行绑定,绑定的目标是TreeMode,其它的一些控件分别绑定到对应的属性上面,这里需要特别说明一下,ItemsSource指定该类数据的子集,即下一层(HierarchicalDataTemplate.ItemTemplate)显示那些数据,这里需要特别注意。在完成了这些基本的操作之后,就是后台代码添加数据源。

这里我是通过两种方式来添加数据源的,第一种读取数据库之后将数据放到泛型List中,采用这种方式的时候会出现界面卡死的情况,这里我们定义了一个数据源属性

public List<TreeMode> ItemsSourceData
        {
             get { return itemsSourceData; }
             set
                  {
                      itemsSourceData = value;
                      this.AllNodesTreeView.ItemsSource = itemsSourceData;
                  }
       }

我们将从数据库中读取到的数据封装在一个myList=List<TreeMode>中,这里需要特别注意的是每次必须是先将this.ItemsSourceData=null,然后再将this.ItemsSource Data=myList,才能更新到UI界面上面,而且当增加项或者删除项的时候,界面会卡死掉,反应的速度特别慢,之后结合之前的一些开发经历,将List<TreeMode>改为Observ ableCollection<TreeMode>,并且在赋值的时候只需this.ItemsSourceData=myList就可以了,不用再this.ItemsSourceData=null,当然所有的List<TreeMode>必须要设置为ObservableCollection<TreeMode> ,这里就体现了两者的区别,官方的解释是表示一个动态数据集合,在添加项、移除项或刷新整个列表时,此集合将提供通知。当然我们在自己写类的时候也可以继承INotifyPropertyChanged接口,然后 定义 public event PropertyChangedEventHandler PropertyChanged事件,然后再实现PropertyChanged事件。

WPF 将数据源绑定到TreeView控件出现界面卡死的情况的更多相关文章

  1. 封装:WPF中可以绑定的BindPassWord控件

    原文:封装:WPF中可以绑定的BindPassWord控件 一.目的:本身自带的PassWord不支持绑定 二.Xaml部分 <UserControl x:Class="HeBianG ...

  2. WPF中TreeView控件SelectedItemChanged方法的MVVM绑定

    问题描述:左侧treeview控件中点击不同类别的节点时,右侧的页面会显示不同的权限.比如对于My Publications,拥有Modify和Delete两种权限,对于My Subscription ...

  3. WPF中TreeView控件的使用案例

    WPF总体来说还是比较方便的,其中变化最大的主要是Listview和Treeview控件,而且TreeView似乎在WPF是一个备受指责的控件,很多人说他不好用.我这个demo主要是在wpf中使用Tr ...

  4. 040. asp.netWeb中TreeView控件绑定XML文件

    xml文件格式: <?xml version="1.0" encoding="utf-8" ?> <sitemap title="进 ...

  5. WPF之Treeview控件简单用法

    TreeView:表示显示在树结构中分层数据具有项目可展开和折叠的控件 TreeView 的内容是可以包含丰富内容的 TreeViewItem 控件,如 Button 和 Image 控件.TreeV ...

  6. WPF 自定义TreeView控件样式,仿QQ联系人列表

    一.前言 TreeView控件在项目中使用比较频繁,普通的TreeView并不能满足我们的需求.因此我们需要滴对TreeView进行改造.下面的内容将介绍仿QQ联系人TreeView样式及TreeVi ...

  7. WPF中TreeView控件数据绑定和后台动态添加数据(二)

    写在前面:在(一)中,介绍了TreeView控件MVVM模式下数据绑定的方法.在这篇文章中,将总结给节点添加事件的方法,这样说有些不对,总之实现的效果就是点击某个节点,将出现对应于该节点的页面或者数据 ...

  8. WPF中TreeView控件数据绑定和后台动态添加数据(一)

    数据绑定: 更新内容:补充在MVVM模式上的TreeView控件数据绑定的代码. xaml代码: <TreeView Name="syntaxTree" ItemsSourc ...

  9. WPF自定义控件与样式(9)-树控件TreeView与菜单Menu-ContextMenu

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 菜单M ...

随机推荐

  1. ENQ: KO - FAST OBJECT CHECKPOINT tips

    ENQ: KO - FAST OBJECT CHECKPOINT tips Question: What does the wait event ENQ: KO - FAST OBJECT CHECK ...

  2. ind2sub

    ind2sub 线性索引的下标 语法 [I,J] = ind2sub(siz,IND)[I1,I2,I3,...,In] = ind2sub(siz,IND)   说明 ind2sub 函数确定与数组 ...

  3. [MicroPython]TPYBoard智能小车“飞奔的TPYBoard装甲一号”

    智能小车作为现代的新发明,是以后的发展方向,他可以按照预先设定的模式在一个环境里自动的运作,不需要人为的管理,可应用于科学勘探等等的用途.智能小车能够实时显示时间.速度.里程,具有自动寻迹.寻光.避障 ...

  4. 《maven in action》部分知识点总结

    maven in action 的部分知识点总结 今天又将<maven in action>这本书看了一遍,总结了一下,大概需要的知识点 (一)解耦   使用maven,在没有任何实际的J ...

  5. 如何在自定义Filter中优雅的实现静态资源放行

            在javaweb开发中,过滤器Filter比较常用于类似登录的拦截等场景.但是,当过滤器的配置不当时就会把所有的请求都拦截,静态资源也会被拦截掉,导致静态页面加载不出来. 一般的解决方 ...

  6. C#_IO操作_查询指定文件夹下的每个子文件夹占空间的大小

    1.前言 磁盘内存用掉太多,想查那些文件夹占的内存比较大,再找出没有用的文件去删除. 2.代码 static void Main(string[] args) { while (true) { //指 ...

  7. 开源组件ELK日志系统配置与管理

    ELK日志系统介绍 开源实时日志分析ELK平台能够完美的解决我们上述的问题,ELK由ElasticSearch.Logstash和Kiabana三个开源工具组成.官方网站:https://www.el ...

  8. WPF仿网易云音乐系列(一、左侧菜单栏:Expander+RadioButton)

    1.简介 上一篇咱们说到,网易云音乐的左侧菜单栏可以通过Expander+RadioButton来实现,具体如何实现,咱们下面开始干: 首先来一张网易云音乐PC版原图(个人觉得PC版比UWP版左侧菜单 ...

  9. filebeat 源码编译安装

    下载filebeat源码(6.2.3)下载地址:链接: https://pan.baidu.com/s/1cPR7-xlQJuYZ77uaUpfSpQ 提取码: k77u github下载地址:htt ...

  10. vue及Eelement使用过程中遇到的一些问题

    在做项目的过程中,目前主要遇到了以下几个问题: 一.样式问题 1.样式中使用scoped的问题: 主要表现在从一个页面跳到另一个页面时,第二个页面的样式不能正确显示,通过刷新才能恢复页面的预定样式. ...