비주얼 스투디오 익스텐션 색 출력 문제 – 커뮤니티 툴키츠

Bya programming trader

비주얼 스투디오 익스텐션을 만들려면 vsix 프로젝트를 만들어야 한다. 솔루션 익스플로러 같은 창을 만들려면 tool window를 만들어야 한다. 빈 vsix 프로젝트에 tool window를 만들려면 파일들을 몇 개 추가해야 한다. 파일들을 직접 만들어 추가해도 되고 아래와 같이 편하게 할 수도 있다.

project > add new item > installed > c# items > extensibility > tool window

만들어진 xaml 파일을 열고 아래와 같이 TreeView 코드를 추가한다.

<UserControl x:Class="new_visix.ToolWindow1Control"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:vsshell="clr-namespace:Microsoft.VisualStudio.Shell;assembly=Microsoft.VisualStudio.Shell.15.0"
             Background="{DynamicResource {x:Static vsshell:VsBrushes.WindowKey}}"
             Foreground="{DynamicResource {x:Static vsshell:VsBrushes.WindowTextKey}}"
             mc:Ignorable="d"
             d:DesignHeight="300" d:DesignWidth="300"
             Name="MyToolWindow">
    <Grid>
        <StackPanel Orientation="Vertical">
            <TextBlock Margin="10" HorizontalAlignment="Center">ToolWindow1</TextBlock>
            <Button Content="Click me!" Click="button1_Click" Width="120" Height="80" Name="button1"/>
            <TreeView>
                <TreeViewItem Header="Parent">
                    <TreeViewItem Header="Child"/>
                </TreeViewItem>
            </TreeView>
        </StackPanel>
    </Grid>
</UserControl>

디버그를 시작하면 비주얼 스투디오가 새로 실행된다. 이걸 experimental instance라 한다. 아래의 메뉴가 생겼을 거다.

view > other windows > ToolWindow1

혹시 생기지 않으면 새로운 이름으로 프로젝트를 다시 만들어서 해 본다. 익스페리멘틀 인스턴스가 정교하게 작동하지는 않는다.

dark theme에서 실행을 하면 트리뷰만 하얀 걸 확인할 수 있다. background와 foreground 프라퍼티가 트리뷰에는 제대로 작동하지 않기 때문이다. 트리뷰아이템을 직접 설정해도 백그라운드는 적용이 되지만 포그라운드는 여전히 적용되지 않는다. community toolkits를 이용해야 한다.

커뮤니티 툴키츠를 설치하고 위 문제를 해결해도 되지만 기왕에 저걸 설치했으면 vsix 프로젝트 말고 vsix project w/tool window (community)를 설치하는 게 더 편하다.

xaml 파일을 열어 보면 아래의 차이를 확인할 수 있다.

<UserControl x:Class="test.MyToolWindowControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:imaging="clr-namespace:Microsoft.VisualStudio.Imaging;assembly=Microsoft.VisualStudio.Imaging"
             xmlns:theming="clr-namespace:Microsoft.VisualStudio.PlatformUI;assembly=Microsoft.VisualStudio.Imaging"
             xmlns:util="clr-namespace:Microsoft.VisualStudio.PlatformUI;assembly=Microsoft.VisualStudio.Utilities"
             xmlns:catalog="clr-namespace:Microsoft.VisualStudio.Imaging;assembly=Microsoft.VisualStudio.ImageCatalog"
             xmlns:toolkit="clr-namespace:Community.VisualStudio.Toolkit;assembly=Community.VisualStudio.Toolkit"
             toolkit:Themes.UseVsTheme="True"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="300"
             Name="MyToolWindow">
    <Grid>
        <StackPanel Orientation="Vertical">
            <Label x:Name="lblHeadline"
                   Margin="10"
                   HorizontalAlignment="Center">Title</Label>
            <Button Content="Click me!"
                    Click="button1_Click"
                    Width="120"
                    Height="80"
                    Name="button1" />
        </StackPanel>
    </Grid>
</UserControl>

저 코드를 통해 트리뷰의 색이 제대로 나온다.

They will automatically apply the official styling for WPF controls that Visual Studio uses itself.
Matching Visual Studio themes in Visual Studio extensions

Post Tags: