Click here to Skip to main content
15,860,972 members
Articles / Desktop Programming / WPF

WPF: If Carlsberg did MVVM Frameworks: Part 6 of n

Rate me:
Please Sign up or sign in to vote.
5.00/5 (47 votes)
4 Sep 2009CPOL7 min read 190.6K   62   69
It would probably be like Cinch, an MVVM framework for WPF.

Contents

Cinch Article Series Links

Introduction

Last time we started looking at Unit testing using Cinch. In this article, I will be looking at the following:

Prerequisites

The demo app makes use of:

  • VS2008 SP1
  • .NET 3.5 SP1
  • SQL Server (see README.txt in the MVVM.DataAccess project to learn what you have to setup for the demo app database)

Special Thanks

I guess the only way to do this is to just start, so let's get going, shall we? But before we do that, I just need to repeat the special thanks section, with one addition, Paul Stovell, who I forgot to include last time.

Before I start, I would specifically like to say a massive thanks to the following people, without whom this article and the subsequent series of articles would never have been possible. Basically, what I have done with Cinch is studied most of these guys, seen what's hot, what's not, and come up with Cinch. Which I hope addresses some new ground not covered in other frameworks.

  • Mark Smith (Julmar Technology), for his excellent MVVM Helper Library, which has helped me enormously. Mark I know I asked your permission to use some of your code, which you most kindly gave, but I just wanted to say a massive thanks for your cool ideas, some of which I genuinely had not thought of. I take my hat off to you mate.
  • Josh Smith / Marlon Grech (as an atomic pair) for their excellent Mediator implementation. You boys rock, always a pleasure.
  • Karl Shifflett / Jaime Rodriguez (Microsoft boys) for their excellent MVVM Lob tour, which I attended, well done lads.
  • Bill Kempf, for just being Bill and being a crazy wizard like programmer, who also has a great MVVM framework called Onyx, which I wrote an article about some time ago. Bill always has the answers to tough questions, cheers Bill.
  • Paul Stovell for his excellent delegate validation idea, which Cinch uses for validation of business objects.
  • All of the WPF Disciples, for being the best online group to belong to, IMHO.

Thanks guys/girl, you know who you are.

The Demo App

In some ways, this article will be a bit of a strange one, as I have already covered everything you need to know about how to construct the demo app or any other MVVM based app (of course, using the Cinch framework), so I will not be covering any code in this article as I think that has been pretty much covered by all the previous articles.

What this article shall concentrate on is what the demo app looks like and how it is made up; of course while doing that, I will explain how and why certain Cinch classes/objects are used and why certain design ideas were followed, but if you are expecting a full run through of the code, this article is not the place for that, you should refer to the previous articles for that.

I am hoping that by now you are armed with enough Cinch know-how to dismantle the demo app by yourselves and see what is going on in it. Remember, you have all the Cinch articles prior to this one to help you out.

What It Looks Like

So far I have written five other Cinch articles, and believe it or not, there has not been one screenshot of the demo app, which is largely down to the fact that I have been explaining the framework and how to test with it, whereas this article talks about the look and structure of the demo app, so without further ado, we need to see some screenshots. Let's have a look at some screenshots, shall we:

Start Page

Image 1

Add/Edit Customer (Add New Mode Shown Below)

Image 2

Add/Edit Customer (Edit Mode Shown Below 1/2 way Through Editing Customer Order)

Image 3

Search Customers

Image 4

How It Is Made

