Erstellen Ihrer ersten WinUI-App

Erstellen Sie Ihre erste WinUI-App, und sehen Sie, dass sie auf Windows zum Leben kommt. Diese Schnellstartanleitung führt Sie von der Einrichtung des Tools zu einer funktionsfähigen App und führt Sie dann durch die erste Aktualisierung der Benutzeroberfläche.

Bevor du anfängst

Was Sie lernen werden

  • Wählen Sie Ihre Entwicklungstools aus, und richten Sie sie ein.
  • Erstellen Sie eine WinUI-App, und führen Sie sie aus.
  • Aktualisieren Sie die Benutzeroberfläche, und sehen Sie ihre Änderung in der ausgeführten App.

Auswählen Ihrer Entwicklungstools

Befolgen Sie einen der empfohlenen Pfade in dieser Schnellstartanleitung:

  • winapp CLI: Arbeiten Sie in Ihrem bevorzugten Editor im Terminal. Dieser Befehlszeilenworkflow eignet sich auch gut für agentengestütztes Programmieren.
  • Visual Studio: Verwenden Sie eine integrierte Entwicklungs- und Debuggingumgebung.

Wenn Ihre Tools bereits installiert sind, rufen Sie Erstellen Ihrer ersten App auf.

Installieren der Tools

  1. Aktivieren Sie den Entwicklermodus. Sie können die Einstellungen über Entwicklereinstellungen öffnen.

  2. Installieren Sie das .NET 10 SDK und die Windows-App Development CLI. Wenn Sie WinGet verwenden, führen Sie Folgendes aus:

    winget install --id Microsoft.DotNet.SDK.10 --exact --source winget
winget install --id Microsoft.WinAppCLI --exact --source winget

    Überspringen Sie die Installation, wenn das erforderliche Werkzeug bereits installiert ist.

  3. Öffnen Sie ein neues Terminal, damit sie die installierten Befehle einnimmt, und überprüfen Sie dann die Versionen:

    dotnet --version
winapp --version

    Verwenden Sie für diesen Workflow das .NET SDK 10 oder höher und die winapp CLI 0.6 oder höher.

Note

winapp CLI befindet sich in der öffentlichen Vorschau. winapp newverwaltet die WinUI-Projektvorlagen, installiert jedoch nicht das .NET SDK. Lesen Sie die Ankündigung zu CLI 0.6 für die neuen Befehle „project“ und „run“.

Erstellen Sie Ihre erste App

Verwenden Sie den oben installierten Workflow, um das Projekt zu erstellen und zu starten.

Führen Sie in dem Ordner, in dem Sie Ihre Projekte speichern, Folgendes aus:

winapp new --name MyWinUIApp --template winui --use-defaults
cd MyWinUIApp
winapp run

winapp new erstellt die leere WinUI-App. winapp run kompiliert das Projekt und führt es aus; Sie benötigen keinen separaten Kompilierungs- oder Paketregistrierungsbefehl.

Ihre App öffnet ein Fenster auf dem Desktop. Fahren Sie unten mit Änderung vornehmen fort.

Änderung vornehmen

Behalten Sie das soeben erstellte Projekt bei. Fügen Sie der vorhandenen Schnittstelle eine Nachricht hinzu:

  1. Schließen Sie die laufende App. Öffnen Sie MainPage.xaml in Ihrem Editor. Wenn Ihre Vorlage diese Datei nicht enthält, öffnen Sie stattdessen MainWindow.xaml.

  2. Suchen Sie den Layoutbereich, der den Inhalt der App enthält. In der aktuellen leeren CLI-Vorlage enthält <Grid /> ein leeres MainPage.xaml. Ersetzen Sie dieses leere Raster durch Folgendes:

    <Grid>
    <TextBlock
        Text="Hello, WinUI!"
        HorizontalAlignment="Center"
        VerticalAlignment="Center" />
</Grid>

    Wenn das Panel bereits Steuerelemente enthält, fügen Sie nur das TextBlock in diesem Panel hinzu. Behalten Sie die vorhandenen Steuerelemente, Namen und Ereignishandler bei. Ersetzen Sie nicht die umgebende Page oder Windowdie Rahmen- und Titelleiste in MainWindow.xaml.

  3. Speichern Sie die Datei. Führen Sie den Vorgang erneut aus dem Projektordner aus, oder drücken Sie winapp runin Visual Studio F5.

Herzlichen Glückwunsch! Sie haben Ihre erste WinUI-App erstellt, ausgeführt und aktualisiert. Das Fenster zeigt jetzt Hello, WinUI!

Problembehandlung

Problem Was soll überprüft werden?
winapp oder dotnet wird nicht erkannt. Öffnen Sie das Terminal nach der Installation erneut. Verwenden Sie die Versionsbefehle auf der CLI-Registerkarte, um zu bestätigen, dass beide Tools verfügbar sind.
winapp new wird nicht erkannt. Für diesen Workflow ist winapp CLI 0.6 oder höher erforderlich. Aktualisieren Sie die CLI mithilfe der von Ihnen ausgewählten Installationsmethode.
WinUI-Vorlagen werden in Visual Studio nicht angezeigt. Öffnen Sie den Visual Studio Installer, wählen Sie "Ändern" aus, und vergewissern Sie sich, dass die WinUI-Anwendungsentwicklungsauslastung installiert ist. Starten Sie danach Visual Studio neu.
Der Build meldet einen SDK- oder Wiederherstellungsfehler. Überprüfen Sie die Voraussetzungen des ausgewählten Workflows und den ersten Fehler in der Build-Ausgabe. Verwenden Sie Windows App SDK Unterstützung, um die Versionsanforderungen zu überprüfen, bevor Sie Projekteigenschaften ändern.
Bereitstellungsberichte, dass der Entwicklermodus deaktiviert ist. Aktivieren Sie den Entwicklermodus, und führen Sie die App erneut aus.
Ihre neue Nachricht erscheint nicht. Speichern Sie die XAML-Datei und starten Sie das Projekt neu. Fügen Sie in Vorlagen mit einer MainPage.xaml, die Nachricht zu dieser Seite hinzu, anstatt den Hostingframe des Fensters zu ersetzen.

Nächste Schritte

Erstellen einer Notizen-App

Das Lernprogramm "Notizen" verwendet ein separates WinUINotes Projekt, um Seiten, Navigation, Datenbindung und lokalen Speicher zu unterrichten. Sie finden auch Beispiele für fokussierte Steuerelemente in "Ressourcen".

  • Zuletzt aktualisiert um