玩转INotifyPropertyChanged和ObservableCollection

本文的代码都是基于WPF的,对于Silverlight,这些技术也同样适用。

(一)INotifyPropertyChanged的使用场合

先写一个最简单的数据绑定,每次点击Button后,TextBlock的值都会自增1。

效果图如下所示:

这里使用了MVVM模式,并把Click事件抽象为了Command。

代码下载:WpfApplication4_1.zip

观察上面的代码,注意到几个细节:

1. UserName和Age属性作为ViewModel的两个属性,因为Age递增是基于绑定实现的,所以ViewModel要实现INotifyPropertyChanged接口。

2. 我们只在Age上添加了OnPropertyChanged方法,它会根据Age属性的变化而自动更新XAML中绑定的值。

而对于UserName属性,由于它是始终不变的,所以没有添加OnPropertyChanged方法。

由此可见,OnPropertyChanged方法决定了后台数据的变化是否能影响到前台绑定的XAML。

此外,对于一次性绑定(以后不会再改变)的属性,不要添加OnPropertyChanged方法,因为该方法会增加额外的性能开销。

但是,在MVVM模式中,我们常常将UserName和Age属性抽象出来,作为一个实体类:

    public class UserInfo
    {
        public string UserName { get; set; }
        public int Age { get; set; }
    }

与此同时,在ViewModel中添加一个UserInfo类型的属性:

