How can I match Visual Studio's theme when cre

问题:

I am creating an extension for Visual Studio (2012+) that involves a tool window. I was hoping to style the window identically to match the current theme of Visual Studio. However, I am having a great deal of trouble figuring out how to do it.

This post suggests that applying no style at all is all that is required, but that does not match my experience thus far (even creating a default VSIX project in VS2017 and adding a tool window shows a button that I would argue is standard WPF in theme and not VS themed, at least when using the dark VS theme in VS2017).

This post asked a similar question, and the solution at the time seemed to be to create similar controls using a free toolkit. However, that was for VS2012 and 6 years ago, and I'm hoping a solution is more available these days. It doesn't seem very future proof to take this route.

Another solution is to apply Visual Studio's VsBrushes and VsColors to WPF controls. This probably gets me some way to the solution - but styles are more than colors, so it doesn't seem very satisfactory.

Is there a way to apply Visual Studio's basic controls styles (button, text box, listview, treeview, etc.) to my VSIX tool window to make it look and feel at home in Visual Studio?

Thanks for any suggestions!

回答1:

How can I match Visual Studio's theme when creating a VSIX tool window?

You can try to binding to static VS resources:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vs_shell="clr-namespace:Microsoft.VisualStudio.PlatformUI;assembly=Microsoft.VisualStudio.Shell.11.0">
<Style TargetType="Label">
    <Setter Property="Foreground" Value="{DynamicResource {x:Static vs_shell:EnvironmentColors.ToolWindowTextBrushKey}}"/>
</Style>
<Style TargetType="TextBox">
    <Setter Property="Foreground" Value="{DynamicResource {x:Static vs_shell:EnvironmentColors.ToolWindowTextBrushKey}}"/>
    <Setter Property="Background" Value="{DynamicResource {x:Static vs_shell:EnvironmentColors.ToolWindowBackgroundBrushKey}}"/>
</Style>
</ResourceDictionary>

See EnvironmentColors Class for more details.

Note: To get the exactly the same theme, you need use the exact XAML that VS uses. Thanks @GrantTheAnt.

回答2:

As another follow up to this, when writing my Visual Studio extension, I really wanted to have my tool window appear as much like a Visual Studio window as possible. At times, I found it incredibly difficult to find the correct EnvironmentColors value. At a minimum, the correct color value should work across the default/provided Visual Studio themes. So, frustrated, I wrote a little application to help me figure out the right value, which I’ve made available at http://niahtextfilter.com/environmentcolorsfinder/. To use it, you specify the RGB color value that you want, and the application will display the most likely EnvironmentColors candidates. To get the most accurate candidates, you can provide the color you want to display per theme (dark, regular, blue) - this is easy to achieve if you take a screenshot of a sample Visual Studio UI element in each theme, and color drop the pixel you need.

It helped me match my tool window to Visual Studio reasonably well:

I hope it helps others too!

回答3:

I feel as though the correct answer to this question is: you're not supposed to / Microsoft doesn't want you to do this. This post outlines the rationale behind this. The TLDR of the post seems to be that MS doesn't want third party windows looking like official VS windows, because it may cause confusion for users. I guess that's fair enough, but the flipside to that is that VS winds up looking pretty ugly with differently themed/styled windows.

If - like me - you still want to push on and style your windows like VS, the best option seems to be to go with @Leo's post above and use EnvironmentColors. You won't get the styles but you can get pretty close with the colors at least. This is a good blog which outlines some more depth on this.

I'll accept Leo's answer on the basis that it's the best solution available.