Il presente articolo è stato tradotto automaticamente.

ALM Rangers

Estensione di Visual Studio Team Explorer 2012

Mike Fourie

Scarica il codice di esempio

In questo articolo parlerò nuovi punti di estendibilità forniti in Microsoft Visual Studio Team Explorer 2012.Costruirò un esempio per evidenziare l'architettura di Team Explorer 2012 fornendo speriamo che voi con qualche ispirazione per costruire le estensioni che saranno utile a voi, il vostro team e forse anche la più ampia comunità.

Dal Visual Studio 2005, Team Explorer ha fornito l'interfaccia principale per interagire con le varie caratteristiche di squadra-centriche fornite in Visual Studio come elementi di lavoro, documenti di SharePoint, rapporti, compilazioni e controllo del codice sorgente.

Le versioni successive di Visual Studio 2008 e Visual Studio 2010 fornito aggiornamenti minori per Team Explorer, ma il paradigma di navigazione vista ad albero base rimase in luogo — fino a Visual Studio 2012 è arrivato, che è.Visual Studio 2012 ha introdotto una completamente riprogettato Team Explorer e UX.La visualizzazione ad albero, che è stato sostituito da un insieme di pagine che fornisce l'accesso alle stesse caratteristiche abbiamo abituati a, così come alcune nuove caratteristiche come il mio lavoro è andato.

Si noti inoltre che con Visual Studio 2012, si può ora lavorare interamente in codice gestito senza qualsiasi preoccupazione per trattare con interni COM.

Team Explorer 2012 panoramica

Team Explorer 2012 comprende diverse pagine, ognuna delle quali può essere suddiviso in sezioni e navigazione elementi host e i collegamenti di spostamento.La pagina di default è chiamata Home e fornisce facile accesso alle altre pagine fornito in Team Explorer, vale a dire mio lavoro, modifiche in sospeso, elementi di lavoro, costruisce, accesso Web, membri del Team e le impostazioni.

Figura 1 Mostra la Home page e i vari elementi di navigazione e link forniti.

The Team Explorer 2012 Home PageFigura 1 la Home Page di Team Explorer 2012

Figura 2 viene illustrato l'utilizzo di sezioni, che è possibile aggiungere alle pagine.

Sections in the Team Explorer Builds PageFigura 2 sezioni in Team Explorer Crea pagina

Se questa è la prima volta che hai visto Team Explorer 2012, sarete senza dubbio d'accordo che il design è completamente diverso dalla precedente esperienza Tree View-based fornito in Visual Studio , 2005, 2008 e 2010.

Data la semplicità e l'efficienza delle precedenti implementazioni di visualizzazione ad albero, si potrebbe chiedere perché non c'è stato una tale riprogettazione radicale.Dopo aver lavorato nel nuovo basato sulla pagina Team Explorer si potrebbe sentire — e penso che con qualche giustificazione — che la navigazione non è efficiente quanto la semplice visualizzazione ad albero che ha sostituito.Ci vuole sicuramente abituarcisi, anche se si spera entro la fine di questo articolo capirete che la perdita di corrente nell'efficienza di navigazione è controbilanciata dalle caratteristiche di estensibilità potente che fornisce il nuovo design della pagina e la riduzione delle finestre di dialogo modali che sono prevalenti nelle versioni precedenti.Si noti che dire "attuale" perdita di efficienza di navigazione, come mi aspetto che la progettazione ad essere modificati nel corso degli aggiornamenti trimestrali di che Microsoft è ora fornendo per Visual Studio.Infatti, Visual Studio 2012 aggiornamento 2 ha un utile nuovo Connect pagina che visualizza ogni Team Foundation Server (TFS), insieme di progetti Team e Team di progetto a cui si hai precedentemente connessi, rendendo molto più facile navigare tra TFS connessioni.

Team Explorer estensibilità risorse esistenti

Oltre a questo articolo, si dovrebbe essere consapevoli di alcune altre risorse che possono aiutarti a trovare il vostro senso intorno si estende Team Explorer.MSDN ha documentazione API-livello che copre lo spazio dei nomi Microsoft.TeamFoundation.Controls che ospita tutti gli oggetti che io estendo.

