One year ago MVVM wasn’t very famous. I remember the first article I read about it, about using MVVM to simplify the management of treeview controls. In the last six months, MVVM has been quickly promoted to THE methodology to use when developing WPF applications. During this amount of time, famous WPF developers started to merge their existing MVVM classes into libraries. Those libraries are now known as MVVM frameworks and contain classes designed to help developers to use MVVM in their projects.

In this article, I’m going to make a quick tour of the available MVVM frameworks.

If your own framework is not in this list or if I made a mistake while describing your work, please let me know using the contact form (available at the top of this page).

Common features:

• ViewModelBase class (for the implementation of the INotifyPropertyChanged interface)
• RelayCommand like class to link UI command to ViewModel’s handlers
• Unit tests comes with the framework

Cinch

• Author: Sacha Barber
• Silverlight support: no
• Documentation: excellent, 6 articles published on CodeProject
• Hosting : CodePlex
• License:  Code Project Open License
• Features:
  • attached behaviors
  • validation suing IDataErrorInfo
  • support for IEditableObject
  • weak events creation and subscription
  • mediator messaging using weak events
  • IOC/DI support (using Unity)
  • services: event logger, message box, open save dialog, popup
  • threading helpers
  • support for menu items
  • closeable viewmodels
  • MVVM code generator

MVVM Light Toolkit

• Author: Laurent Bugnion
• Silverlight support: yes
• Documentation: many articles available on Laurent’s blog + other developers as well
• Hosting: CodePlex
• License: MIT license
• Features:
  • MSI installer
  • VS project and item template
  • VS code snippets
  • Messenger system for inter-viewmodel communication

MVVM Helpers