public class RegisterUserViewModel : INotifyPropertyChanged
    {
        public UserInfo User { get; set; }

注意:此时XAML中的绑定相应要修改为:

<TextBlock Name="tbUserName" Text="{Binding User.UserName}" …. />
<TextBlock Name="tbAge" Text="{Binding User. Age}" …. />

这时候问题就来了。到底是UserInfo实现INotifyPropertyChanged接口呢,还是ViewModel实现INotifyPropertyChanged接口呢?

1.如果UserInfo实现INotifyPropertyChanged接口,,那么UserInfo实体类相应地修改为:

    public class UserInfo : INotifyPropertyChanged
    {
        public string UserName { get; set; }

        private int age;
        public int Age
        {
            get
            {
                return this.age;
            }
            set
            {
                if (this.age != value)
                {
                    this.age = value;
                    OnPropertyChanged("Age");
                }
            }
        }

        INotifyPropertyChanged Members
    }

而ViewModel相应地就简化了:

    public class RegisterUserViewModel
    {
        public RegisterUserViewModel()
        {
            this.User = new UserInfo { UserName = "Baobao", Age = 27 };
            ClickCommand = new DelegateCommand<object>(OnClick, arg => true);
        }

        void OnClick(object obj)
        {
            this.User.Age += 1;
        }

        public UserInfo User { get; set; }

        public RegisterUserView View { get; set; }
        
        public ICommand ClickCommand { get; set; }
    }

注意到,此时ViewModel不需要实现INotifyPropertyChanged接口。因为INotifyPropertyChanged监视的是UserInfo实体里面的Age属性,所以在OnClick方法中,只要修改User实体的Age属性就能通知XAML做出改变。

示例下载:WpfApplication4_2.zip

2.如果UserInfo不实现INotifyPropertyChanged接口,那么这个实体类就非常简单了:

    public class UserInfo
    {
        public string UserName { get; set; }
        public int Age { get; set; }
    }

这时,ViewModel就必须要实现INotifyPropertyChanged接口,而且要为User属性添加OnPropertyChanged方法,以下是部分代码(省略了INotifyPropertyChanged接口的实现):

    public class RegisterUserViewModel : INotifyPropertyChanged
    {
        public RegisterUserViewModel()
        {
            this.User = new UserInfo { UserName = "Baobao", Age = 27 };
            ClickCommand = new DelegateCommand<object>(OnClick, arg => true);
        }

        void OnClick(object obj)
        {
            this.User.Age += 1;
        }

        private UserInfo user;
        public UserInfo User
        {
            get
            {
                return this.user;
            }
            set
            {
                if (this.user != value)
                {
                    this.user = value;
                    OnPropertyChanged("User");
                }
            }
        }

        public RegisterUserView View { get; set; }

        public ICommand ClickCommand { get; set; }
    }

代码下载:WpfApplication4_3.zip

如果运行上述代码,你会发现XAML中的Age并不会自增1。问题应该出在OnClick方法上,我在下面一行添加了断点:

this.User.Age += 1;

我发现User的Age属性确实由27变成了28,但是并没有把改变结果通知XAML。

这是因为,INotifyPropertyChanged接口只监视UserInfo这个实体的地址是否发生了改变,而目前这个地址并没有变化,只是存储在UserInfo实体中的成员Age发生了改变,而Age的地址并不在INotifyPropertyChanged接口的监视之下,所以XAML中没有任何改变。

看来只有修改UserInfo这个实体的地址了,最好的方法就是重新实例化一个UserInfo实体:


        void OnClick(object obj)
        {
            //this syntax below cannot run, so it is marked
            //this.User.Age += 1;

this.User = new UserInfo() { UserName = this.User.UserName, Age = this.User.Age + 1 };
        }

示例下载:WpfApplication4_4.zip

比较两种实现方式,我个人倾向于第一种,因为它更自然,而第二种,由于要new一个新的UserInfo对象,所以要多牺牲一些性能。但是不管哪种实现方式,都不要ViewModel和UserInfo同时实现INotifyPropertyChanged接口,这是非常消耗性能的。

(二)ObservableCollection和List的使用场合

始终对ObservableCollection怀有恐惧,因为它太笼统了。

首先它是一个集合,但它是一个既实现了INotifyPropertyChanged接口又实现了INotifyCollectionChanged接口的集合,这是它与List<T>的不同之处。

使用ObservableCollection<T>注定要比List<T>消耗性能,所以我一直在探寻它们各自不同的使用场合。而且,当泛型参数T也实现了INotifyPropertyChanged接口时,就更加复杂了。

于是分为以下四种情况:

1.最简单是List<T>,其中T没有实现INotifyPropertyChanged接口,就是一个简单的实体。

做一个简单的示例,统计一个班级的计算机成绩。

由于List<T>中的T没有实现INotifyPropertyChanged接口,所以增加、删除、修改这3个Button都不会起作用。

着眼于“及格”这个CheckBox,勾选后就只显示分数不小于60的学生列表,取消勾选择显示全部学生。为此,在XAML中要把CheckBox的绑定方式设置为TwoWay(虽然CheckBox默认就是TwoWay,但还是建议显式指定):

<CheckBox Name="chkPass" IsChecked="{Binding Path=IsPassed, Mode=TwoWay}">及格</CheckBox>

在ViewModel中,关键是ModelPropertyChanged方法,在IsPassed属性变化的时候,会执行这个方法:

        void ModelPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            switch (e.PropertyName)
            {
                case "IsPassed":
                    this.StudentList = this.IsPassed ? StudentService.RetrievePassedStudentList() : StudentService.RetrieveStudentList();
                    break;
                default:
                    break;
            }
        }

看得出,根据IsPassed属性的不同,分别为StudentList分配不同的地址,所以在XAML中的DataGrid会跟着发生改变。

随着这里的ViewModel也实现了INotifyPropertyChanged接口,但这是为了IsPassed属性和StudentList属性而实现的,与Student实体类无关。

代码下载:WpfApplication6_1.zip

如果大家读过我之前介绍MVP模式的一系列文章,这个小例子应该很简单。

结论:List<T>(T未实现INotifyPropertyChanged接口),适用于一次性绑定,适用于重新实例化整个List集合的绑定(例如上文的StudentList)。

2.稍微复杂点,List<T>,其中T实现了INotifyPropertyChanged接口。

也就是说,让Student实体类实现INotifyPropertyChanged接口。

    public class Student : INotifyPropertyChanged
    {
        public int UserId { get; set; }
        public string UserName { get; set; }

        private int score;
        public int Score
        {
            get
            {
                return this.score;
            }
            set
            {
                if (this.score != value)
                {
                    this.score = value;
                    OnPropertyChanged("Score");
                }
            }
        }

        INotifyPropertyChanged Members
    }

