Freigeben über

Erstellen Ihrer ersten WinUI 3-App

In dieser Lernprogrammreihe wird veranschaulicht, wie Sie eine WinUI-App mit XAML und C# erstellen. Die App, die Sie erstellen, ist eine Notiz-App, in der der Benutzer mehrere Notizen erstellen, speichern und laden kann. Sie können den Code für dieses Lernprogramm aus dem Repository GitHub herunterladen oder anzeigen.

In diesem Tutorial lernen Sie Folgendes:

  • Verwenden Sie XAML-Markup, um die Benutzeroberfläche der App zu definieren.
  • Interagieren Sie mit XAML-Elementen über C#-Code.
  • Speichern und laden Sie Dateien aus dem lokalen Dateisystem.
  • Erstellen Sie Ansichten und binden Sie sie an Daten.
  • Verwenden Sie die Navigation, um zu und von Seiten in der App zu wechseln.
  • Verwenden Sie Ressourcen wie Dokumentation und Beispiel-Apps, um Ihre eigene App zu erstellen.

Sie verwenden Visual Studio 2022, um eine App zu erstellen, mit der Sie eine Notiz eingeben und in der lokalen App-storage speichern können. Hier finden Sie den Quellcode für diese App. Die App verfügt über zwei Seiten:

  • NotePage - eine Seite zum Bearbeiten einer einzelnen Notiz.
  • AllNotesPage – eine Seite, auf der alle gespeicherten Notizen angezeigt werden.

Die fertige Anwendung wird unten gezeigt:

AllNotesPage

Letzter Screenshot der Notizen-App mit drei Speichern von Notizen.

NotePage

Letzter Screenshot der Notizen-App mit einer neuen leeren Notiz.

Erstellen eines Visual Studio-Projekts

Um mit diesem Lernprogramm zu beginnen, müssen Sie ein WinUI-App-Projekt in Visual Studio erstellen, indem Sie die C#-Projektvorlage Blank App, Packaged (WinUI in Desktop) verwenden. Verwenden Sie beim Erstellen des project die folgenden Einstellungen:

  • Project Name

    Dieser muss auf WinUINotes festgelegt werden. Wenn das Projekt einen anderen Namen hat, kann der Code, den Sie aus dieser Anleitung kopieren und einfügen, zu Buildfehlern führen. Dies liegt daran, dass Visual Studio den Projektnamen als Standardnamespace namespace für Ihren App-Code verwendet.

  • Windows App SDK

    In diesem Lernprogramm werden Features verwendet, die in Windows App SDK 1.7 neu sind. Sie müssen sicherstellen, dass das Windows App SDK NuGet-Paket auf Version 1.7 oder höher aktualisiert wird.

Von Bedeutung

Wenn Sie zuvor noch keine WinUI-project erstellt haben, führen Sie die Schritte in Start developing Windows apps aus, um sicherzustellen, dass Ihre Entwicklungsumgebung und Visual Studio project ordnungsgemäß eingerichtet sind.

Wenn Sie Ihr leeres App-Projekt öffnen (wie in Start developing Windows apps), sollten Sie ein leeres Fenster sehen, das so aussieht:

Das Notizen-App-Fenster mit einer Titelleiste und einem leeren Inhaltsbereich.

Tipp

Sie verweisen häufig auf API-Referenzdokumente und konzeptionelle Dokumente beim Erstellen von Windows-Apps. In diesem Tutorial werden Links inline im Text und in Gruppen mit der Bezeichnung "Weitere Informationen in der Dokumentation:" angezeigt. Diese Links sind optional; Sie müssen sie nicht befolgen, um das Lernprogramm abzuschließen. Sie werden für den Fall bereitgestellt, dass Sie notieren möchten, wo Sie die Informationen finden, die Sie benötigen, wenn Sie mit der Erstellung Ihrer eigenen Apps beginnen.

Fahre fort mit Schritt 1 – Projekteinrichtung

  • Last updated on