• Author: Mark Smith
• Silverlight support: no
• Documentation: some articles on Mark’s blog
• Hosting: personal website
• License: not defined
• Features:
  • attached behaviors
  • viewmodel creation using markup extension
  • attributes based validation
  • IOC/DI using ServiceProvider approach
  • closeable viewmodel
  • wait cursor (using new WaitCursor() { // your code here })

MVVM Foundation

• Author: Josh Smith
• Silverlight support: no
• Documentation: articles about the Messenger implementation on Josh or Marlon Grech’s blog
• Hosting: CodePlex
• License: MS-PL
• Features:
  • Messenger system for inter-viewmodel communication
  • PropertyChanged event monitor

Caliburn

• Author: Rob Eisenberg
• Silverlight support: yes
• Documentation: complete online documentation available
• Hosting: CodePlex http://www.codeplex.com/caliburn
• License: MIT license
• Features:
  • commands are built on top of Actions and thus share many of the same features, including multiple input parameters, filters and automatic asynchronous execution
  • presenters that handles UI lifecycle issue such as handling activation, deactivation and shutdown semantics for various UI components
  • Caliburn applications are fully testable
  • various utilities such as a background task manager
  • supports various UI pattern (not MVVM only)
  • dependency injection container

Onyx

• Author: William e Kempf
• Silverlight support: no
• Documentation: basic introduction available on CodePlex
• Hosting: CodePlex
• License: not specified
• Features:
  • ServiceLocator pattern
  • ViewModel creation using a custom markup extension
  • UI related services such as IDisplayMessage

Calcium

• Author: Daniel Vaughan
• Silverlight support: no
• Documentation: 2 very detailed articles on CodeProject (part1 and part2)
• Hosting: CodePlex
• License: use, copy, modify, and/or distribute and keep the copyright!
• Features:
  • Module Manager for enabling or disabling of modules at runtime
  • messaging services for interacting with the user from the client or server using the same API
  • Command Service to associate WPF ICommands with content interfaces that only become active when an active view or viewmodel implements the interface
  • Region Adapters for ToolBars and Menus
  • Client-server logging ready to work out-of-the-box
  • Includes modules, such as a Web Browser, Text Editor, Output Window, and many more
  • Tabbed interface with dirty file indication (reusable across modules)

nRoute

• Author: Rishi
• Silverlight support: yes
• Documentation: many articles available on author’s blog (see CodePlex project home page for the links)
• Hosting: CodePlex
• License: MS-PL
• Features:
  • support Blend3 behaviors and triggers models
  • resource locator framework
  • view services: OpenFileDialog, ShowMessage…
  • uses attributes to map View and ViewModel together

Nito MVVM

• Author: Shammah
• Silverlight support: no
• Documentation: no
• Hosting: CodePlex
• License: not specified
• Features:
  • various MVVM friendly implementations of the ICommand interface

Ocean

• Author: Karl Shifflet
• Silverlight support: no
• Documentation: articles available on Karl’s blog
• Hosting: personal website
• License: not specified
• Features:
  • written in VB.Net
  • attribute based validation
  • viewmodel base classes: relaycommand, closeableviewmodel…
  • SQL server data access layer

Basic MVVM framework

• Author: Lester Lobo
• Silverlight support: no
• Documentation: sample application available with the library
• Hosting: CodePlex
• License: MS-PL
• Features:
  • delegating Commands\Keybinding
  • messaging between VM’s
  • handling events as commands with attached behaviors
  • handling dialogs (and more) as services
  • VS code snippets

GoodLight

• Author: Peter O’Hanlon
• Silverlight support: yes
• Documentation: sample application available with the library
• Hosting: CodePlex
• License: MS-PL
• Features:
  • “workspace” management (set of document that can be closed)
  • skin support
  • messaging between VM’s

As you can see, each frameworks has its pros and cons. If you want a light Silverlight-compatible framework, Laurent’s framework is very nice. If you want a very rich framework, Sacha’s one is excellent. Whatever what your requirements are, each framework is very interesting and browsing the source code is a good way to understrand how stuff works and find cool ideas for your own needs.

To conclude, I’d like to thanks all those people who work very hard for the community ! An interesting discussion started a couple of days ago on the WPF disciples Google group about the creation of a common framework. Have a look here.

I’m still playing with MVVM those days and today, I needed a simple behavior I didn’t know how to do with MVVM. I finally found a simple solution and as I love them, it’s 100% XAML :p

The problem is simple, I have a ListBox where the user can type date in it.
When the User Validate his input, I need to process the text entered and return another value.
The User can validate the input by pressing the Enter key while the TextBox has the focus.

My first attempt was the subscribe to the KeyUp event, and in the code-behind, delegate the work to the associated ViewModel class. I don’t like that solution a lot (events handler in code-behind are sort of ugly…).

I know I could define an ICommand in my ViewModel and do the work directly there (using the excellent RelayCommand class written by Josh Smith). The problem was how to trigger this command when the Enter key is pressed. well, actually it’s pretty simple:

1
2
3
4
5
6
7
8

    <TextBox Text="Hello world" Width="100" Height="40">
        <TextBox.InputBindings>
            <!-- update: we cannot use Binding to the Command property as it's not a DP -->
            <!-- workarounds exist such a MarkupExtension, AttachedProperty... ->
            <!-- personally, I did that in the code behind to make it works :( -->
            <KeyBinding Command="{Binding ProcessInput}" Key="Enter"/>
        </TextBox.InputBindings>            
    </TextBox>

As I updated the article (because Command is not a DP), I finally did the same thing in C# in the code-behind…

If you’re familiar with WPF, then you’re probably familiar with Commands. Commands are a new concept in WPF, here is the introduction from MSDN documentation:

Commanding is an input mechanism in Windows Presentation Foundation (WPF) which provides input handling at a more semantic level than device input. Examples of commands are the Copy, Cut, and Paste operations found on many applications.

Commands help you to decouple your UI from its execution logic and also simplify the process of enabling and disabling controls regarding the state of the command. If you want more details about Commands, you can check out this nice post from Marlon Grech.

You can attach a command to a Button using its Command property (you might also use CommandParameter and CommandTarget properties in some cases). To be more precise, elements that support Command must implement the ICommandSource interface:

1
2
3
4
5
6

public interface ICommandSource
{
ICommand Command { get; }
object CommandParameter { get; }
IInputElement CommandTarget { get; }
}

If you open Reflector and lookup for this interface, you’ll discover that 3 controls implement this interface:

• MenuItem
• ButtonBase
• Hyperlink

In the project I’m working on at work, I had to find out a way to surpass 2 limitations:

• Defining commands on other controls than MenuItem, ButtonBase and Hyperlink
• Defining commands that could be triggered on other event than MouseLeftButtonUp

As you can imagine, I found a way to do that using… attached properties ! Basically I defined an attached property that I called MouseDoubleClickCommandProperty. This command enables you to attach a ICommand to ANY UIElement that will be triggered when the control is double clicked.

The MouseDoubleClickCommandProperty register a PropertyChangedCallback so that when the target changes, I can register on the UIElement.MouseDownEvent event. By looking the ClickCount property of the MouseButtonEventArgs parameter, I can check the MouseDownEvent comes from a DoubleClick event, and then trigger the associated command.

A nice example of this concept can be found in a TreeView. Imagine you want to start an action when a particular node in your TreeView is double clicked. The basic way to do that is to register the MouseDoubleClick event on the control. The new way to do the same thing is to use the MouseDoubleClickCommandProperty attached propery. Here is an example that shows how to do that in a hierarchical data template:

1
2
3
4
5
6
7
8
9

<HierarchicalDataTemplate
  DataType="{x:Type treeViewModel:Node}" 
  ItemsSource="{Binding Path=Children}">
    <StackPanel Orientation="Horizontal"
      attached:ClickBehavior.MouseDoubleClickCommand="{Binding Path=Command}">
        <Image x:Name="image" Width="16" Height="16" Margin="3,0" Source="..\Resources\Icons\Treeview\Default16.png" />
        <TextBlock Text="{Binding Path=Name}" />
    </StackPanel>
</HierarchicalDataTemplate>

As you can see, by using the MouseDoubleClickCommand attached property is becomes possible to attach the command to a StackPanel ! Moreoever, because we might need to pass parameter to the ICommand, I also defined another attached properties that can hold any parameter you want, this is the MouseEventParameterProperty.

Similarly, we can imagine to trigger Commands when a RightClick occurs (we would just have to define a new attached property to do so).

I did a sample application that demonstrates the concept of this article. Because I didn’t have too much time, I used a ListBox instead of a TreeView. but the concepts are equivalent. Please feel free to comment