Monday, February 21, 2011

[2011.02.21] ReSharper C# snippet for MVVM ViewModel Property creation

Here is a simple C# snippet for ReSharper (should work on most versions) to simplify the creation of ViewModel properties. It is clear that creating properties in the ViewModel can be a tedious and repetitive process, especially when there are several involved. To create the snippet, you need to add a new Live Template in R#.

In Visual Studio under the ReSharper menu item, select LiveTemplates... and you will see Fig. 1.

[2011.02.21].ReSharper.snippet.01
Fig.1 The Template Explorer window

Under the User Templates node, select the New Template option from the toolbar and you will be taken to the Template creation page. Here you can enter the shortcut used to toggle the snippet and a description. I used vmp (ViewModel Property) for my shortcut here. Simply copy and paste the code below into the window and I will explain the changes you need to make.

private $TYPE$ _$NAMEFIELD$;

$END$

public $TYPE$ $NAME$

{

    get {return _$NAMEFIELD$; }

    set

    {

        if(_$NAMEFIELD$ == value) return;

        _$NAMEFIELD$ = value;

        OnPropertyChanged("$NAME$");

    }

}

The artifacts enclosed between dollar signs ($) can be thought of as variables that you can replace once the snippet has been activated. If we follow the naming convention of labeling fields starting with an underscore and all properties begin with uppcase letter, you will see that if you leave things the way they are as in Fig. 2, you will not get the anticipated result.

[2011.02.21].ReSharper.snippet.02
Fig.2 Editing the template

This is where the options in the right pane of the Template window comes into play. There are built in macros to help us get the correct set up. We want the $NAME$ to basically be like $_NAMEFIELD$ but without the underscore and the first letter must be upper case. So click the "Choose macro" option next to the NAME identifier in the right pane and from the list, as in Fig. 3, select:
Value of another variable with the first character in upper case

[2011.02.21].ReSharper.snippet.03
Fig.3 Macro selection

After that, the Template window will look like Fig. 4. Note that we have not yet based the $NAME$ on the $_NAMEFIELD$ variable yet.

[2011.02.21].ReSharper.snippet.04
Fig.4 After setting the macro

Now click the another variable link and you will get a dropdown list to select which variable $NAME$ should use as its basis. This is shown in Fig. 5.

[2011.02.21].ReSharper.snippet.05
Fig.5 Relating variables

Your snippet is now ready for action!

NOTE: OnPropertyChanged should be replaced by whatever method name you used when you implemented INotifyPropertyChanged. For instance, you may have called yours RaisePropertyChanged instead of OnPropertyChanged, so modify the snippet to best suit your needs.

2 comments:

Max Pavlov said...

Great, thank you very much, Sparky! This snippet will save me a few hours in total on an upcoming projects, or even more =)

Max Pavlov said...

By the way, I have found one possible improvement to your snippet:

A NAMEs "Number of editable occurrences" should be set to "Not editable", since you never edit the name of the property - it gets populated from the fields name.