La Visual Studio Developer Center ha un campione, "estensione Team Explorer in Visual Studio 2012" (bit.ly/Zp1OFf), che è stato pubblicato dal team che ha sviluppato Team Explorer 2012.L'estensione del campione di MyHistory fornito con questo articolo si basa su quel campione e vi raccomando di che leggere prima.

Team Explorer Architettura

Prima di iniziare la creazione di estensioni per Team Explorer sarà utile capire un po ' su come Team Explorer è architettato.

Le estensioni che si crea è necessario implementare l'interfaccia per il punto di estensione che il targeting.Queste interfacce vengono implementate nello spazio dei nomi Microsoft.TeamFoundation.Controls e sono definite come segue:

Estensioni create sono scoperti usando il Managed Extensibility Framework (MEF).Per facilitare l'individuazione, è necessario decorare la classe con l'attributo appropriato come definito qui:

  • Pagina: [TeamExplorerPage("guid")] (bit.ly/17kBzQD)
  • Sezione: [TeamExplorerSection ("guid", "parentPageGuid", priorità)] (bit.ly/12nMxCC)
  • Elemento di navigazione: [TeamExplorerNavigationItem ("guid", priorità)] (bit.ly/Y6YQ7S)
  • Link di navigazione: [TeamExplorerNavigationLink ("guid", "parentNavigationItemGuid", priorità)] (bit.ly/12KFghj)

Per l'estensione di essere scoperto, l'assembly deve essere in uno dei luoghi "noto" estensione per Visual Studio.Queste posizioni sono definite nel file "Master PkgDef", situato a <VsInstallRootFolder> \Common7\IDE\devenv.pkgdef.

Il meccanismo di imballaggio consigliata per le estensioni è di utilizzare un Visual Studio Extension (VSIX).Questo meccanismo si prenderà cura di tutte le tubature di distribuzione per te.Se vuoi saperne di più su discovery, vedere il post del Blog di Visual Studio , "Come le estensioni VSIX sono scoperti e caricate in VS 2010" (bit.ly/xTJrSv).

Per illustrare la vita di estensione, navigazione, gestione del contesto e altre funzionalità disponibili per l'estensione, diamo un'occhiata alla mia storia campione fornito con questo articolo.

Per iniziare con l'applicazione di esempio

È possibile scaricare l'intero esempio per questo articolo, ma credo che sia importante sottolineare alcuni punti chiave per aiutarvi a iniziare con successo con la propria estensione di costruzione.

Per creare un'estensione si sta andando avere bisogno di Visual Studio 2012 — e, in particolare, il SDK Visual Studio 2012 — per creare il progetto VSIX.Quando si crea un progetto VSIX, Visual Studio vi porta direttamente al file con estensione vsixmanifest mostrato Figura 3.Ho aggiunto il mio file di licenza al progetto e completato alcuni campi come mostrato.

Details of the .vsixmanifest FileFigura 3 dettagli del file con estensione vsixmanifest.

