Code Samples, Documentation, and… Twitter!

VSEditor — Fri, 26 Jun 2009 03:40:00 GMT

Samples

In an effort to help more people get started with Editor extensibility quickly and easily, we’ve recently posted some new code samples on the VS 2010 Editor. Each of the links below will take you to a sample, complete with description, instructions, and a download of all the code you need.

ToDo Glyphs: Adds a visual glyph for ToDo items in a file
Hyperlink: Enables Ctrl+click navigation to hyperlinks
Diff Classifier: Provides syntax highlighting for diff/patch files
Highlight Word: Uses tagging and adornments to highlight all occurrences of the word under the caret
Caret Fish Eye: Transforms the text in the editor so it appears larger around your caret and smaller elsewhere

There’s also source code available for the RegEx Editor, Demo Dashboard, IntelliSense Presenter, and Image Insertion extensions, as seen on the Visual Studio Gallery and in the Extension Manager, so you can see how we implemented them :-) You can find all of these and a variety of samples from other teams at the VSX sample homepage – check back periodically because we’ll continue to add new content from now to the final release of VS 2010.

Documentation

We’ve also heard some feedback that you want more documentation, so here it is: Beta1 Editor documentation. You’ll find walkthroughs on extensibility, help with MEF, a list of extension points, and more. It’s a great place to get started.

Twitter

You can always get in touch with the Editor team by commenting on this blog, posting in our Beta1 feedback forums, or e-mailing us directly. Now there’s one more way to get Editor news and keep in touch with the Editor team: follow @vseditor on Twitter! We’re new to Twitter but are already tweeting about new samples, documentation, news, and all things Editor, so check us out!

Brittany Behrens
Program Manager, VS Platform Team

Walkthrough: Getting Started with Editor Extensions

VSEditor — Wed, 10 Jun 2009 21:11:00 GMT

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.

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

Visual Studio Editor Blog : margins

Code Samples, Documentation, and… Twitter!

Samples

Documentation

Twitter

Walkthrough: Getting Started with Editor Extensions