Compartilhar via


Criar janelas de ferramentas personalizadas

Janelas de ferramentas personalizadas são ótimas opções para adicionar interface do usuário complexa ao Visual Studio.

Uma janela de ferramenta é um conceito de interface do usuário principal no Visual Studio, e o vídeo a seguir mostrará como adicionar uma janela personalizada.

Uma janela de ferramenta é uma janela que pode ser movida e encaixada como o Gerenciador de Soluções, a Lista de Erros e outras janelas de ferramentas conhecidas. Uma janela de ferramenta consiste em um shell externo fornecido pelo Visual Studio e um controle de interface do usuário interno personalizado, que geralmente é um XAML <usercontrol>, fornecido pela extensão.

Observação

Para criar uma nova extensão com uma janela de ferramenta, crie um novo projeto usando o modelo VSIX Project w/Tool Window (Community) e ignore o restante desta receita. Consulte Introdução para obter mais informações.

Adicionar uma janela de ferramenta a uma extensão existente requer 4 etapas simples:

  1. Crie uma classe de shell externo da janela de ferramentas.
  2. Adicione um XAML <usercontrol> à janela da ferramenta.
  3. Registre a janela da ferramenta.
  4. Crie um comando para mostrar a janela da ferramenta.

Vamos começar com a etapa 1.

Criar a janela de ferramentas

Usando a classe base genérica, somos solicitados a BaseToolWindow<T> fornecer algumas informações básicas. Devemos especificar o título da janela de ferramenta, criar e retornar o controle de usuário XAML e definir a classe real ToolWindowPane usada pelo Visual Studio para criar o shell externo da janela.

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;
        }
    }
}

Você deve criar uma instância do seu controle de usuário personalizado a CreateAsync(int, CancellationToken) partir do método, que é automaticamente passado para o shell da janela de ferramenta quando ele está sendo criado pelo Visual Studio.

Mas primeiro, você deve criar o controle de usuário.

Adicionar o controle de usuário XAML

Ele pode ser qualquer XAML com sua classe code-behind, então aqui está um exemplo simples de um contendo um <usercontrol> único botão:

<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>

Agora temos nossa classe de janela de ferramentas que retorna nosso controle personalizado. A próxima etapa é registrar nossa janela de ferramenta com o Visual Studio.

Registrar a janela de ferramentas

Registrar a janela de ferramenta significa que estamos informando ao Visual Studio sobre sua existência e como instanciá-la. Fazemos isso a partir de nossa classe de pacote usando o [ProvideToolWindow] atributo .

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

Observação

Observe que a classe do pacote deve herdar do ToolkitPackage e não de Package ou AsyncPackage.

Você pode especificar qual estilo a janela de ferramenta deve ter e onde ela deve aparecer por padrão. O exemplo a seguir mostra que a janela de ferramenta deve ser colocada no mesmo contêiner de encaixe que o Gerenciador de Soluções em um estilo vinculado.

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

Para tornar a janela da ferramenta visível por padrão, você pode especificar sua visibilidade em diferentes contextos de interface do usuário usando o [ProvideToolWindowVisibility] atributo.

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

Comando para mostrar a janela da ferramenta

Este é o mesmo que qualquer outro comando, e você pode ver como adicionar um na receita Menus & Comandos.

A classe do manipulador de comandos que mostra a janela da ferramenta terá a seguinte aparência:

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();
}

O posicionamento do comando para janelas de ferramentas geralmente está em Exibir -> Outras janelas no menu principal.

É isso. Parabéns, agora você criou sua janela de ferramenta personalizada.

Obter o código-fonte

Você pode encontrar o código-fonte dessa receita no repositório de exemplos.