WPF MVVM Example App
I’ve been writing a simple app to try out Windows Presentation Foundation (WPF) using the Model-View-ViewModel (MVVM) pattern, so I thought I’d post it in case anyone found it useful – there don’t seem to be many end-to-end examples using MVVM around. I’ve tried to stick to good practices, although there’s still a fair bit of discussion in some areas about what the best way to do things is.
Before you read any further, if you’re looking for an example of a decent WPF UI, stop now! I can assure you, you’ll only be disappointed.. I used a theme so it wasn’t grey, but that’s about it. It’s all about the code!
The Code
The source code is here: https://github.com/relentless/wpf-diet-recorder
You’ll need Visual Studio 2008 and above to use this (I haven’t tried it with 2010, but it should work Ok).
The App
The app lets you record your weight and some notes on the Measurements screen:
This can be done for multiple users, which are set up on the Users screen:
(You might notice the Users screen allows you to define custom measurements for the users – these aren’t used anywhere at the moment, as putting that in was making it too complex for this example).
Features
A couple of interesting things in there are:
- Automated Unit Testing (of course!)
- Composite views (the ‘custom measurements’ part of the Users screen is a separate user control with its own ViewModel)
- No code-behind
- Commands using DelegateCommand
- ValueConverters
Unit Testing
Although there aren’t as many unit tests as I would like, there should be at least examples of the main things you’d want to test. (My only excuse for the lack of tests is this was my first WPF app, and as such basically a prototype, so I was working it out as I went along).
I’ve used Roy Osherove’s naming convention for the unit tests (MethodName_StateUnderTest_ExpectedBehaviour), as I like it. I’ve also stuck with the AAA pattern for the test layout (Arrange, Act, Assert), and when I’ve used Rhino Mocks for test isolation, that’s been in ‘AAA mode’.
ValueConverters
There is still much discussion in MVVM circles about whether ValueConverters should be used, or if the ViewModel in MVVM should render them unnecessary. I’ve used ValueConverters as I don’t want to have too View-specific things (such as Visibilities and Colours) in my ViewModel, but some people (including Josh Smith, the father of MVVM) disagree. To be honest, it doesn’t matter much (especially if you’re just starting out), but it’s good to be aware of your options.
Validation
Always tricky to know where to put the validation – in this case, I’ve gone for validating the data type in the ViewModel, and any more complex validation (string lengths, max and min value, etc) in the model itself.
Libraries / Tools
The things I’ve used to build this (aside from VS2008) are:
- NUnit for unit testing
- RhinoMocks for isolation (mocking)
- Versant DB4O for the data store (it’s an Object Database, so don’t go looking for the SQL!)
- WPF Toolkit for the theme
- WPFMessageBox for the message box
Further Development
If I was to continue developing this example, there are a couple of things I’d probably want to do:
- Make some kind of Application Controller, which would contain the ugly startup code from App.xaml.cs and be in charge of opening forms
- Use an IoC container such an Ninject to resolve those dependencies
- Probably take the data loading/saving logic out of the ViewModels and find somewhere more appropriate for it
That’s It!
Hopefully someone might find that useful. If you have any questions, feel free to get in touch.
Think you’ve got this wrong “including Josh Smith, the father of MVVM”
Nice article, thanks for sharing
Yeah, I think you might be right – according to Wikipedia at least, Josh Smith accredits John Grossman, a Microsoft Silverlight guy, for the original pattern. Although Smith has certainly been pretty influential in the MVVP world.
Thanks for nice blog! I think it’s useful. http://www.wowebook.co.cc/net/wpf-recipes-in-c-2008-a-problem-solution-approach/
I works fine with VS2010 … thanks 🙂
Excellent, thanks for letting me know!
Finally someone with a real example! I think this will help me a lot. Maybe if you could set a detailed explanation for a dummie beginner in MVVM would be nice. I will have to dig a lot and maybe spend a week of three in order to understand and extract what i need.
Thanks a lot.
Hi,
Thanks for your example. I’m new to programming all together and I’ve had such a hard time understanding how to use classes and how to use methods from other classes. I have searched all over the internet on how to bind button events that are setup in another class and could not really find a good complete example. But after downloading your APP I have been able to go through the code and see what and how you implement binding and how it all gets tied together in the App.xaml.cs file at startup. This was key info for me because I could not figure out how to tie the classes together. I do have a problem however. I can get the app to compile and run but I can not get it to work. The new button is not active and the users dropdown box is empty. I may be missing a file but not sure what to do. I would like to run and play with the app so I can fully understand what is goig on. Could you please respond to my post?
Thanks,
Bryan K.
Hi Bryan, I’ll get back to you by email. From what I recall, the users list is initially empty, but you should be able to add a new user.
If you are still monitoring this, I’d like to know what you did for Bryan. I have the same issue wit the buttons. I wasn’t sure if the DB was bing recognized?
Sara N,
This is the reply I got from the developer.
I think I might see the problem, looking back at the app again – it’s not obvious, but the ‘users’ label in the top left is a button which you need to press to open the users screen (see attached screenshot).
Let me know if that was the issue.
Grant
Hope this helps you.
Bryan K
That was all it was. Thank you for the QUICK response!!!!!!
Anytime. I’m not a very good programmer yet (hope to be one day) But I can pass on information like a champ;)
Bryan K