Understanding INotifyPropertyChanged Interface in WPF

hey guys so in this lecture we'll understand what is I notify property chain interface in WPF now as you have learnt all the basic concepts of WPF till now so we will be moving into some advanced concepts such as MVVM pattern in WPF the reason you need to have a good understanding of MVVM pattern is that if you are working in a WPF project you need to know what is a MVVM pattern in WPF so for that you for that you need to have a good understanding of what is inotify property change interface in WPF so I could have explained you mvvm first and then got into this topic but I thought that you should first understand what is inotify property chain interface in WPF so in this lecture we'll we will make a simple application using iot of a property interface or we will see the use of what is I notify property change interface so let's quickly jump in those slides so if an object implements inotify property change interface it will raise a property changed event when its property changes so say suppose you have a class and you have a property inside that class now whenever you will change that property it will raise a property changed event to update the UI so if you don't get this point don't worry I will be showing this thing in demo so this interface is present in system dot component model namespace usually this interface is used to notify the UI that of a property has change and you need to update yourself so this was the point what I was trying to explain you and this practice is widely used when you are developing development WPF applications using MVVM pattern so this is one of the prerequisite of implementing MVVM pattern in WPF that you should implement inotify property chain interface so let's quickly jump into our demo and others understand this construct so here I have a simple class called as person class which I have added in this solution and then I have a main window here so I have a simple window which has a canvas control in it and it has three levels and three text boxes okay and in the code window of this application there is nothing written in here okay so let's try to run this application you can see my window here so it has a first name last name and full name so my requirement is that whenever I type a first name in here last name in here so my full name should be updated automatically ok this is my requirement so there are many ways to do this one way is to implement just simple data binding in it but we will do it with the help of hi notify property change interface and we will see that if you don't have I notify property change interface so what will happen so let's close this and paste three properties inside this person class so let me have this so you can see I have first name last name and full name as variables and then I have three properties corresponding to those variables so first name last name and full name okay so what this full name does it returns full name is equal equals first name plus last name okay so this is my property in here so to implement the inode away property change interface let me have first you need to have this system dot component model name is basic so imported in here so have I in notify properties in interface okay and then you need to implement this interface so you can say implement interface so you will get event called as property changed event right so this interface just has this property change event which is raised whenever this property is changed okay so let me write this event on to the last because this will then not create the confusion amongst you so here's the event and then we will do like to have to raise this event whenever this property changed is changed now remember how to raise event you need to write a method which corresponds to this events right so let me write a method in here private on property changed and it's it takes a string prep parameter property name so just let's call it property so it takes a property inside this method this method takes a property inside it okay and then let's write the logic so I will write if property changed just not equals null then raised this event so I will have this thing so what what is accepts it expects a object so I will pass this so this will represent the current object whatever object is present in this class right and then I will ask it to raise property chain human teh area so this is a special class which is present inside this component modern namespace so this is the event that is responsible this is the class that is responsible for raising the event sorry so it will take just the property inside it then I will close this bracket here so why am I getting a error okay so I am not specified that written type of this method so this is a void return type okay so I am getting error here so okay so I have not used new keywords because I am you I am raising new event okay you can see this if you go to definition of this property change event Arg s so this is present in system dot component model and you can see this property change even T argyus has a property changed given DRGs property and it takes a property name inside it okay so this is this is interlinked so what I am doing I am just raising this event a RDS class event using my own property changed method I am making a method and raising this event okay and then this since this person class is now implementing I not have a property change event so let me have a on the setter of this property let me call this on property change method and pass the name of my property okay so what this will do whenever this first name property will change this will invoke this method and this will in turn raise this event and then it will notify the UI so similar thing we can do in with each and every property so here it goes last name and same comes for this thing full name so now to notify this full name property we need to have this thing inside this also so for each property you need to notify the full name property ok so this is done now let's now try to bind these properties to my text boxes okay this first filled this solution and the build is succeeded let me write a binding markup in here with this text box so I have a pre typed code in here so what I have done I have just wrote in the text property of this text book binding first name mode is two-way similarly we can do in here so binding last name okay similar here binding full name let's save this now it remains setting the data context of this window to this object what we will have for you can say the object of person class so to access that object I will have a person property a public property of person obj of percent type same and this is the same one that what I am actually in doing the lecture of data templates and the lecture of data context okay so I am exposing a probably property of type person okay and then in the constructor of this window I will have this thing so what I am doing here I am just initializing that person obj this person obj to new person and the name of that person is Bruce Wayne so Bruce is the first name Wayne is the last name and then I am setting the data context property of this window to this object so this is the concept what I have explained in the data context lecture okay let's try to save this and run this so let's try to run this and you can see Bruce is the first name Wayne is the last name full name is Bruce Wayne let's try to change this last name now so let me write Bruce Wayne is Batman and whenever I press the tab or lose the focus of this text box you can see Bruce Wayne is Batman is screen-printed in full name so what is what it's doing my iota my property change event is doing whenever this property is changing it's updating the UI internally due to data binding that property will be updated internally through data binding but to update the UI you need I notify property change interface okay so just remember that whenever you need to update the UI of the property changes you need to have a notify property chain interface implemented okay so Bruce so let me change the first name then Clark you can say Clark Wayne is Batman alright and say Clark Kent is Superman you can see Clark Kent is Superman so my application is working perfectly let's try to see now if I delete this I notify property chain interface let me comment out this I notify property change interface here okay now see let's let's see what happens now I am not implementing this I notify property change interface okay rest of the code remains the same I am just commenting out design of a property interface let's try to run this now you can see two screen is Batman let me press the tab now you can see it has not updated itself so this is the function of hi notify property change interface in WPS so whenever you are building a application using MVVM pattern you will need to implement inotify property chain interface because this is the sole purpose of WPF data binding handset that you you can provide chain notification to your Qi so let me make it back to inotify property here interface and this is the code for you to note it down just practice once or from your site from your side and it will be very easier for you okay and this is the code for you or Zemel so guys I hope you understood what is a function of inotify property change interface so let me move back to our slide and you can see all these points what I have taught you are being listed in these slides so thank you so much guys for listening if you have any doubt please leave a comment below and please do subscribe to my channel and keep learning thank you so very much

Channel: DotNetSkoool

Views: 56,842

Keywords: C# Training, DotNetSkoool, WPF Training, WPF Tutorial, INotifyPropertyChanged, INotifyInterface

Id: c_O7FDR5eIw

Length: 12min 40sec (760 seconds)

Published: Mon Aug 15 2016