Here is a list of the changes in this new version:

• application updated to Silverlight 4
• support is now detailed for WPF, Silverlight and Windows Phone
• new frameworks added (MEFedMVVM…)
• framework’s logo added
• download count added (based on the information I found on CodePlex website)
• about window

As always, feel free to give feedback

A similar event has just been launched for Windows Phone 7 development at challenge-windowsphone7.developpez.com

(tr: “Let’s go !” “World cup ?” “No… Windows Phone 7 challenge by developpez.com !”)

The challenge is made of 6 steps:

1. Tools : download and install the required tools
2. Quizz : first basic quizz
3. Silverlight development
4. Silverlight and push notifications
5. XNA
6. Quizz : advanced quizz

Each winner will have the following gifts:

This kind of challenge is really helpful to discover a new technology the funny way ! I hope I’ll get my “I Love Windows Phone” tee-shirt to wear it this summer

Without any doubt MVVM is now the most used framework to leverage WPF and Silverlight functionalities in the best way ! During the last Mix, 3 sessions were dedicated to this methodology (you can watch the videos online here).

As you already know one of the key advantage of the MVVM methodology is to improve the testability of the overall application by reducing the amount of code in the code-behind and producing ViewModel classes which are testable. We use to say that ViewModel classes are testable because:

• they are not coupled to UI concepts (controls, focus, keyboard input…)
• they can wrap model objects using interfaces (for instance a PersonViewModel wraps a IPerson object)
• they are not subclassing a UI control (such as Button or Window)

Today I’d like to share a technique I’m using to facilitate the unit tests of some properties of my ViewModel classes.

Let’s use a very simple ViewModel class as example:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

public class PersonViewModel : ViewModelBase
{
  private IPerson person;
  private bool isSelected;
 
  public string Name 
  {
     get
     {
        return this.person.Name;
     }
     set
     {
        this.person.Name = value;
        this.OnPropertyChanged("Name");
     }
  }
 
  public bool IsSelected
  {
    get
    {
      return this.isSelected;
    }
    set
    {
      this.isSelected = value;
      this.OnPropertyChanged("IsSelected");
    }
  }
 
  // rest of the code omitted for simplicity
}

The Name property, as usually with the MVVM pattern gets its value from the wrapped model object. The easiest way to unit test this property is to use a mocking library. Here is a example using MOQ (my favourite mocking library):

1
2
3
4
5
6
7
8
9
10
11
12

[Test]
public void TestName()
{
  var mockPerson = new Mock<IPerson>();
 
  var vm = new PersonViewModel(mockPerson.Object);
 
  vm.Name = "Jeremy";
 
  // verify that the Name property of the IPerson interface has been set
  mockPerson.VerifySet(p => p.Name = "Jeremy");
}

The Selected property is different because it doesn’t wrap a model property. It’s an information that is added to the ViewModel layer in order to control a UI-related property (for example the IsSelected property of a ListBoxItem). This technique is heavily used to have ViewModel classes interact with the WPF or Silverlight TreeView or ListBox control (you can check out this excellent article of Josh Smith for more detail).

In order to unit test this property, we must:
1/ ensure the PropertyChanged event of the INotifyPropertyChanged is raised properly
2/ ensure we can write a value and read back the correct value

Here is a sample code which does this unit test:

1
2
3
4
5
6
7
8
9
10
11
12

[Test]
public void TestName()
{
var vm = new  PersonViewModel();
bool propertyChanged = false;
 
vm.PropertyChanged += (s, e) => propertyChanged = e.PropertyName ==  "Name";
vm.Name = "newName";
 
Assert.IsTrue(propertyChanged);
Assert.AreEqual("newName", vm.Name);
}

It quickly become cumbersome to copy/paste this unit test for all the ViewModel properties we have. That’s the reason I started thinking about another way to do it…

Here is the feature I’m proposing:

1
2
3
4
5
6

[Test]
public void TestName()
{
var vm = new PersonViewModel();
TestHelper.TestProperty(vm, v => v.IsSelected);
}

In this sample, I’m telling I want to test the IsSelected property of the PersonViewModel type. The advantages are:
1/ less code involved : 1 line to test 1 property
2/ intellisense support in order to prevent typing error and no more “magic” string to give the name of the property
3/ refactoring the name of the property will refactor this sample code too
4/ automatic generation of default test values behind the scene

How does it works ?

