Property of type int doesn't reflect in UI when changed in code-behind in WPF?

Question

This is my XAML code:

<Label x:Name="currentPage" Width="45" Height="25" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Content="{Binding CurrentPageNo, Mode=OneWay}" />

This is my code-behind:

 private int currentPageNo;
 public int CurrentPageNo
 {
    get { return currentPageNo; }
    set { currentPageNo = value; NotifyPropertyChanged("CurrentPageNo"); }
 }
 public event PropertyChangedEventHandler PropertyChanged;

 protected void NotifyPropertyChanged(string propertyName)
 {
   PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
 }

private void gotoPrevious(object sender, RoutedEventArgs e)
{ this.currentPageNo--;}

private void gotoPrevious(object sender, RoutedEventArgs e)
{ this.currentPageNo++;}

currentPageNo is changed when I press either the next page button or the previous page button, but this doesn't reflect in the UI.

It works when I do this.

private int currentPageNo;
 public int CurrentPageNo
 {
    get { return currentPageNo; }
    set { currentPageNo = value; NotifyPropertyChanged("currentPageNo"); }
 }
 public event PropertyChangedEventHandler PropertyChanged;

 protected void NotifyPropertyChanged(string propertyName)
 {
   PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
 }

private void gotoPrevious(object sender, RoutedEventArgs e)
{ 
  this.currentPageNo--;
  NotifyPropertyChanged("currentPageNo");
}

private void gotoPrevious(object sender, RoutedEventArgs e)
{ 
  this.currentPageNo++;
  NotifyPropertyChanged("currentPageNo");
}

I have to notify from all the places wherever I am changing the value. This doesn't feel right. am I missing something? or it is meant to be done the second way?

Answer 1

You have to notify about a change of the property by using the name of property, not the name of its backing field.

Then you should also increment and decrement the property, not the field.

private int currentPageNo;

public int CurrentPageNo
{
   get { return currentPageNo; }
   set
   {
       currentPageNo = value;
       NotifyPropertyChanged(nameof(CurrentPageNo)); // property name
   }
}

public event PropertyChangedEventHandler PropertyChanged;

protected void NotifyPropertyChanged(string propertyName)
{
    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

private void GotoPrevious(object sender, RoutedEventArgs e)
{ 
    CurrentPageNo--; // set the property
}

private void GotoPrevious(object sender, RoutedEventArgs e)
{ 
    CurrentPageNo++; // set the property
}

An alternative implementation without a backing field could look shown below. The property setter is private to make sure that only the owning class can set the property. It must then always fire the PropertyChanged event.

public int CurrentPageNo { get; private set; }

public event PropertyChangedEventHandler PropertyChanged;

protected void NotifyPropertyChanged(string propertyName)
{
    PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

private void GotoPrevious(object sender, RoutedEventArgs e)
{ 
    CurrentPageNo--;
    NotifyPropertyChanged(nameof(CurrentPageNo));
}

private void GotoPrevious(object sender, RoutedEventArgs e)
{ 
    CurrentPageNo++;
    NotifyPropertyChanged(nameof(CurrentPageNo));
}