Question

One thing I struggle with on MVVM pattern is when I try to implement additional Windows. When I create an additional Window and ViewModel to go along with that Window that is going to serve a particular purpose my design seems to get lost.

Take for example I have a very simple application. It’s a list of people from which I can Add/Delete/Restore. My initial design I handle Delete/Restore from the ViewModel, but Adding I must request information from the user. Given this, I created a new Window and ViewModel (AddWindow/AddViewModel). At this point I get lost. I’ve read about creating Controllers to communicate between, but I’m not even sure that makes sense.

On the AddWindow a user can fill in two fields (first name/last name) and then click Add (or cancel) in which case at that point the data needs to be passed back to the ViewModel so it can be added to the collection so it’s updated (also the AddWindow must close).

How can I think about this in a better manner and what can I do here to resolve such a simple problem?

Answer 1

Create a new class, ApplicationModel, to hold all the user data. Your “Main” view model should create it and then hold it in a property. Your View need to bind to the full path to the data in the model:

<DataGrid ItemsSource="{Binding Path=Model.ListOfThingsToDo, Mode=OneWay}" ... />

In the constructor of your new ViewModels you supply that Model as a parameter. That way all your ViewModels will share the same Model and the new ViewModels can modify/view the same data as your “main” ViewModel.

/// <summary>
/// ViewModel for the Main Window
/// </summary>
class MainViewModel
{
    public ApplicationModel Model { get; set; }

    public MainViewModel()
    {
        Model = new ApplicationModel();
        Model.ListOfThingsToDo.Add("Clean the yard");
        Model.ListOfThingsToDo.Add("Walk dog");
    }

    // Some method that will be called when you want to open another window
    public void OpenTheWindow()
    {
        var modalViewModel = new NewTaskViewModel(Model);
        // Create an instance of your new Window and show it. 
        var win = new NewTaskWindow(modalViewModel);
        win.ShowDialog();
    }
}

/// <summary>
/// Model to hold the data
/// </summary>
class ApplicationModel
{
    public ObservableCollection<string> ListOfThingsToDo { get; set; }
    public ApplicationModel()
    {
        ListOfThingsToDo = new ObservableCollection<string>();
    }
}


/// <summary>
/// ViewModel to handle adding new things to do
/// </summary>
class NewTaskViewModel
{
    public ApplicationModel Model { get; set; }

    public NewTaskViewModel(ApplicationModel model)
    {
        Model = model;
    }

    // Add methods here that will be called to add tasks to the Model.ListOfThingsToDo
    public void AddTask()
    {
        Model.ListOfThingsToDo.Add("the new task to do");
    }
}