DataBinding具有只读属性

Question

I have a view that allows the user to enter a payment amount, then optionally enter principal, interest, and escrow amounts.

Everything is good with those four TextBox es using TwoWay databinding like so:

<TextBlock Grid.Row="3"
           Grid.Column="0"
           Text="Payment Amount" />
<TextBox Grid.Row="3"
         Grid.Column="1"
         Text="{x:Bind ViewModel.CurrentPayment.PaymentAmount, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:N}', Mode=TwoWay}" />
<TextBlock Grid.Row="4"
           Grid.Column="0"
           Text="Principal" />
<TextBox Grid.Row="4"
         Grid.Column="1"
         Width="100" Text="{x:Bind ViewModel.CurrentPayment.PrincipalAmount, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:N}', Mode=TwoWay}" />
<TextBlock Grid.Row="5"
           Grid.Column="0"
           Text="Interest" />
<TextBox Grid.Row="5"
         Grid.Column="1"
         Width="100"
         MaxLength="20"
         Text="{x:Bind ViewModel.CurrentPayment.InterestAmount, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:N}', Mode=TwoWay}" />
<TextBlock Grid.Row="6"
           Grid.Column="0"
           Text="Escrow" />
<TextBox Grid.Row="6"
         Grid.Column="1"
         Width="100"
         MaxLength="20"
         Text="{x:Bind ViewModel.CurrentPayment.EscrowAmount, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:N}', Mode=TwoWay}" />

However, when I try to add a "summary" property called TotalAmount that takes the total of PrincipalAmount + InterestAmount + EscrowAmount as shown here:

[JsonIgnore]
public decimal TotalAmount
{
    get
    {
        var amount = EscrowAmount + InterestAmount + PrincipalAmount;
        return amount;
    }
}

My property does not update if the user makes changes to the TextBox for principal/interest/escrow amounts. The TotalAmount displays correctly when loading the view, but does not update when the values change. Here is the XAML for the TextBlock :

<TextBlock Text="{x:Bind ViewModel.CurrentPayment.TotalAmount, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:N}'}" />

Is there a way to let the TotalAmount property know when one of the other properties' value changes, so it can update the displayed value?

EDIT

Adding the other three property definitions to show use of INotifyPropertyChanged .

private decimal _principalAmount;
[JsonProperty("principalamount")]
public decimal PrincipalAmount
{
    get { return _principalAmount; }
    set { Set(ref _principalAmount, value); }
}

private decimal _escrowAmount;
[JsonProperty("escrowamount")]
public decimal EscrowAmount
{
    get { return _escrowAmount; }
    set { Set(ref _escrowAmount, value); }
}

private decimal _interestAmount;
[JsonProperty("interestamount")]
public decimal InterestAmount
{
    get { return _interestAmount; }
    set { Set(ref _interestAmount, value); }
}

Set is a method from Template 10's BindableBase :

public abstract class BindableBase : IBindable, INotifyPropertyChanged
{
    protected BindableBase();

    public event PropertyChangedEventHandler PropertyChanged;

    public virtual void RaisePropertyChanged([CallerMemberName] string propertyName = null);
    public virtual void RaisePropertyChanged<T>(Expression<Func<T>> propertyExpression);
    public virtual bool Set<T>(ref T storage, T value, [CallerMemberName] string propertyName = null);
    public virtual bool Set<T>(Expression<Func<T>> propertyExpression, ref T field, T newValue);
}

EDIT

The main issue I was having was due to the different behavior of compiled bindings. The default Mode is OneTime , which is different from the standard binding default of OneWay . Once I raised the property change notifications to the TotalValue property, I still had to change the binding mode to OneWay to get my UI to update.

More information about standard bindings and compiled bindings can be found at x:Bind markup extension

Answer 1

Yes, your model class (Payment) should implement INotifyPropertyChanged and raise PropertyChanged event for property TotalAmount when one of those three properties change.

And make sure that you raise PropertyChanged for TotalAmount after you set the new value, otherwise it will not update the TotalAmount with the latest values, which is probably not what you want.

Example:

Payment : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private void NotifyPropertyChanged(string propertyName = "")
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    private decimal _principalAmount;
    public decimal PrincipalAmount
    {
        get { return _principalAmount; }
        set
        {
            _principalAmount = value;
            NotifyPropertyChanged(nameof(PrincipalAmount));

            // lets the design know that property "TotalAmount" should also be updated ...
            NotifyPropertyChanged(nameof(TotalAmount));
        }
    }
}