Introduction
If an object implements the INotifyPropertyChanged
interface, it’ll raise a property changed event when its property changes. Let's create a sample application to know how we can implement the INotifyPropertyChanged
Interface. I am creating a Silverlight application which demonstrates data binding with both an object implementing INotifyPropertyChanged
and also a normal DependencyProperty
.
- Open Visual Studio and select a new Silverlight application.
- Create a class named
Customer
in the Silverlight project and implement INotifyPropertyChanged
.
public class Customer : INotifyPropertyChanged
{
- Define the
INotifyPropertyChanged
members:
public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged(PropertyChangedEventArgs e)
{
if (PropertyChanged != null)
{
PropertyChanged(this, e);
}
}
- In the property setter, invoke
OnPropertyChanged
by passing a property name like:
private string _Name;
public string Name
{
get
{
return _Name;
}
set
{
_Name = value;
OnPropertyChanged(new PropertyChangedEventArgs("Name"));
}
}
- In MainPage.xaml.cs, add an
ObservableCollection
of Customer
objects as a Dependency Property in order to make sure that the UI is updating while we assigning the customer list to another list or object. If we are making it as a normal property, the UI will update only if we add a new object to the customer list or if any change occurs to the underlying properties.
public ObservableCollection<Customer> CustomerList
{
get { return (ObservableCollection<Customer>)
GetValue(CustomerListProperty); }
set { SetValue(CustomerListProperty, value); }
}
This enables animation, styling, binding, etc...
public static readonly DependencyProperty CustomerListProperty =
DependencyProperty.Register("CustomerList",
typeof(ObservableCollection<Customer>), typeof(MainPage),
new PropertyMetadata(new ObservableCollection<Customer>()));
- I also added a
DependencyProperty
, FirstName
, in MainPage.xaml.cs just to show the binding of a simple DependencyProperty
.
public string FirstName
{
get { return (string)GetValue(FirstNameProperty); }
set { SetValue(FirstNameProperty, value); }
}
This enables animation, styling, binding, etc...
public static readonly DependencyProperty FirstNameProperty =
DependencyProperty.Register("FirstName", typeof(string), typeof(MainPage),
new PropertyMetadata(string.Empty));
- In MainPage.XAML, add a
DataGrid
and TextBox
and bind them to the ObservableCollection
and DependencyProperty
, respectively.
<data:DataGrid AutoGenerateColumns="True"
Width="400"
Height="300"
ItemsSource="{Binding ElementName=TestUC,
Path=CustomerList}">
</data:DataGrid>
<TextBox x:Name="NameTextBox"
Text="{Binding ElementName=TestUC, Path=FirstName, Mode=TwoWay}"
Width="100"
Height="25"
Margin="0,10,0,10" />
- For understanding the
PropertyChanged
event, I added a button and just updated the Customer
object in the Click
event so that you can see the changes in the DataGrid
. When you change a property of the Customer
object from the Click
event, you can see that the UI is updating accordingly. - Download Sample application from Implementing INotifyPropertyChanged.