Deborah's Developer MindScape

The new Intellisense for Binding expressions in Visual Studio 2013 (introduced in this prior post) provides a quick and effective way to add property bindings to your XAML. But it doesn’t "just work". You have to set the Data Context to enable Intellisense.

To get Intellisense to work with Binding expressions, you need to provide Intellisense with a design-time instance of the class containing the properties for the binding. This is done through the Data Context.

If your XAML-based application uses the Model, View, View-Model (or MVVM) pattern, the Data Context is set to an instance of the View-Model.

There are several options for where and how you set the Data Context to an instance of the View-Model, depending on the framework you are using (if any) and your approach.

One option is to set the Data Context directly in the page as shown below:

In this example, the Data Context is set to the View-Model directly in the XAML. The vms prefix in the code above is the abbreviation set for the View-Model namespace.

By setting the Data Context for the page directly in the XAML, an instance of the View-Model is constructed when the page is displayed in the designer. So the Intellisense has an instance of the class at design time that it can use to determine the bindable properties. You also get the added benefit of design-time data, as shown below.

Alternatively, you could set the Data Context in the code behind or use a factory pattern. But if you use any technique other than setting the Data Context within the XAML, Intellisense won’t have a design-time Data Context and therefore won’t display the list of bindable properties.

If you don’t have the Data Context defined within the XAML, but still want the benefits of Intellisense and design-time data, you can set up a design-time only Data Context instance. This is shown in the example below.

The d: prefix is for design-time only features. You may have used it to define the DesignHeight and DesignWidth of a page as shown in the Page markup tag above.

Assigning a value to the d:DataContext sets the design-time Data Context and enables basic Intellisense for Binding expressions.

In this example, the design-time Data Context is set to d:DesignInstance with a Type set to vms:CustomerListViewModel. This is the same View-Model used in the first example above.

The IsDesignTimeCreatable=true attribute ensures that an instance of the type is created at design time. By adding this attribute, the Intellisense will display all of the bindable properties. In addition, you get design-time data.

Use one of these techniques to take advantage of Intellisense for Binding expressions (and design-time data).

Enjoy!

For more information on the many new Visual Studio 2013 features, including a step by step walk through of the design-time Data Context, check out my new Pluralsight course: Mastering Visual Studio 2013.