Writing a Debugger Visualizer in WPF: Part 1

1. Introduction

There are a lot of good examples of how to create a debugger visualizer for Visual Studio. One thing that is common among all of them, is that they are all written using Windows form. I got a question on the Microsoft forum asking whether it is possible to make debugger visualizer in WPF. I decided to do an experiment. After playing with it a little bit, I realized that it is possible to make a debugger visualizer even in WPF. This opens a whole new door for me, because now data can be displayed in a much more sophisticated way using modern technology.

2. Background

Let’s take a look at the first step. To make a debugger visualizer, we have to create a class that is inherited by DialogDebuggerVisualizer class. This class is defined in using Microsoft.VisualStudio.DebuggerVisualizers; namespace, so we have to include its reference too. This namespace defines other classes and interfaces for not only writing the debuger visualizer, but also to debug the visualizer itself. Here is a block diagram to show the classes and interfaces in this namespace.

All of these classes are inherited directly by Object class the grand daddy of .Net framework.Here is a class diagram of all classes define in Microsoft.VisualStudio.DebuggerVisualizer namespace.

There is only one method to overload in the DialogDebuggerVisualizer class, and here is the signature of that method.

protected override void Show(IDialogVisualizerService windowService,
IVisualizerObjectProvider objectProvider)

The class diagram of this class is very simple. Here is a class diagram of this class.
The method inherited by Object class isn't shown.

Now here is a little catch. In a traditional Windows form debugger, we are going to call
the ShowDialog method of IDialogVisualizerService interface that will internally call the Windows form. IdialogVisualizerService interface has only one method ShowDialog. This method is overloaded and can accept only CommonDialog, Control or Form. Here is a class diagram of this interface.

If we want to make a WPF based visualizer, then we have to create a Window object and call it ourselves.
In its simplest way it is something like this:

protected override void Show(IDialogVisualizerService windowService, IVisualizerObjectProvider objectProvider)

// set the attributes of WPF window
Window win = new Window();
win.Title = “My Visualizer”;
win.Width = 400;
win.Height = 300;
win.Background = Brushes.Blue;
win.WindowStartupLocation = WindowStartupLocation.CenterScreen;


Don’t forget to add the references of “WindowsBase”, “PresentationCore”, “PresentationFramework” and “Microsoft.VisualStudio.DebuggerVizualiers”, in the project.Here is a screen shot of Solution Explorer after adding the reference of WPF dlls and debugger vizualisers dll.

This will display the WPF visualizer window with a blue background. Let’s do little bit more and make one working application. This is just a proof of concept, so we are making one small application. Our visualizer works only with Int32 data type. We defined it at the form of attribute when defining the namespace for our visualizer.

[assembly: System.Diagnostics.DebuggerVisualizer(
typeof(MyVisualizer.MyVisualizerClass), typeof(VisualizerObjectSource),
Target = typeof(System.Int32),Description = “My Visualizer”)]
namespace MyVisualizer


Here text set into the “Description” property will display as a context menu when this vizualizer
is loaded during the debugging. We select Int32 data type just for simplicity because this type is also serializeable. If we want to make visualizer of our custom data type or any other non serializeable data type then we have to override GetData method of class that implements IVisualizerObjectProvider interface.

Now we have two ways to display our data if we are going to use any template to for better output. One simple, fast and preferred way is to write XAML and load that XAML programmatically. The other approach is to make everything programmatically.

More by Author

Must Read