Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
There were some major changes made to the architecture of Visual Studio in this release. The old Visual Studio interface, including the code editor, was replaced with a new UI written in WPF. Then the extensibility framework was enhanced with the new managed extensibility code bits. What this means for .NET programmers is that it is now easier to write a custom editor plug-in. You no longer have to learn the ugly COM object model to be a successful add-in author. I'm inside Visual Studio, and I've opened the CreateMefAddin Solution.
This contains two extensibility projects. The first one is enabled. The second one I have unloaded temporarily. That's why it says unavailable. Before you attempt to create an extensibility item, you need to install the Visual Studio SDK, which I've done. Now I can go to File > New > Project and choose my language and then this Extensibility note. And here are some other new items that were added for the SDK.
This is a syntax highlighter. This adds graphics to the editor margin. This applies adornments to the text, and the one we are going to look at today is called the Editor Viewport Adornment. This is going to draw a purple rectangle in a floating section of the UI. That's what the adornment layer is. I have already added a project of this type, so I am going to click Cancel, and then we are going to take a look at this code here. Most of the code that's inside this Floating Code Counter Factory is managed extensibility framework code.
I suggest you spend some time looking at the code in there to learn how it works. I don't have time to give you a tutorial on managed extensibility framework. I am going to look in this class here through, FloatingCodeCounter.cs. We are going to draw something on the adornment layer, which as I said is a floating area of the window, and then here's the important parts for this application. I am using these bits of code to generate a WPF brush, and then this section is creating a rectangle, a 30x30 rectangle, and using the brushes to draw that rectangle.
And then at some point, I'm going to get the adornment layer and add my floating code counter to the adornment layer. Then this wires up a few events to listen. If you resize the Visual Studio window, then it will move the adorner window to a new section. I'm ready to test out this application, so let me save the application and rebuild the application. Now lets think what needs to happen if I am going to test out my extension.
I need to install the tool in Visual Studio. Extension manager is one of the ways that I can do that. There is also a special type of installer, called a VSIX installer. You'll notice that in this project there is a file that ends with vsix.manifest. When I compile my code in this bin folder, it will create a file with the extension vsix. So when I'm ready to test the application, I need to launch another version of Visual Studio, especially if I want to debug my add-in.
I need to launch this second version and then attach the debugger to it, and then when you work in that second version of Visual Studio, you can walk through the code in this first one. To do that, you would click on Debug > Start Debugging. Using this method, however, is very slow because it's attaching the debugger to Visual Studio. So I am going to choose Start Without Debugging, which will launch the second version of Visual Studio but wont attach the debugger. I will show you what it looks like. Notice that at the top of my window it says Experimental Instance.
That's to tell me that I'm in the second copy of Visual Studio. Now before I go any further, let me make one change. Tools, Options, and then I'm going to go to Projects and Solutions, and uncheck this Save New Projects when created. I am going to be creating a lots of sample projects. I don't want to cut up my folder with applications I am not going to use. So I'll click on OK, and then I'll create a brand-new project, create a console application and here's my Code Editor window.
There is the first instance of Visual Studio in the background, and then you can see when I resize this window, this rectangle moves to a new position. That's the floating window. When I close this second instance of Visual Studio and choose Discard, I get this dialog because of that Tools Option settings I just changed. And now I am going to show you the code in this second project. So I am going to reload the second project and unload the first project.
Then I am going to save my changes, and we are going to rebuild my application. This application is slightly more interesting because it has a better UI. I have written a WPF user control, and I've added some text blocks, and in this case, I've added a text block called Total Lines Text block. I'm going to read the line count inside the code window and update this number. The way I am doing that is I am going to exposing some properties on this window and then in the FloatingCodeCounterV3.cs file, down here in this area, I am using this to talk to the Visual Studio editor and get the line counts again.
Look at this code to see how it works. I am ready to try it out, so I am going to go and choose Debug > Start Without Debugging. The Experimental Instance of Visual Studio runs, I click on New Project, choose a console application, and there is my new floating window. You can see the old floating window is still there. This is interesting. It was installed inside this experimental instance of Visual Studio. So I can uninstall this purple rectangle by going to Tools, Extension Manager, and it shows that I have the FloatingCodeCounter and the FloatingCodeCounterV3 installed.
So if I click here and choose Uninstall and then restart Visual Studio, that purple rectangle disappears. I am going ahead and leave with it like it is. Now, watch what happens when I come over here and type in some lines of code. The total lines updates to 15 and if I put a few blank lines in and show have 4 blank lines of code, and if I put comment in here, that updates the comments section. Wow.
The ease of creating these extensions is incredible. I know I've created a few extensions in the old days, and this is much easier. Plus, the ability to use the extension manager to add and remove extensions is very powerful. In the next movie, I'll show you how to install extensions and add them to the public extension store.
Get unlimited access to all courses for just $25/month.Become a member
82 Video lessons · 101628 Viewers
61 Video lessons · 88383 Viewers
71 Video lessons · 72224 Viewers
56 Video lessons · 103971 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.