사용자 지정 도구 창 빌드

아티클
06/19/2023

사용자 지정 도구 창은 Visual Studio에 복잡한 UI를 추가하는 좋은 옵션입니다.

도구 창은 Visual Studio의 핵심 UI 개념이며, 다음 비디오에서는 사용자 지정 창을 추가하는 방법을 보여 줍니다.

도구 창은 솔루션 탐색기, 오류 목록 및 기타 잘 알려진 도구 창처럼 이동하고 고정할 수 있는 창입니다. 도구 창은 Visual Studio에서 제공하는 외부 셸과 확장에서 제공하는 일반적으로 XAML <usercontrol>인 사용자 지정 내부 UI 컨트롤로 구성됩니다.

참고 항목

도구 창으로 새 확장을 만들려면 도구 창을 사용하는 VSIX 프로젝트(커뮤니티) 템플릿을 사용하여 새 프로젝트를 만들고 이 레시피의 나머지 부분을 건너뜁니다. 자세한 내용은 시작을 참조하세요.

기존 확장에 도구 창을 추가하려면 다음 간단한 4개 단계가 필요합니다.

도구 창 외부 셸 클래스를 만듭니다.
도구 창에 XAML <usercontrol>을 추가합니다.
도구 창을 등록합니다.
도구 창을 표시하는 명령을 만듭니다.

1단계부터 시작해 보겠습니다.

도구 창 만들기

BaseToolWindow<T> 제네릭 기본 클래스를 사용하여 몇 가지 기본 정보를 제공하라는 메시지가 표시됩니다. 도구 창의 제목을 지정하고, XAML 사용자 컨트롤을 만들고 반환하며, Visual Studio에서 창의 외부 셸을 만드는 데 사용하는 실제 ToolWindowPane 클래스를 설정해야 합니다.

using System;
using System.Runtime.InteropServices;
using System.Threading;
using System.Threading.Tasks;
using System.Windows;
using Community.VisualStudio.Toolkit;
using EnvDTE80;
using Microsoft.VisualStudio.Imaging;
using Microsoft.VisualStudio.Shell;

public class MyToolWindow : BaseToolWindow<MyToolWindow>
{
    public override string GetTitle(int toolWindowId) => "My Tool Window";

    public override Type PaneType => typeof(Pane);

    public override async Task<FrameworkElement> CreateAsync(int toolWindowId, CancellationToken cancellationToken)
    {
        await Task.Delay(2000); // Long running async task
        return new MyUserControl();
    }

    // Give this a new unique guid
    [Guid("d3b3ebd9-87d1-41cd-bf84-268d88953417")] 
    internal class Pane : ToolWindowPane
    {
        public Pane()
        {
            // Set an image icon for the tool window
            BitmapImageMoniker = KnownMonikers.StatusInformation;
        }
    }
}

CreateAsync(int, CancellationToken) 메서드에서 사용자 지정 사용자 정의 컨트롤의 인스턴스를 만들어야 합니다. 그러면 이 메서드는 Visual Studio에서 도구 창 셸이 만들어지는 동안 해당 도구 창 셸에 자동으로 전달됩니다.

하지만 먼저 사용자 정의 컨트롤을 만들어야 합니다.

XAML 사용자 정의 컨트롤 추가

코드 숨김 클래스가 포함된 XAML일 수 있으므로 단일 단추를 포함하는 <usercontrol>의 간단한 예제는 다음과 같습니다.

<UserControl x:Class="MyUserControl"
             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:toolkit="clr-namespace:Community.VisualStudio.Toolkit;assembly=Community.VisualStudio.Toolkit"
             mc:Ignorable="d"
             toolkit:Themes.UseVsTheme="True"
             d:DesignHeight="300" d:DesignWidth="300"
             Name="MyToolWindow">
    <Grid>
        <StackPanel Orientation="Vertical">
            <Label Margin="10" HorizontalAlignment="Center">My Window</Label>
            <Button Content="Click me!" Click="button1_Click" Width="120" Height="80" Name="button1"/>
        </StackPanel>
    </Grid>
</UserControl>

이제 사용자 지정 컨트롤을 반환하는 도구 창 클래스가 있습니다. 다음 단계는 Visual Studio에 도구 창을 등록하는 것입니다.

도구 창 등록

도구 창을 등록하는 것은 도구 창의 존재와 인스턴스화 방법을 Visual Studio에 알리는 것입니다. [ProvideToolWindow] 특성을 사용하여 패키지 클래스에서 이 작업을 수행합니다.

[ProvideToolWindow(typeof(MyToolWindow.Pane))]
public sealed class MyPackage : ToolkitPackage
{
     protected override async Task InitializeAsync(CancellationToken cancellationToken, IProgress<ServiceProgressData> progress)
     {
         this.RegisterToolWindows();
     }
}

참고 항목

패키지 클래스는 ToolkitPackage 또는 Package가 아니라 AsyncPackage에서 상속되어야 합니다.

도구 창에 사용해야 하는 스타일과 도구 창이 기본적으로 표시되어야 하는 위치를 지정할 수 있습니다. 다음 예제에서는 도구 창이 연결된 스타일의 솔루션 탐색기와 동일한 도킹 컨테이너에 배치되어야 한다는 것을 보여 줍니다.

[ProvideToolWindow(typeof(MyToolWindow.Pane), Style = VsDockStyle.Linked, Window = WindowGuids.SolutionExplorer)]

도구 창을 기본적으로 표시하기 위해 [ProvideToolWindowVisibility] 특성을 사용하여 다양한 UI 컨텍스트에서 표시 유형을 지정할 수 있습니다.

[ProvideToolWindowVisibility(typeof(MyToolWindow.Pane), VSConstants.UICONTEXT.NoSolution_string)]

도구 창을 표시하는 명령

이는 다른 명령과 동일하며 메뉴 & 명령 레시피에서 명령을 추가하는 방법을 확인할 수 있습니다.

도구 창을 표시하는 명령 처리기 클래스는 다음과 같습니다.

using Community.VisualStudio.Toolkit;
using Microsoft.VisualStudio.Shell;
using Task = System.Threading.Tasks.Task;

[Command(PackageIds.RunnerWindow)]
internal sealed class MyToolWindowCommand : BaseCommand<MyToolWindowCommand>
{
    protected override async Task ExecuteAsync(OleMenuCmdEventArgs e) =>
        await MyToolWindow.ShowAsync();
}

도구 창에 대한 명령 배치는 일반적으로 주 메뉴의 보기 -> 기타 창 아래에 있습니다.

모두 끝났습니다. 축하합니다. 이제 사용자 지정 도구 창을 만들었습니다.

소스 코드 가져오기

samples 리포지토리에서 이 레시피의 소스 코드를 찾을 수 있습니다.

다음을 통해 공유