• TestProperty treats the second parameter as an Expression<Func> and not as a Func directly
• Using expression tree (the “v => v.IsSelected” part),  I’m able to retrieve the name of the property and its type
• Using reflection, I’m able to get and set the value
• Depending on the type of the property (string, bool, int, double), I have default values write and read back (with a test to ensure that the PropertyChanged event has been raised properly).

Here is the code of the TestPropertyMethod:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

public static void TestProperty<T, U>(T viewmodel, Expression<Func<T, U>> expression)
    where T : INotifyPropertyChanged
{
    if(expression.Body is MemberExpression)
    {
        MemberExpression memberExpression = (MemberExpression) expression.Body;
 
        if (expression.Body.Type == typeof(bool))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, true, false);
        }
        else if (expression.Body.Type == typeof(string))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, "value1", "value2");
        } 
        else if (expression.Body.Type == typeof(int))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, 1, 99);
        }
        else if (expression.Body.Type == typeof(double))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, 1.0, 99.0);
        }
        else
        {
            throw new NotSupportedException("Type is not supported");
        }
   }
}

And the TestViewModelProperty:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

private static void TestViewModelProperty<T, U>(T viewModel, string propertyName, U value1, U value2)
    where T : INotifyPropertyChanged
{
    bool propertyChanged;
    viewModel.PropertyChanged += (s, e) => propertyChanged = e.PropertyName == propertyName;
 
    propertyChanged = false;
    viewModel.SetValue(propertyName, value1);
    Assert.IsTrue(propertyChanged);
    Assert.IsTrue(viewModel.GetValue<U>(propertyName).Equals(value1));
 
    propertyChanged = false;
    viewModel.SetValue(propertyName, value2);
    Assert.IsTrue(propertyChanged);
    Assert.IsTrue(viewModel.GetValue<U>(propertyName).Equals(value2));
}

I’m using 2 extensions methods in order to get and set value from the ViewModel object using reflection. Here they are:

1
2
3
4
5
6
7
8
9
10
11

private static T GetValue<T>(this object obj, string propertyName)
{
    var propertyInfo = obj.GetType().GetProperty(propertyName);
    return (T)propertyInfo.GetValue(obj, null);
}
 
private static void SetValue<T>(this object obj, string propertyName, T value)
{
    var propertyInfo = obj.GetType().GetProperty(propertyName);
    propertyInfo.SetValue(obj, value, null);
}

Please feel free to download the source code of the ViewModelTestHelper class.

You’ll need not more than a couple of minutes to download and install all the tools needed to create your first Windows Phone application using Blend.

Here is a tour in images:

Welcome in Blend 4

Discovering new projects templates in the Welcome dialog:

It must be quite familiar to you if you’re working with WPF or Silverlight

Choosing a target

Launching the app in the emulator

App.xaml file has all the resources for the Windows Phone theme

Let’s go now and play with the tools

The first keynote of Mix10 is just over and the biggest announcement I was waiting for occured: Windows Phone 7 series development tools are NOW available for FREE.

Grab the tools right now ! You’ll need:

• Expression Blend 4 Beta
• Windows Phone Developer Tools
• Expression Blend Add-in for Windows Phone
• Expression Blend SDK for Windows Phone

If you want more details about Blend4, you can check out Christian Schormann’s overview. A new website is now live for all Windows Phone 7 series related development information at http://developer.windowsphone.com/

Another announcements is the availability of Silverlight 4 RC and support for VS2010 RC:

• Silverlight 4 Tools for Visual Studio 2010 (this installs Silverlight developer runtime, SDK, tools, and WCF RIA Services).
• Silverlight Toolkit March 2010 Release
• WCF RIA Services Toolkit
• Expression Blend 4 beta
• BREAKING CHANGES DOCUMENTATION
• Windows Phone Developer tools

For more information about Silverlight 4 RC, you can check out the blog post of Tim Heuer.

I can’t wait to play with all this new stuff. It’s very impressive to see the work done around Windows Phone 7 series. WPF and Silverlight developers just became Windows Phone developer today, and I think this is great !

I’ll give more feedback as soon as the tools will be installed

Mix10 is starting today and we can expect many cool announcements during the keynote. You can watch the keynote online at live.visitmix.com. I’ll try to give feedback as soon as possible. Because I’m not lucky enough to be in Vegas, I’ll watch the keynote tonight (French time !) at home with some coworkers.

