首先来谈一下实现将自定义的类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. 安装Anaconda 之后使用ubuntu自带python

    我们知道,Ubantu系统会自带python,当你在terminal窗口中输入python,就会显示默认安装的python的信息.比如我的16.04就自带了python2.7和3.5,但是安装了Ana ...

  2. 51nod 省选联测 R2

    51nod 省选联测 R2 上场的题我到现在一道都没A,等哪天改完了再写题解吧,现在直接写第二场的. 第二场比第一场简单很多(然而这并不妨碍我不会做). A.抽卡大赛:http://www.51nod ...

  3. [ZJOI2015]诸神眷顾的幻想乡

    嘟嘟嘟 这题除了暴力我就不会了,感觉得用SAM,但是又和普通的SAM不一样. 看了题解才知道,这东西叫广义后缀自动机. 就是解决例如多个串的本质不同的子串的个数这样的问题. 做法就是每插入完一个串,就 ...

  4. Scala主构造器参数是否升级为成员与是否有get/set

    1:主构造器前面添加val/var 关键字则升级为类成员,否则只是构造器中的一个参数而已. 2:private 修饰get/set方法权限,private var/val 成员变量,则有get/set ...

  5. 【vue】vue +element 搭建项目,组件之间通信

    父子组件通信 父 通过props属性给 子传递数据 子 操作 父  this.$parent.XXX 子通过$emit传递参数 或者通过vue-bus vue-bus既可以实现父子组件之间的通信,也可 ...

  6. 003_webpack 配合babel 将es6转成es5

    今天接触了webpack,第一次使用webpack进行转码,竟然稀里糊涂就成功了,哈哈. 下面附上流程 创建个文件夹,初始化一下,首先全局安装webpack npm install webpack - ...

  7. 英文字母对应的Unicode编码

    A~Z :65~90 a~z :97~122 0-9 : 48-57 如果想要知道字符串中的值是否是小写英文字符,不使用工具包的一种方法就是使用Unicode编码值,举例: package main ...

  8. Edusoho之LNMP环境搭建

    1.更新 sudo apt-get update sudo apt-get upgrade 2.安装Nginx sudo apt-get install nginx 3.安装php sudo apt- ...

  9. 二分法binadySearch的用法

    package com.Summer_0420.cn; import java.util.Arrays; /** * @author Summer * 二分法binadySearch的用法(测试) * ...

  10. Android测试(一):在Android中测试App

    原文:https://developer.android.com/training/testing/index.html 测试你的App是开发过程中的重要组成部分.通过对应用程序持续的运行测试,你可以 ...