The general idea behind the demo app is quite a simple one. The following function points explain how it should all work:

  1. The UI will be a tabbed interface that shall start out with a start page pre-loaded.
  2. The UI shall support creating a new Customer from both the start page and a menu item. In both cases, a new tab should be opened, unless an Add/Edit Customer tab is already open, which is a stupid limit that I artificially imposed just to show off how to work with Mediator and Workspaces.
  3. The UI shall support searching of Customers from both the start page and a menu item. In both cases, a new tab should be opened, unless a Search Customers tab is already open, which is a stupid limit that I artificially imposed just to show off how to work with Mediator and Workspaces.
  4. It should be possible to edit an existing Customer from the search results, unless there is a Add/Edit Customer tab already open.
  5. It should be possible to delete an existing Customer from the search results, unless the selected Customer is already open in an Add/Edit Customer tab.
  6. It should be possible to add a new Customer from the Add/Edit Customer tab, and view any errors using the error styled textboxes on the Add/Edit Customer tab.
  7. It should be possible to open an existing Customer (from search results) and start editing the Customer, and then cancel the edit, which should not only cancel the edit to the Customer, but close the Add/Edit Customer tab.
  8. It should be possible to add an Order to an existing Customer via a popup window, and view any errors using the error styled textboxes on the Add/Edit Order popup window.
  9. It should be possible to edit an Order for an existing Customer via a popup window.
  10. It should be possible to open an existing Customer's Order (from the Customer Orders list) and start editing the Order, and then cancel the edit, which should not only cancel the edit to the Order, but close the Add/Edit Order popup window.

So that's what the UI should do, and guess what, it actually does all of this. So how do we go about covering this little lot?

Well, we have covered it all before, so I think the best thing to do is list the function points above and then I will simply point you to where these things were discussed in previous Cinch articles.

Demo App Function Points

Item 1

This is achieved using a TabControl whose items are bound to a ObservableCollection<ViewModelBase> as discussed within this previous Cinch article section: CinchIII.aspx#CloseVM.

Item 2

Same as item 1, but the checking to see whether there is already an open Add/Edit Customer tab is done via the Mediator, as discussed within this previous Cinch article section: CinchII.aspx#MediatorMessaging.

Item 3

As item 2.

Item 4

As item 2, but the editing of the Customer object is achieved using the IEditableObject interface, as discussed within this previous Cinch article section: CinchII.aspx#IEditableObject.

Item 5

As item 2.

Item 6

This is done by the use of the IDataErrorInfo interface, as discussed within this previous Cinch article section: CinchII.aspx#validationRules.

Item 7

The editing of the Customer object is achieved using the IEditableObject interface, as discussed within this previous Cinch article section: CinchII.aspx#IEditableObject.

Item 8

The errors are displayed as stated in item 6 using the IDataErrorInfo interface. Handling the opening of the popup is done using the IUIVizualiserService, as discussed within thes previous Cinch article sections: CinchIII.aspx#PopServ, CinchIV.aspx#PopServ, CinchV.aspx#UIVisualizer.

Item 9

The editing of the Customer's Order object is achieved using the IEditableObject interface, as discussed within this previous Cinch article section: CinchII.aspx#IEditableObject.

Item 10

As item 7.

What's Coming Up?

In the subsequent articles, I will be showcasing it roughly like this:

  1. A code generator for developing quick Cinch ViewModels/Models, and maybe more if I find some more time. The code generator will be written in Cinch so the code generator will also serve as a second example of how to use Cinch in your own projects.

That's It Hope You Liked It

That is actually all I wanted to say right now, but I hope that from this article you can see how Cinch made the development of the demo app, er well, a "Cinch".

Thanks

As always votes / comments are welcome.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior)
United Kingdom United Kingdom
I currently hold the following qualifications (amongst others, I also studied Music Technology and Electronics, for my sins)

- MSc (Passed with distinctions), in Information Technology for E-Commerce
- BSc Hons (1st class) in Computer Science & Artificial Intelligence

Both of these at Sussex University UK.

Award(s)

I am lucky enough to have won a few awards for Zany Crazy code articles over the years

  • Microsoft C# MVP 2016
  • Codeproject MVP 2016
  • Microsoft C# MVP 2015
  • Codeproject MVP 2015
  • Microsoft C# MVP 2014
  • Codeproject MVP 2014
  • Microsoft C# MVP 2013
  • Codeproject MVP 2013
  • Microsoft C# MVP 2012
  • Codeproject MVP 2012
  • Microsoft C# MVP 2011
  • Codeproject MVP 2011
  • Microsoft C# MVP 2010
  • Codeproject MVP 2010
  • Microsoft C# MVP 2009
  • Codeproject MVP 2009
  • Microsoft C# MVP 2008
  • Codeproject MVP 2008
  • And numerous codeproject awards which you can see over at my blog

