40

Case

Say I have a Person class, a PersonViewModel and a PersonView.

Updating properties from PersonView to the Person model is simple enough. PersonViewModel contains a Person object and has public properties the PersonView binds to in order to update the Person model.

However.

Imagine the Person model can get updated by Service. Now the property change needs to be communicated to the PersonViewModel and then to the PersonView.

This is how I would fix it:

For each property on the Person model I would raise the PropertyChanged event. PersonViewModel subscribes to the PropertyChanged event of Person. PersonViewModel would then raise another PropertyChanged in order to update the PersonView.

This to me seems the most obvious way but I kind of want to throw this question out there in the hope of someone showing me a nicer way. Is it really this simple or are there better ways to mark the model as modified and update the respective properties on the ViewModel?

Additions

The PersonView's DataContext is PersonViewModel. Person gets populated from JSON and gets updated many times during its lifetime.

Feel free to suggest architectual changes for my particular case.

Answer

I marked aqwert as the answer of my question since it provided me with an alternative to the solution I already proposed.

2 Answers 2

37

When the view binds directly to the model (which is also the case when the ViewModel exposes the Model) you are mixing UI code and data code. The goal of MVVM is to separate these two code domains. That's what the ViewModel is for.

The view model has to have it's own properties the view can bind to. An example:

class PersonViewModel
{
    private Person OriginalModel { get; set; }

    public ValueViewModel<string> Name { get; set; }
    public ValueViewModel<int> Postcode { get; set; }

    protected void ReadFromModel(Person person)
    {
        OriginalModel = person;
        Name.Value = OriginalModel.Name;
        Postcode.Value = OriginalModel.Postcode;
    }

    protected Person WriteToModel()
    {
        OriginalModel.Name = Name.Value; //...
        return OriginalModel;
    }
}

Using such a ViewModel-design really separates your data objects from your user interface code. When the structure of the class Person is changed, the UI doesn't need to be fit accordingly, because the ViewModel separates them from each other.

Now to your question. As you can see in the example above, I used a generic ValueViewModel<T>. This class implements INotifyPropertyChanged (and some other stuff). When you receive a new Person instance, you only have to call ReadFromModel(newPerson) on your ViewModel to have the UI updated, because the ValueViewModels the View binds to will inform the UI when their value changes.

Here an extremely simplified example of the internal structure of the ValueViewModel:

class ValueViewModel<T> : INotifyPropertyChanged
{
    private T _value;
    public T Value 
    {
        get { return _value;}
        set
        {
            _value = value;
            RaisePropertyChanged("Value");
        }
    }
}

This is an approach we used in our MVVM library. It has the advantage that it forces the developer to clearly separate code from the designers concerns. And, as a side effect, it generates a standardized code layout in all your Views and ViewModels and thus improves code quality.

11
  • 1
    Good explanation and great snippet of the generic ValueViewModel<T> class! Please consider implementing equality check for property changed notification. By the way, here is the implementation of ValueViewModel<T> class using ViewModelBase class of MVVM Light framework. Commented Sep 12, 2013 at 9:59
  • Thanks for your advice. In the meantime we already have added an equality check.
    – PVitt
    Commented Sep 12, 2013 at 10:45
  • @PVitt cloud you please take a look at this Question it's related to your answer so maybe you can enlighten me how to solve this. thanks in advance
    – WiiMaxx
    Commented Sep 16, 2013 at 11:22
  • 1
    @gts13 To be honest, I don't know. I left the .NET ecosystem some years ago and thus I don't follow it's development anymore. However, have a look at stackoverflow.com/questions/1405739/…
    – PVitt
    Commented May 16, 2017 at 8:49
  • 1
    @gts13 From my understanding, this is a reversal of responsibilities. The ViewModel is the active part that get's the new Model. How the ViewModel get's the new Model delivered is irrelevant. But the Model is just a dumb data object without any code. Just think of a warehouse. The stuff in the warehouse is the Model. The warehouse manager is the ViewModel. The stuff can't tell that it's old. Someone has to tell the warehouse manager that his stuff is old and he needs to get new stuff.
    – PVitt
    Commented May 16, 2017 at 9:20
8

If the view is binding to the Model directly then as long as the service is using the same instance any changes to the model properties will be propogated to the view.

However if you are recreating a new model in the service then you will give the viewmodel the new model. I expect to see the model as a property on the view model so when you set that property all binding should be alerted to the change.

//in the ViewModel
public Person Model
{
   get { return _person; }
   set { _person = value; 
         RaisePropertyChanged("Model");  //<- this should tell the view to update
        }
}

EDIT:

Since you state there are specific ViewModel logic then you can tailor those properties in the ViewModel

 private void Model_PropertyChanged(object sender, PropertyChangedEventArgs e)
 {
      if(e.PropertyName == "Prop1") RaisePropertyChanged("SpecicalProperty");
      ...
 }

  public string SpecicalProperty
  {
     get
     {
         reutrn Model.Prop1 + " some additional logic for the view"; 
     }
   }

IN XAML

  <TextBlock Text="{Binding Model.PropertyDirect}" />  
  <TextBlock Text="{Binding SpecicalProperty}" />

This way only both the Model and ViewModel propertys are bound to the view without duplicating the data.

You can get fancier creating a helper to link the property changes from the model to the view model or use a mapping dictionary

 _mapping.Add("Prop1", new string[] { "SpecicalProperty", "SpecicalProperty2" });

and then find the properties to update by getting the list of properties

 private void Model_PropertyChanged(object sender, PropertyChangedEventArgs e)
 {

      string[] props;
      if(_mapping.TryGetValue(e.PropertyName, out props))
      {
          foreach(var prop in props)
              RaisePropertyChanged(prop);
      } 
 }
14
  • Sorry, I forgot to mention that the PersonView's DataContext is the ViewModel. The ViewModel contains a lot of UI logic separate from the model.
    – ndsc
    Commented Apr 25, 2012 at 21:28
  • Yes that is typical. When you expose the model through the view model then changing the instance to another model should update the view
    – aqwert
    Commented Apr 25, 2012 at 21:30
  • Yes, in my case though only a few properties will be changed during the lifetime of the model. Would you suggest replacing the complete model object instead of looking for a way to update separate properties? I feel this might cause a lot of overhead but this is just a hunch.
    – ndsc
    Commented Apr 25, 2012 at 21:32
  • If your model object is "heavy", and only a small number of properties change when you deserialize the incoming JSON, it may be worth creating wrapper properties in the view model. Otherwise I'd go with the complete model object replacement as long as no UI performance issues are seen.
    – Alan
    Commented Apr 25, 2012 at 21:35
  • 1
    @ndsc: Sorry, I deleted my previous comment, as I felt aqwert really nailed it with the last one. Re wrappers, it's absolutely true, that would be another reason to strongly decouple the model and the view. I don't think you should worry about raising the PC event twice, it's kind of the point of having clear separation of concerns, and the overhead of that in itself is negligible.
    – Alan
    Commented Apr 25, 2012 at 21:56

Not the answer you're looking for? Browse other questions tagged or ask your own question.