In an attempt to bring extension building to the masses, the editor team submitted a hands on lab for TechEd this year that walks you through creating a real-world extension. While one of the goals of the lab is to show you how to build extensions in general, the hope was to also disseminate some of the methodologies and concepts behind our new extensibility story.

Everyone has certainly seen the obligatory “Hello World” code for any new thing they try. I wanted the lab to be much more meaningful than that though, and instead provide you with a scenario that might be something you actually want to do. In this case, what you’re building is an extension that allows you to place walkthrough content directly inside of the editor in little chat-like bubbles.

Screenshot from the TechEd Hands-On Lab

All of the walkthrough steps you see here are actually parsed from an XML file, which means that this extension adds meta content to the editor window without any modification of the code file it is displaying. Moreover, there is also another kind of visual created here; a little block around the word “System,” which when hovered over will then display a tooltip with extra information. These two visuals are called “Adornments” in the editor world, and are nothing more than Windows Presentation Framework (WPF) elements associated to a grouping of text. Last but not least, the green bar across the top of the image above (that has a label with “Position:” on it) is called a margin. This is another WPF element, but this time it is snapped to the outside edge of the editor’s window.

So if you didn’t get a chance to make it to TechEd 2009, but would like to try out the lab, you’re in luck. It takes about an hour to complete (yes, you will be able to get all of that functionality done in an hour) and it takes the time to explain a bit about what you’re doing and why. I hope you find it useful, and look forward to the extensions you guys create!

Download Lab Files

Cheers,

Chris Granger
Program Manager | Visual Studio Platform