Last information before the keynote, it looks like we’ll have some announcements about Silverlight running on Symbian devices…

To make the long story short :

• Windows Mobile 7 was presented during last WMC (Word Mobile Congress) under the name “Windows Phone 7 series”
• Microsoft demonstrated the new UI experience coming with this new version
• Microsoft confirmed that Silverlight and XNA will be the technologies available to develop on the Windows Phone
• Microsoft shows off single game running on Windows, Windows Phone and Xbox

I’m sure you realize that we are going to a very capable and powerful mobile platform here:

• all existing .Net and Silverlight developers are going to be able to write apps for the Windows Phone (this is HUGE)
• we are going to finally have the 3 screens version of Microsoft: develop once and then run on your mobile, your PC and your TV (XBox)

Mix10 website now contains the name and the description of the sessions which are dedicated to the Windows Phone 7 series:

• Designing and Developing for the Rich Mobile Web
• Building a High Performance 3D Game for Windows Phone
• Building Windows Phone Games
• Changing our Game – an Introduction to Windows Phone 7 Series
• An Introduction to Developing Applications for Microsoft Silverlight
• Windows Phone UI and Design Language
• Overview of the Windows Phone 7 Series Application Platform
• Building Windows Phone Applications with Silverlight, Part 1
• Building Windows Phone Applications with Silverlight, Part 2
• Unit Testing Silverlight and Windows Phone 7 Applications
• Silverlight Performance on Windows Phone
• Distributing and Monetizing Windows Phone Applications and Games
• Development and Debugging Tools for Building XNA Games for Windows Phone
• Windows Phone Application Platform Architecture

If you’re using Twitter, make sure to watch the #wp7 hashtag. It make not any doubt the next week is going to be very informative about Windows Phone 7 series.So stay tuned !

Here is the change set:

• fix incorrect URLs
• fix incorrect “Silverlight Support” options. As Laurent Bugnion said in the comments, his MVVM Light framework was the only one supporting Silverlight which was strange…
• links now open in a new window

Click on the following image to launch the Silverlight application.

About adding new frameworks, I’m not sure to add those which targets a much larger domain than MVVM itself. CompositeApplication guidance for example is a lot more than MVVM…

Because the image of the diagram is pretty big, I decided to use Silverlight DeepZoom and the result is just below this text You can download the full image resolution here. Please use the full screen button in the upper right corner of the viewer for the best browsing experience.

Here are general remarks that might help you get information from those diagrams.

The top level Control class:

• Defines general UI properties such as Background, Foreground, BorderBrush and BorderThickness
• Defines a set of properties to control font rendering: FontFamily, FontSize, FontStyle…
• Has a DoubleClick event (other mouse events such as MouseUp/MouseDown comes from the UIElement class)

Below the Control class, we have (this list is not complete):

• The ContentControl class: those controls have… a single Content
• The ItemsControls class which handles a collection of child controls
• The TextBoxBase class which is the parent of TextBox and RichTextBox
• The RangerBase class which handles a range (minimum, maximum) and which is the parent of the ScrollBar, Slider and ProgressBar classes
• The Thumb class which has the ability to be dragged over a surface

Below the ContentControl class we can find many existing WPF controls:

• ButtonBase and its child: Button, ToggleButton and RepeatButton
• Label (see this post for an explanation of the differences between a Label and a TextBlock)
• ListBoxItem and its children: ListViewItem, ComboBoxItem
• ScrollViewer
• HeaderedContentControl, a ContentControl that has both a Content and a Header. This is the case of the Expander, GroupBox and TabItem controls
• Tooltip
• Window
• UserControl

General other remarks:

• It’s funny to see that both Window and UserControl inherits from ContentControl. Before doing the diagram I though that Window came from somewhere else
• Having those diagrams in mind (or on a screen !) is very useful when you need to create your own custom control
• We can see the differences between creating a custom control (inherit from Control or derived class) and a UserControl (inherit from UserControl)
• .Net4 will introduce new controls (not in this diagram) in the WPF framework such: DataGrid, Calendar, TimePicker

Today I’m proud to announce the MVVM frameworks Silverlight application (click the image to open the Silverlight3 page).

A couple of observation:

• please contact me via this blog or twitter if you find incorrect information
• I’m not judging anybody’s work by giving rating, it’s just my personal feeling to have an easiest way to sort the data

Hope you’ll like it