Question

I’m trying to design a WPF application where users can design an algorithm flow chart. This means lots and lots of graphics on my grid. (I was going to use Canvas, but decided to go with grid since canvas doesn’t support ScrollViewer natively). I am using MVVM design pattern in my application.

To add/remove graphics dynamically, what states from viewmodel should I export to my view?

Answer 1

As is typical with in all cases where you are going to be displaying a collection of items, you need to:

1. Create a class that represents each item (i.e. a Model for the items)
2. Expose an ObservableCollection of this class as a property of your ViewModel

The particulars may vary quite a bit though. I cannot visualize how exactly you intend to implement the view as a Grid, so here are some guidelines assuming it were a Canvas.

Determine your persistence model

When the items are placed on the view, is the user going to be able to move them around? Should their positions be faithfully reproduced if the document is saved, closed and then reopened? If so, then your model for the items needs to aggregate these display parameters. If not, then the view might decide how to position the items itself at runtime.

Use sub-ViewModels if it makes sense

If your item models are very simple then it’s possible that you can represent them visually using an inline ItemTemplate for your ItemsControl. If not, then you might want to create an ItemViewModel and expose an ObservableCollection<ItemViewModel> from your main ViewModel.