其它代码保持不变。

我们看到,Modify按钮可以使用了。修改后的数据立刻展现在XAML中。

但是,Add和Remove按钮仍然不能使用。因为INotifyPropertyChanged接口只是监视Student,而没有监视List<Student>集合。所以修改单笔Student数据,可以发送通知给XAML;但是修改List<Student>集合,除非像上一种方式那样重新实例化List<Student>集合(勾选CheckBox仅显示及格的学生),否则必须另辟蹊径。

代码下载:WpfApplication6_2.zip

结论:List<T>(T实现INotifyPropertyChanged接口),适用于修改集合中单笔数据的成员(比如说Student的Score属性)。

3.换个思路,用ObservableCollection<T>怎么样?其中T没有实现INotifyPropertyChanged接口。

也就是说,Student类仍然是一个简单的实体类:

    public class Student
    {
        public int UserId { get; set; }
        public string UserName { get; set; }
        public int Score { get; set; }
    }

相应地,把ViewModel中的List<Student>全都修改为ObservableCollection<Student>,并在构造函数中把原始的List集合转换为ObservableCollection集合:

    public class ScoreListViewModel : INotifyPropertyChanged
    {
        public ScoreListViewModel()
        {            
            this.StudentList = new ObservableCollection<Student>(StudentService.RetrieveStudentList());

            AddCommand = new DelegateCommand<object>(OnAdd, arg => true);
            ModifyCommand = new DelegateCommand<object>(OnModify, arg => true);
            RemoveCommand = new DelegateCommand<object>(OnRemove, arg => true);

            this.PropertyChanged += ModelPropertyChanged;
        }

        void ModelPropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            switch (e.PropertyName)
            {
                case "IsPassed":
                    this.StudentList = new ObservableCollection<Student>(
                        this.IsPassed ? StudentService.RetrievePassedStudentList() : StudentService.RetrieveStudentList());

                    break;
                default:
                    break;
            }
        }

        public ScoreListView View { get; set; }

        private bool isPassed;
        public bool IsPassed
        {
            get
            {
                return this.isPassed;
            }
            set
            {
                if (this.isPassed != value)
                {
                    this.isPassed = value;
                    OnPropertyChanged("IsPassed");
                }
            }
        }

        public ObservableCollection<Student> StudentList { get; set; }

        public ICommand AddCommand { get; set; }
        public ICommand ModifyCommand { get; set; }
        public ICommand RemoveCommand { get; set; }

        public void OnAdd(object obj)
        {
            this.StudentList.Add(new Student() { UserId = 7, UserName = "李永京", Score = 75 });
        }

        public void OnModify(object obj)
        {
            var item = this.StudentList.SingleOrDefault(x => x.UserId == 1);
            if (item != null)
            {
                item.Score = 0;
                //item = new Student() { UserId = item.UserId, UserName = item.UserName, Score = 0 };
            }
        }

        public void OnRemove(object obj)
        {
            var item = this.StudentList.SingleOrDefault(x => x.UserId == 2);
            if (item != null)
            {
                this.StudentList.Remove(item);
            }
        }

        INotifyPropertyChanged Members
    }

看一下点击Add和Remove按钮后的效果图:

而由于ObservableCollection<T>中的T没有实现INotifyPropertyChanged接口,所以修改功能又不能使用了。

这时,我尝试着将

item.Score = 0;

修改为:

item = new Student() { UserId = item.UserId, UserName = item.UserName, Score = 0 };

但仍然无济于事。别灰心,还有最后一种解决方案没试呢~

代码下载:WpfApplication6_3.zip

结论:ObservableCollection<T>(T未实现INotifyPropertyChanged接口),适用于增删集合中的数据(上面的Add和Remove按钮)。但是对于单笔数据的更改,是无能为力的。

4.最复杂的情况,就是使用ObservableCollection<T>,并且T实现了INotifyPropertyChanged接口。

代码结合了上述第2、第3种编程的方式:

代码下载:WpfApplication6_4.zip

结论:所有的问题在次全都迎刃而解。这也许是最完美的解决方案了。但是,也是最消耗性能的。