È possibile scegliere di aggiungere l'estensione in un assembly separato o ospitare tutto il codice all'interno del progetto VSIX.Se si sceglie di ospitare tutto il codice in VSIX, è importante modificare manualmente il file csproj così l'assembly di estensione è incluso nel pacchetto VSIX.Per impostazione predefinita, il progetto VSIX crea solo il pacchetto VSIX.Quando si distribuisce l'estensione, si mostrerà come installato; Tuttavia, l'assembly non distribuito, quindi non essere scoperto.Per includere l'assembly, è necessario aprire il file csproj in un editor di testo e impostare le impostazioni del progetto, come illustrato nel codice riportato di seguito (questo cambiamento non può essere effettuato tramite l'interfaccia utente):

<IncludeAssemblyInVSIXContainer>true</IncludeAssemblyInVSIXContainer>
<CopyBuildOutputToOutputDirectory>true</CopyBuildOutputToOutputDirectory>

All'interno del file manifesto è necessario configurare attività così l'estensione può distribuire l'estensione in modo appropriato. Nella scheda attività, aggiungere un nuovo Microsoft.VisualStudio.VsPackage per il progetto. Questo dice il VSIX che si sta creando un pacchetto di Visual Studio . Inoltre, aggiungere una risorsa di tipo Microsoft.VisualStudio.MefComponent, che fornisce il nome dell'assembly nel pacchetto VSIX estensione.

Un progetto VSIX non ha alcun riferimento per impostazione predefinita, quindi è necessario aggiungere tutti quelli che sono necessari. Almeno sei probabilmente bisogno i seguenti riferimenti:

  • Microsoft.TeamFoundation.Client
  • Microsoft.TeamFoundation.Controls
  • Microsoft
  • Microsoft.TeamFoundation.VersionControl.Controls
  • Interop
  • 10.0
  • 8.0
  • Microsoft.VisualStudio.Shell.Interop.9.0
  • Microsoft.VisualStudio.TeamFoundation.VersionControl
  • Microsoft
  • Microsoft.VisualStudio.Shell.11.0
  • Microsoft.VisualStudio.Shell.Immutable.10.0
  • PresentationCore
  • PresentationFramework
  • Sistema
  • System.ComponentModel.Composition
  • System. Core
  • System.Drawing
  • spazio dei nomi
  • System. Xaml
  • System.Xml

Anche se è possibile creare l'estensione nel codice gestito, sarà probabilmente ancora necessario integrare con Visual Studio via COM, quindi molto probabilmente avrete bisogno anche i riferimenti a EnvDTE ed EnvDTE80 COM.

Una volta che hai fatto tutto questo, sei pronto per iniziare la creazione di contenuti per estendere Team Explorer.

Debug

Se questa è la tua prima avventura utilizzando progetti VSIX, si potrebbe chiedere come eseguirne il debug. In Visual Studio 2012 ora viene creato il nuovo progetto con le necessarie informazioni di Debug, così si può semplicemente premere F5 e una nuova istanza di "sperimentale" di Visual Studio (bit.ly/12KRCGq) avrà inizio con l'estensione caricata.

È possibile impostare punti di interruzione nel codice e debug come qualsiasi altra applicazione, anche se forse un po ' più lento di voi può essere utilizzato per le applicazioni più semplici. In qualche modo il mio progetto è riuscito a perdere le impostazioni, quindi ho mostrato loro in Figura 4. Fondamentalmente l'azione di avvio è impostato su Avvia programma esterno con il valore C:\Program Files (x86) \Microsoft Visual Studio 11.0\Common7\IDE\devenv.exe e la riga di comando, gli argomenti sono impostati su /rootsuffix Exp.

VSIX Debug Settings
Figura 4 VSIX Debug Settings

Walk-through del mio campione di storia

Gli sviluppatori hanno spesso bisogno di multitasking (che è la parola fantasia per randomizzazione!) e a volte dimenticare ciò che hanno fatto solo un paio di minuti o giorni fa. L'estensione della mia storia si propone di contribuire a migliorare la tua esperienza multitasking fornendo un elenco delle aree di sospensione, insiemi di modifiche, gli elementi di lavoro e progetti/soluzioni con cui hai lavorato recentemente. Mostrato Figura 5, si compone di una nuova pagina con più sezioni, elementi di navigazione e i collegamenti di spostamento.

The My History Extension
Figura 5 la mia estensione di storia

A questo punto sarebbe consiglia di installare l'estensione per vedere come si estende Team Explorer, quindi tornare a questo articolo per passare attraverso alcune parti principali del codice di estensione.

Il codice della mia storia

La soluzione è organizzata in una serie di cartelle per una più facile navigazione e scoperta.

La cartella di Base contiene un set di classi basate su quelle di cui al suddetto "estensione Team Explorer Visual Studio 2012" campione. Le cartelle interne e risorse contengono varie classi helper. Siete più interessati nella cartella sezioni, che contiene l'implementazione degli oggetti da cui è necessario derivare. Figura 6 Mostra come le classi sono correlate.

Diagram of MyHistory Classes
Figura 6 diagramma delle classi MyHistory

Per creare un punto di ingresso nella nuova pagina, è necessario aggiungere un Link di navigazione in una delle sezioni esistenti sulla Home Page.

Figura 7 viene illustrato il codice per il Link di navigazione personalizzate contenute in MyHistory­NavigationLink.cs. Questo codice produce il mia storia link mostrato Figura 5.

Figura 7 il mio Link di navigazione storia

[TeamExplorerNavigationLink(MyHistoryNavigationLink.LinkId,
   TeamExplorerNavigationItemIds.MyWork, 200)]
public class MyHistoryNavigationLink : TeamExplorerBaseNavigationLink
{
  public const string LinkId = "e49a882b-1677-46a9-93b4-db290943bbcd";
  [ImportingConstructor]
  public MyHistoryNavigationLink([Import(typeof(SVsServiceProvider))]
     IServiceProvider serviceProvider) : base(serviceProvider)
  {
    this.Text = "My History";
    this.IsVisible = true;
    this.IsEnabled = true;
  }
  public override void Execute()
  {
    try
    {
      ITeamExplorer teamExplorer = GetService<ITeamExplorer>();
      if (teamExplorer != null)
      {
        teamExplorer.NavigateToPage(new Guid(MyHistoryPage.PageId), 
          null);
      }
    }
    catch (Exception ex)
    {
      this.ShowNotification(ex.Message, NotificationType.Error);
    }
  }

Quando il link viene cliccato, è eseguire il metodo Execute e Team Explorer è fatto per passare alla mia storia pagina personalizzata. Diamo un'occhiata più da vicino la prima riga in Figura 7. Il TeamExplorerNavigation­Link classe attributo viene utilizzato per associare il collegamento con la sezione MyWork, e la priorità di 200 mezzi che collegano verrà probabilmente visualizzata ultima, supponendo che qualcuno non ha ancora installato un'altra estensione con un numero superiore (priorità bassa).

Figura 8 Mostra il codice in MyHistoryPage.cs, che prevede l'aggiunta di una nuova pagina Team Explorer . Si noti l'utilizzo dell'attributo e ID univoco utilizzato.

Figura 8 la pagina MyHistory

/// <summary>
/// MyHistory Page.
We're extending Team Explorer by adding a new page and
/// therefore use the TeamExplorerPage attribute and pass in our unique ID
/// </summary>
[TeamExplorerPage(MyHistoryPage.PageId)]
public class MyHistoryPage : TeamExplorerBasePage
{
  // All Pages must have a unique ID; use the Tools | Create   
  // GUID menu in Visual Studio to create your own GUID
  public const string PageId = "BAC5373E-1BE5-4A10-97F5-AC278CA77EDF";
  public MyHistoryPage()
  {
    // Set the page title
    this.Title = "My History";
  }
}

Hai una voce scegliere la nuova pagina, e si può raggiungere la nuova pagina; ora è necessario ottenere il contenuto sulla pagina. ' Ll coprire la sezione di insiemi di modifiche in dettaglio e lasciare a voi a dare un'occhiata alle altre sezioni implementate nel proprio tempo. Tutti seguono lo stesso modello di base.

Nel codice che accompagnano il download è la classe ChangesetsSection.cs, che è troppo lunga per essere elencati in questo articolo. In questa classe si registra un nuovo ITeamExplorerSection con la MyHistory Page, utilizzando l'attributo della classe TeamExplorerSection. Si noti che il valore di 20 nell'attributo class è la priorità della sezione. Il più basso la priorità, il più in alto nella pagina nella sezione rendering. La classe dichiara una ObservableCollection di insiemi di modifiche a cui è associato l'interfaccia utente. Nel costruttore della classe è definire impostazioni aggiuntive visive e comportamentale. È importante per la classe di collegamento al relativo contenuto di rendering, che è una nuova istanza del controllo utente, ChangesetsSectionView.xaml.

Nota nel metodo Initialize verificare per contesto così è possibile ricaricarlo dalla memoria, anziché esso re-query. Il metodo SaveContext Salva le informazioni di contesto necessario per un utilizzo futuro, e il metodo ContextChanged può essere utilizzato per aggiornare i dati se l'utente cambia progetti o collezioni. In tutti i casi, se hai bisogno di re-query, è farlo in modo asincrono per evitare di bloccare il thread dell'interfaccia utente. Il metodo ViewChangesetDetails viene chiamato dal controllo utente. Questo metodo interagisce con Team Explorer e fornisce le informazioni necessarie a rendere i dettagli insieme di modifiche nella pagina corretta.

L'ultimo pezzo del puzzle è quello di creare il controllo utente per visualizzare il contenuto. La sezione di insiemi di modifiche fornisce una doppia -­elenco cliccabile delle ultime 10 check-nell'utente ha fatto, ciascuno con un tooltip che mostrano pochi dettagli pertinente e un collegamento ipertestuale a prendere l'utente alla storia Changeset completo, come mostrato Figura 9.

The Changesets Section UI
Figura 9 la sezione di insiemi di modifiche dell'interfaccia utente

Il codice del controllo utente è abbastanza di base, e davvero solo gestisce eventi dell'utente, effettuare chiamate attraverso alla ParentSection per interagire con Team Explorer. Figura 10 fornisce una visualizzazione abbreviata sopra alcune di codebehind. Si noti l'utilizzo della dipendenza­classe di proprietà (bit.ly/11FJNQW), che consente di associare il controllo utente alla classe che hai registrato con Team Explorer.

Figura 10 il codice del controllo utente di insiemi di modifiche

public partial class ChangesetsSectionView
{
  public static readonly DependencyProperty ParentSectionProperty =       
    DependencyProperty.Register("ParentSection",
    typeof(ChangesetsSection), typeof(ChangesetsSectionView));
  public ChangesetsSection ParentSection
  {
    get { return (ChangesetsSection)GetValue(ParentSectionProperty); }
    set {SetValue(ParentSectionProperty, value);}
  }
  private void HistoryLink_Click(object sender, RoutedEventArgs e)
  {
    this.ParentSection.ViewHistory();
  }
  private void ChangesetList_MouseDoubleClick(
    object sender, MouseButtonEventArgs e)
  {
    if (e.ChangedButton == MouseButton.Left &&
       changesetList.SelectedItems.Count == 1)
    {
      this.ViewChangesetDetails();
    }
  }
}

Consapevolezza, comprensione e un punto di partenza

C'è molto di più codice a guardare attraverso il campione, che, insieme a quello che ho trattato in questo articolo, speriamo che ti mette a disposizione:

  • La consapevolezza dell'estensibilità Team Explorer 2012 fornisce.
  • Fornisce un'analisi approfondita del vasto API Visual Studio con cui è possibile interagire (assicuratevi di leggere l'articolo di MSDN Magazine, "Version Control in the TFS Client Object Model" msdn.microsoft.com/magazine/jj883959, se siete interessati a più materia di lettura a livello di API).
  • Un punto di partenza e la fiducia per creare il tuo primo ampliamento.

Grazie per il tempo di leggere questo e per favore cercate di più articoli da ALM Rangers (aka.ms/vsarunderstand).

Mike Fourie è un consulente indipendente con oltre 13 anni di esperienza di sviluppo software che si specializza nella compilazione e distribuzione automazione. Egli è un ALM Microsoft MVP e distinto ALM Ranger. Può essere raggiunto tramite il suo blog a freetodev.com. È anche possibile seguirlo su Twitter a twitter.com/mikefourie.

Grazie ai seguenti esperti tecnici per la revisione di questo articolo: Chad Boles (Microsoft), Jeff Bramwell (servizi di credito Farm of America), Willy-Peter Schaub (Microsoft) e Hamid Shahid (consulente)

Jeff Bramwell è direttore di architettura enterprise al Farm Credit Services of America. Ha più di 20 anni di esperienza di sviluppo di software e si sforza sempre di seguire il mantra di avvio semplice e il tuo lavoro da lì. Il suo blog è al devmatter.blogspot.com. È possibile seguirlo su Twitter a twitter.com/jbramwell.

Willy-Peter Schaub è un senior program manager con Visual Studio ALM Rangers presso il Microsoft Canada Development Center. Dalla metà degli anni '80 è alla continua ricerca di soluzioni semplici e gestibili nella progettazione software. Leggere il suo blog a blogs.msdn.com/b/willy-peter_schaub e seguirlo su Twitter a twitter.com/wpschaub.

Hamid Shahid è un Microsoft Visual Studio ALM Ranger e un consulente di software. Ha più di 13 anni di esperienza lavorando con tecnologie Microsoft con un interesse speciale in MSBuild e Team Foundation Server.