XAML Intellisense just got better

.NET, Blend, Build, Design, MVVM, Phone, Silverlight, Technical stuff, Visual Studio, Windows 8, Windows Phone, Work, WPF, XAML
See comments

With the latest Visual Studio Update 2 release candidate came a pretty wonderful surprise from the XAML tools team: Improved Intellisense when you use MVVM Light.

Short story

After you install the latest update to Visual Studio, you will notice the following effect:

  • Create a new MVVM Light application using the menu File, New, Project, Visual C#, MVVM Light (any framework).
  • Build the application.
  • Open MainPage.xaml (or MainWindow.xaml for WPF).
  • Type the following markup:

14-Apr-14 10-20-52 AM

Notice the awesomeness there? The “WelcomeTitle” property is available in XAML Intellisense! We can also see the IsInDesignModeStatic (inherited from ViewModelBase)  as well as the NavigateCommand property. These properties are all coming from the MainViewModel which is set as DataContext on the MainPage/MainWindow as shown in this markup:

<Window x:Class="MvvmLight7.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:ignore="http://www.ignore.com"
        mc:Ignorable="d ignore"
        Height="300"
        Width="300"
        Title="MVVM Light Application"
        DataContext="{Binding Main, Source={StaticResource Locator}}">

Of course the usual way of using the data binding editor in the visual designer still works just fine. But with this, the XAML editor became way cooler and will work great for all of us who are XAML heads. Yes I said it before and I will say it again, I love to type XAML in Visual Studio, and every time I have to revert to the poor HTML editor, I get stomach cramps.

Longer story

In fact, it is a side effect from an improvement that they made to the design time DataContext. This is a way that you can set the DataContext at design time by using the following syntax in a XAML document:

xmlns:viewModel="clr-namespace:MvvmLight7.ViewModel"
d:DataContext="{d:DesignInstance 
                Type=viewModel:MainViewModel, 
                IsDesignTimeCreatable=True}"

With this XAML, the visual designer (either in Blend or in Visual Studio) will look for the MainViewModel type, check that it has a default constructor, and then create an instance that it will assign to the DataContext. At runtime, however, this markup is completely ignored and the DataContext is set in the way that you defined in XAML or in code.

In MVVM Light, however, we also use a different way to set the design time DataContext. In fact, we often don’t set a different ViewModel but instead we use a different data service at design time. This is done in the ViewModelLocator, with this code:

static ViewModelLocator()
{
    ServiceLocator.SetLocatorProvider(() => SimpleIoc.Default);

    if (ViewModelBase.IsInDesignModeStatic)
    {
        SimpleIoc.Default.Register<IDataService, Design.DesignDataService>();
    }
    else
    {
        SimpleIoc.Default.Register<IDataService, DataService>();
    }

    SimpleIoc.Default.Register<MainViewModel>();
}

The code above is setting up the IOC container (in this case MVVM Light’s SimpleIoc) to use a DesignDataService class in the visual designer. This is a neat way to create design time data in a completely isolated manner, which also makes it easy for different developers to work on the runtime vs design time version of the data.

The cool side effect is that the improvement to the XAML intellisense will also work for the way that MVVM Light applications are set up. So yay to the XAML tools team! They’re really brilliant people who work tirelessly to make our life as developers better.

Happy coding
Laurent

Previous entry | Next blog entry

Responses to “XAML Intellisense just got better”

  1. Laurent Kempé Says:

    This as been working for ages in ReSharper!

  2. lbugnion Says:

    i think you are mistaken. R# was showing some Intellisense, yes, but not the VM’s properties.

Comments for XAML Intellisense just got better