(三)数据绑定中的OneWay和TwoWay

OneWay和TwoWay是最常见的两种绑定方式,描述了源数据(控件)和目标数据(控件)之间的关系。现在,让我们基于MVP模式的思想,重新认识数据绑定机制。

在下面的概念中,源数据(控件),在MVP里变成了数据(Model);目标(数据)控件,则相应地变成了XAML中绑定的控件。

在WPF和Silverlight的数据绑定中,因控件的不同,其默认的绑定方向也不一样。

在Silverlight 3.0中,BindingMode枚举有3个值,默认是OneWay:

    public enum BindingMode
    {
        OneWay = 1,
        OneTime = 2,
        TwoWay = 3
    }

OneWay和OneTime是数据(Model)发生变化时通知XAML中的控件。而TwoWay则是数据和XAML之间任何一方发生变化都会通知对方。

我们在前面的例子中已经展示过,勾选“及格”这个CheckBox后,GridView中的数据会只显示Score>=60的学生,这个就是TwoWay的最好例证。

TwoWay,它适用于那些可以和用户互动的控件,比如说CheckBox和RadioButton的选中与否,比如在TextBox中输入了那些值,比如说在ListBox、ComboBox和GridView中选中了哪一行。我会在《Prism研究 之 包氏波动理念》来详细介绍其实现技术。

对于OneWay和OneTime,需要仔细说清楚。

A) OneWay是我们使用最频繁的了,无需多说,数据上的任何变化都会通知XAML中绑定的控件。 
            B) OneTime仅仅是一次性绑定。之后即使数据(Model)再发生变化,XAML中的控件也不会跟着改变。

还记得我们在本文的第一节《INotifyPropertyChanged的使用场合》举出的那个例子么?其中的UserName字段,就设置为OneTime的绑定方式,因为我们在初始化将其设置为”Baobao”后,就再也没改动过它。

将不变化的字段尽可能地设置为OneTime,而不是OneWay,这不就多少又节约了一些性能嘛。

而在WPF中,BindingMode枚举有5个值,默认是Default:

public enum BindingMode
    {
        TwoWay = 0,
        OneWay = 1,
        OneTime = 2,
        OneWayToSource = 3,
        Default = 4
    }