Comments and Discussions

 
QuestionWhat was MainWindow written in as I get error when I try and view it in the designer Pin
rwt338-Jun-10 18:25
rwt338-Jun-10 18:25 
AnswerRe: What was MainWindow written in as I get error when I try and view it in the designer Pin
Sacha Barber8-Jun-10 21:38
Sacha Barber8-Jun-10 21:38 
GeneralTests Pin
andykernahan20-Apr-10 10:58
andykernahan20-Apr-10 10:58 
GeneralRe: Tests Pin
Sacha Barber20-Apr-10 20:13
Sacha Barber20-Apr-10 20:13 
GeneralRe: Tests Pin
andykernahan20-Apr-10 21:14
andykernahan20-Apr-10 21:14 
GeneralRe: Tests Pin
Sacha Barber20-Apr-10 22:41
Sacha Barber20-Apr-10 22:41 
QuestionConverted and Compiled under VS 2010, problems... Pin
ProtoBytes25-Mar-10 0:51
ProtoBytes25-Mar-10 0:51 
AnswerRe: Converted and Compiled under VS 2010, problems... Pin
Sacha Barber25-Mar-10 1:00
Sacha Barber25-Mar-10 1:00 
QuestionFiltering ComboBox? Pin
djvibri12-Mar-10 4:10
djvibri12-Mar-10 4:10 
AnswerRe: Filtering ComboBox? [modified] Pin
Sacha Barber12-Mar-10 4:31
Sacha Barber12-Mar-10 4:31 
QuestionHow to implement application wide undo/redo Pin
nuno8918-Oct-09 9:29
nuno8918-Oct-09 9:29 
AnswerRe: How to implement application wide undo/redo Pin
Sacha Barber18-Oct-09 19:24
Sacha Barber18-Oct-09 19:24 
QuestionTabControlEx within an UserControl cause problem for displaying first tab Pin
Gautier Boder16-Oct-09 4:14
Gautier Boder16-Oct-09 4:14 
AnswerRe: TabControlEx within an UserControl cause problem for displaying first tab Pin
eburke5616-Oct-09 16:09
eburke5616-Oct-09 16:09 
GeneralRe: TabControlEx within an UserControl cause problem for displaying first tab Pin
eburke5616-Oct-09 16:15
eburke5616-Oct-09 16:15 
GeneralRe: TabControlEx within an UserControl cause problem for displaying first tab Pin
aaron.olds15-Nov-11 8:40
aaron.olds15-Nov-11 8:40 
GeneralRe: TabControlEx within an UserControl cause problem for displaying first tab Pin
guton12-Aug-12 8:50
guton12-Aug-12 8:50 
QuestionThe INSERT statement conflicted with the FOREIGN KEY constraint \"FK_Order_Order\" Pin
drwebmonkey11-Sep-09 8:58
drwebmonkey11-Sep-09 8:58 
AnswerRe: The INSERT statement conflicted with the FOREIGN KEY constraint \"FK_Order_Order\" Pin
Sacha Barber11-Sep-09 20:32
Sacha Barber11-Sep-09 20:32 
GeneralADO.NET Entity Framework Pin
m_zayed10-Sep-09 5:57
m_zayed10-Sep-09 5:57 
GeneralRe: ADO.NET Entity Framework Pin
Sacha Barber10-Sep-09 21:38
Sacha Barber10-Sep-09 21:38 
GeneralRe: ADO.NET Entity Framework Pin
m_zayed11-Sep-09 2:47
m_zayed11-Sep-09 2:47 
GeneralRe: ADO.NET Entity Framework Pin
Sacha Barber11-Sep-09 3:57
Sacha Barber11-Sep-09 3:57 
GeneralRe: ADO.NET Entity Framework Pin
m_zayed11-Sep-09 21:58
m_zayed11-Sep-09 21:58 
GeneralRe: ADO.NET Entity Framework Pin
Sacha Barber11-Sep-09 22:04
Sacha Barber11-Sep-09 22:04 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.