Hinzufügen von Befehlen zu Ihrer Erweiterung

Zurück: Erstellen einer Erweiterung. Wir beginnen mit dem in diesem Artikel erstellten Projekt.

Nachdem Sie ihre Erweiterung erstellt haben, ist es an der Zeit, ihr Befehle hinzuzufügen.

Hinzufügen von Befehlen

Wir können beginnen, indem wir zur /Pages/<ExtensionName>Page.cs Datei navigieren. Diese Datei ist die ListPage , die angezeigt wird, wenn der Benutzer Ihre Erweiterung auswählt. Dort sollte Folgendes angezeigt werden:

public <ExtensionName>Page()
{
    Icon = IconHelpers.FromRelativePath("Assets\\StoreLogo.png");
    Title = "My sample extension";
    Name = "Open";
}
public override IListItem[] GetItems()
{
    return [
        new ListItem(new NoOpCommand()) { Title = "TODO: Implement your extension here" }
    ];
}

Hier sehen Sie, dass wir das Symbol für die Seite, den Titel und den Namen festgelegt haben, der auf der obersten Ebene angezeigt wird, wenn Sie den Befehl ausgewählt haben. Die GetItems Methode gibt die Liste der Befehle zurück, die auf dieser Seite angezeigt werden sollen. Gerade jetzt wird nur ein einzelner Befehl zurückgegeben, der nichts bewirkt. Versuchen wir stattdessen, diesen Befehl so zu gestalten, dass er die Seite dies im Standardwebbrowser des Benutzers öffnet.

  1. Aktualisieren Sie GetItems folgendermaßen:
public override IListItem[] GetItems()
{
    var command = new OpenUrlCommand("https://learn.microsoft.com/windows/powertoys/command-palette/adding-commands");
    return [
        new ListItem(command)
        {
            Title = "Open the Command Palette documentation",
        }
    ];
}

Um die Erweiterung in der Befehlspalette zu aktualisieren, müssen Sie:

  1. Stellen Sie Ihre Erweiterung bereit
  2. Geben Sie in der Befehlspalette den Befehl "neu laden" ein, um die Erweiterungen in der Palette zu aktualisieren.

Screenshot des Neuladens

Hinweis

Es gibt mehrere Optionen zum Erneutladen, stellen Sie sicher, dass Sie die Erweiterung "Befehlspalette neu laden" auswählen.

  1. Scrollen Sie nach unten zu Ihrer Erweiterung, und drücken Sie Enter
  2. Drücken Sie enter auf Open the Command Palette documentation
  3. Sie sollten sehen, dass der Befehl die Befehlspalettendokumentation öffnet.

Der OpenUrlCommand ist ein Hilfsprogramm zum Öffnen einer URL im Standardwebbrowser des Benutzers.

Debugging-Erweiterung

Wenn Sie Ihre Erweiterung erstellen, werden Sie sie höchstwahrscheinlich debuggen wollen.

  1. Fügen Sie der GetItems Funktion eine Debugmeldung hinzu.
    public override IListItem[] GetItems()
    {
        var command = new OpenUrlCommand("https://learn.microsoft.com/windows/powertoys/command-palette/adding-commands");
    
+       Debug.Write("Debug message from GetItems");
    
        return [
            new ListItem(command)
            {
                Title = "Open the Command Palette documentation",
            }
        ];
    }
  1. Stellen Sie Ihre Erweiterung bereit
  2. Vergewissern Sie sich, dass Sie sich in der Debugkonfiguration befinden
Anweisungen zum Bestätigen der Debugkonfiguration
  1. Sehen Sie sich die Symbolleiste am oberen Rand von Visual Studio an.
  2. Es wird ein Dropdown angezeigt, in dem entweder Debug oder Release steht (neben der grünen Schaltfläche "Start" ▶️).
  3. Wenn Release angezeigt wird, klicken Sie auf die Dropdownliste und wählen Sie Debug.

&It;lt;c0><sb0>Screenshot der Werkzeugleiste von Visual Studio, die „Debug“ anzeigt</sb0></c0>

  1. Führen Sie die App im Debug-Modus aus, indem Sie die grüne Schaltfläche ▶️ "Start" drücken oder F5 drücken.
  2. Stellen Sie sicher, dass das Ausgabefenster so eingestellt ist, dass Debug Ausgabe angezeigt wird (Strg + Alt + O)

Screenshot des Ausgabebereichs Visual Studio

  1. Führen Sie reload in der Befehlspalette aus.
  2. Wechseln Sie zu Ihrer Erweiterung, und wählen Sie Open the Command Palette documentation
  3. Im Ausgabefenster von Visual Studio sollten Sie Debug message from GetItems sehen.

Befehl "InvokableCommand"

Lassen Sie uns mit dem Erstellen eines neuen Befehls fortfahren, der ein MessageBox-Objekt anzeigt. Dazu müssen wir eine neue Klasse erstellen, die InvokableCommand implementiert.

  1. Fügen Sie in Visual Studio ihrem verzeichnis "Pages" eine neue Klassendatei hinzu.
    • Tastenkombination: Drücken Sie STRG+UMSCHALT+A
    • Oder wechseln Sie im Projektmappen-Explorer zu Project > Neues Element hinzufügen...
  2. Im Dialogfeld "Neues Element hinzufügen":
    1. Wählen Sie "Klasse" aus der Liste aus.
    2. Benennen Sie Ihre Klassendatei: ShowMessageCommand.cs
    3. Klicke auf Hinzufügen.
  3. Ersetzen Sie den Standardklassencode durch:
using System.Runtime.InteropServices;

namespace <ExtensionName>;