OneWayToSource,从字面上很容易理解,它表示当XAML中的控件发生变化时,通知数据(Model),但是在反方向上,数据发生变化却不会通知XAML中的控件。它和OneWay是正好相反的。这样,OneWayToSource在MVP模式中就没有半点用武之处(它的最大用处其实在于把非依赖属性绑定到依赖属性上,参加http://book.51cto.com/art/200908/145469.htm)。

在WPF中,绑定的默认值是Default,这不同于Silverlight 3的默认绑定OneWay。Default表示它会根据控件的不同而未控件自动选择其绑定行为。比如对于TextBox、CheckBox、RadioBtton这些用户可编辑的控件,Default值就是TwoWay;而对于只是用来显示数据的控件(比如ListBox、Label),Default值就是OneWay。

玩转INotifyPropertyChanged和ObservableCollection

时间: 2024-10-12 19:07:12

玩转INotifyPropertyChanged和ObservableCollection的相关文章

UWP开发入门(七)——下拉刷新

本篇意在给这几天Win10 Mobile负面新闻不断的某软洗地,想要证明实现一个简单的下拉刷新并不困难.UWP开发更大的困难在于懒惰,缺乏学习的意愿.而不是“某软连下拉刷新控件都没有”这样的想法. 之前我也没有进行过下拉刷新的研究.于是先去google了几篇blog学习了一下,然后再看了某软官方的Sample.(同学们啊官方有下拉刷新的Sample啊!就在Git上啊!不要钱无门槛啊!)学习之后发现实现的方式大体分为两类. 一类是以某软Sample和博客园MS-UAP封装的PullToRefres

【UWP】FlipView绑定ItemsSource,Selectedindex的问题

最近在做列表头部的Carousel展示,Carousel使用的是FlipView展示,另外使用ListBox显示当前页,如下图 我们先设置一个绑定的数据源 public class GlobalResource : INotifyPropertyChanged { private ObservableCollection<string> _items; public ObservableCollection<string> Items { get { return _items =

WPF 面试题及答案(二)

一 · WPF中什么是样式? 首先明白WPF中样式属于资源中重要的一种. 同时样式也是属性值的集合,能被应用到一个合适的元素中,或者说能将一组属性应用到多个元素. WPF中样式可以设置任何依赖属性. WPF中样式也支持触发器,通过属性的改变,触发一组活动,包括改变某个控件的样式. WPF中元素只能使用一个样式. 样式有继承的特性,样式可以继承样式. 二 · WPF中什么是模板 ? WPF中模板是用于定义或重定义控件结构,或者说对象的外观. WPF中模板有两类,一个是控件模板(ControlTem

Windows Phone中 MVVM框架

MVVM(Model View ViewModel)是由MVC和MVP模式发展来的一种模式,它主要目的就是将应用程序的代码和界面分离开,这样界面开发可以更专注于设计界面,也使得UI界面更容易变换和测试,下面来看一下这3层的主要功能 1.Model层 数据访问层,一般定义为一个或多个类,以面向对象的方式将数据表示出来. 2.View层 表示层,UI界面的实现以及通过Binding和Command来实现与ViewModel层的交互 3.ViewModel层 负责View和Model之间的信息转换,将

C# 移动开发 MasterDetailPage 侧滑

先上结果图: 虽然是跨平台的安卓和ios都可以运行,由于目前只配置了安卓的,ios的先不理. 我们先新建一个项目,跨平台应用: 可移植类库: 可移植项目右键添加新建项 选 Forms MasterDetail Page Xaml 会创建五个文件,看起来是. 打开App.xaml.cs public App() { InitializeComponent(); //MainPage = new Casual.MainPage(); //注释上行,并改为如下: MainPage = new Mast

IObserver&lt;T&gt;(IObservable&lt;T&gt;) vs ObservableCollection vs INotifyPropertyChanged

下面是稍微修改过的MSDN的IObservable例子. public struct Message { string text; public Message(string newText) { this.text = newText; } public string Text { get { return this.text; } } } public class Headquarters : IObservable<Message> { public Headquarters() { o

属性更改通知(INotifyPropertyChanged)——针对ObservableCollection

问题 在开发webform中,wpf中的ObservableCollection<T>,MSDN中说,在添加项,移除项时此集合通知控件,我们知道对一个集合的操作是CURD但是恰恰没有Update的时候提供集合通知,也就是说当我Update的时候,虽然"集合内容"已被修改,但是"控件"却没有实现同步更新INotifyPropertyChanged提供了解决方案. 方案1:INotifyPropertyChanged 传统方式,实现接口INotifyProp

由一个订单推送想到了ObservableCollection的神奇用法

最近在做taobao的一个卖家应用,需要订阅taobao的订单推送,示例代码如下: 看到上面的OnMessage场景之后,我突然就鬼使神差的在想最近写的一个服务,其中的一个功能是需要定时的轮询一个集合,这样可以方便的把数据取出来,但是 轮训对我来说是被迫的,我急迫需要一种机制对一个集合的数据进行监控,比如List,Dictionary等等,这样我就很方便的对数据进行后续处理,而不是我定时的去轮 训一个集合,然后我就想到了wpf里面有一个玩法叫做"属性依赖",然后就想到了今天要说的&qu

Silverlight实用窍门系列:47.Silverlight中元素到元素的绑定,以及ObservableCollection和List的使用区别

问题一:在某一些情况下,我们使用MVVM模式的时候,对于某一个字段(AgeField)需要在前台的很多个控件(A.B.C.D.E)进行绑定,但是如何能够让我们后台字段名改变的时候能够非常方便的改变所有使用了这个字段的控件呢? 回答:使用Element to Element Binding,将AgeFiled绑定到A控件,然后再让B.C.D.E控件绑定A控件的使用AgeField字段的属性. 例如:字段(AgeField)的数据是年龄大小,A.B.C.D.E控件分别是Ellipse.Label.S