internal sealed partial class ShowMessageCommand : InvokableCommand
{
    public override string Name => "Show message";
    public override IconInfo Icon => new("\uE8A7");

    public override CommandResult Invoke()
    {
        // 0x00001000 is MB_SYSTEMMODAL, which will display the message box on top of other windows.
        _ = MessageBox(0, "I came from the Command Palette", "What's up?", 0x00001000);
        return CommandResult.KeepOpen();
    }


    [DllImport("user32.dll", CharSet = CharSet.Unicode)]
    public static extern int MessageBox(IntPtr hWnd, string text, string caption, uint type);
}

Jetzt können wir diesen Befehl zur Liste der Befehle in der <ExtensionName>Page.cs Datei hinzufügen:

  1. Aktualisieren Sie in der <ExtensionName>.cs die GetItems:
public override IListItem[] GetItems()
{
    var command = new OpenUrlCommand("https://learn.microsoft.com/windows/powertoys/command-palette/creating-an-extension");
    var showMessageCommand = new ShowMessageCommand();
    return [
        new ListItem(command)
        {
            Title = "Open the Command Palette documentation",
        },
        new ListItem(showMessageCommand),
    ];
}
  1. Stellen Sie Ihre Erweiterung bereit
  2. In der Befehlspalette, Reload

Und presto - ein Befehl zum Anzeigen eines Meldungsfelds!

Tipp

Zu diesem Zeitpunkt möchten Sie wahrscheinlich ein Git-Repository / {andere Quellcodeverwaltungsmethode Ihrer Wahl} für Ihr Projekt initialisieren. Dadurch wird es einfacher, Änderungen nachzuverfolgen und Ihre Erweiterung für andere Personen freizugeben.

Wir empfehlen, GitHub zu verwenden, da es einfach ist, mit anderen an Ihrer Erweiterung zusammenzuarbeiten, Feedback zu erhalten und mit der Welt zu teilen.

Seitentypen

Bisher haben wir nur mit Befehlen gearbeitet, die "etwas tun". Sie können jedoch auch Befehle hinzufügen, die zusätzliche Seiten in der Befehlspalette anzeigen. Es gibt zwei Arten von "Befehlen" in der Palette:

  • InvokableCommand - Dies sind Befehle, die etwas tun
  • IPage - Dies sind Befehle, die etwas anzeigen

Da IPage Implementierungen ICommands sind, können Sie sie überall verwenden, wo Sie Befehle verwenden können. Dies bedeutet, dass Sie sie der Liste der Befehle auf oberster Ebene oder einer Liste von Befehlen auf einer Seite, dem Kontextmenü eines Elements usw. hinzufügen können.

Es gibt zwei verschiedene Arten von Seiten, die Sie anzeigen können:

  • ListPage – Dies ist eine Seite, auf der eine Liste von Befehlen angezeigt wird. Dies ist das, was wir bisher bearbeitet haben.

Screenshot von ListPage

  • ContentPage – Dies ist eine Seite, auf der dem Benutzer umfangreiche Inhalte angezeigt werden. Auf diese Weise können Sie abstrakte Inhalte angeben und der Befehlspalette das Rendern des Inhalts in einer nativen Benutzererfahrung überlassen. Bisher werden zwei verschiedene Arten von Inhalten unterstützt:
    • Markdown-Inhalt – Dies ist Inhalt, der in Markdown geschrieben wurde und in der Befehlspalette gerendert wird. Details finden Sie unter MarkdownContent .

Screenshot der Erweiterung mit ContentPage

  • Formularinhalt – Dies ist Inhalt, der dem Benutzer ein Formular anzeigt, und gibt dann die Ergebnisse dieses Formulars an die Erweiterung zurück. Diese werden von Adaptive Karten Unterstützt. Dies ist nützlich, um Benutzereingaben zu erhalten oder komplexere Layouts von Informationen anzuzeigen. Details finden Sie unter FormContent .

Screenshot des Formularinhalts

Hinzufügen weiterer Befehle

Fügen Sie zunächst eine neue Seite hinzu, auf der eine Liste von Befehlen angezeigt wird. Erstellen Sie eine neue Klasse, die ListPage implementiert.

  1. Erstellen Sie im Pages Ordner eine neue Klasse namens MySecondPage
  2. Aktualisieren Sie den Code auf:
using Microsoft.CommandPalette.Extensions.Toolkit;
using System.Linq;

namespace <ExtensionName>;

internal sealed partial class MySecondPage : ListPage
{
    public MySecondPage()
    {
        Icon = new("\uF147"); // Dial2
        Title = "My second page";
        Name = "Open";
    }

    public override IListItem[] GetItems()
    {
        // Return 100 CopyText commands
        return Enumerable
            .Range(0, 100)
            .Select(i => new ListItem(new CopyTextCommand($"{i}")) 
            {
                Title = $"Copy text {i}" 
            }).ToArray();
    }
}

1. Aktualisieren Sie <ExtensionName>Page.cs, um diese neue Seite einzuschließen.

    public override IListItem[] GetItems()
    {
        OpenUrlCommand command = new("https://learn.microsoft.com/windows/powertoys/command-palette/creating-an-extension");
        return [
            new ListItem(command)
            {
                Title = "Open the Command Palette documentation",
            },
            new ListItem(new ShowMessageCommand()),
+           new ListItem(new MySecondPage()) { Title = "My second page", Subtitle = "A second page of commands" },
        ];
    }
  1. Stellen Sie Ihre Erweiterung bereit
  2. In der Befehlspalette, Reload

Nun sollten Sie eine neue Seite in Ihrer Erweiterung sehen, die 100 Befehle anzeigt, durch die eine Zahl in die Zwischenablage kopiert wird.

Als Nächstes: Aktualisieren einer Liste von Befehlen