Erstellen Ihrer ersten App

ln diesem Tutorial erfahren Sie, wie Sie Ihre erste .NET Multi-Platform App UI (.NET MAUI)-App in Visual Studio 2022 unter Windows oder Visual Studio Code unter Windows, macOS oder Linux erstellen und ausführen. So können Sie sicherstellen, dass Ihre Entwicklungsumgebung korrekt eingerichtet ist.

Visual Studio

Voraussetzungen

• Visual Studio 2022 17.12 oder höher, wobei die .NET Multi-Platform App UI-Workload installiert ist. Weitere Informationen finden Sie unter Installation.

Erstellen einer App

In diesem Tutorial erstellen Sie Ihre erste .NET MAUI-App in Visual Studio 2022 und führen sie auf einem Android-Emulator aus:

Die Entwicklung von .NET MAUI-Apps für iOS unter Windows erfordert einen Mac-Build-Host. Wenn Sie nicht speziell auf iOS abzielen müssen und keinen Mac haben, können Sie stattdessen auch mit Android oder Windows beginnen.

In diesem Tutorial erstellen Sie Ihre erste .NET MAUI-App in Visual Studio und führen sie auf einem iOS-Simulator aus:

In diesem Tutorial erstellen Sie Ihre erste .NET MAUI-App in Visual Studio 2022 und führen sie unter Windows aus:

1. Starten Sie Visual Studio 2022. Klicken Sie im Startfenster auf Ein neues Projekt erstellen, um ein neues Projekt zu erstellen:

   

2. Wählen Sie im Fenster Ein neues Projekt erstellen die Option MAUI in der Dropdown-Liste Alle Projekttypen aus, wählen Sie die Vorlage .NET MAUI App aus, und klicken Sie auf die Schaltfläche Weiter:

   

3. Im Fenster Ihr neues Projekt konfigurieren benennen Sie Ihr Projekt, wählen Sie einen geeigneten Speicherort dafür aus und klicken Sie auf die Schaltfläche Weiter:

   

4. Wählen Sie im Fenster Zusätzliche Informationen die Version von .NET aus, auf die Sie abzielen möchten, und klicken Sie auf die Schaltfläche Erstellen:

   

5. Warten Sie, bis das Projekt erstellt und seine Abhängigkeiten wiederhergestellt sind:

   

6. Verwenden Sie in der Visual Studio-Symbolleiste das Dropdown-Menü Debug-Ziel, um Android-Emulatoren und dann den Eintrag Android-Emulator auszuwählen:

   

7. Drücken Sie in der Visual Studio-Symbolleiste auf die Schaltfläche Android-Emulator:

   

   Visual Studio startet den Prozess der Installation des Standardmäßigen Android SDK und des Android-Emulators.

8. Drücken Sie im Fenster Android SDK – Lizenzvereinbarung die Schaltfläche Akzeptieren:

   

9. Drücken Sie im Dialog Benutzerkontensteuerung auf die Schaltfläche Ja:

   

   Warten Sie, bis Visual Studio das standardmäßige Android SDK und den Android-Emulator herunterladen kann.

10. Drücken Sie im Dialog Benutzerkontensteuerung auf die Schaltfläche Ja:

    

11. Drücken Sie im Dialogfeld "Android SDK Platform" dieSchaltfläche "Installieren ":

    

12. Drücken Sie im Fenster Android SDK – Lizenzvereinbarung die Schaltfläche Akzeptieren:

    

    Warten Sie, bis Visual Studio die Android SDK-Komponenten installiert.

13. Drücken Sie im Fenster Neues Gerät auf die Schaltfläche Erstellen:

    

    Warten Sie, bis Visual Studio heruntergeladen, entpackt und ein Android-Emulator erstellt wurde.

14. Schließen Sie das Fenster Android Geräte-Manager:

    

15. Drücken Sie in der Visual Studio-Symbolleiste die Schaltfläche Pixel 7 – API 35 (Android 15.0 – API 35):

    

16. Drücken Sie im Fenster Android SDK – Lizenzvereinbarung die Schaltfläche Akzeptieren:

    

17. Drücken Sie im Dialog Benutzerkontensteuerung auf die Schaltfläche Ja:

    

    Warten Sie, bis Visual Studio installiert wurde, um das Android SDK herunterzuladen.

18. Drücken Sie auf der Visual Studio-Symbolleiste die Schaltfläche Pixel 7 – API 35 (Android 15.0 – API 35), um die App zu erstellen und auszuführen:

    

    Visual Studio startet den Android-Emulator, erstellt die App und stellt sie auf dem Emulator bereit.

    Warnung

    Um die Leistung des Android-Emulators zu maximieren, muss die Hardware-Beschleunigung aktiviert sein. Andernfalls wird der Emulator sehr langsam laufen. Weitere Informationen finden Sie unter Aktivieren der Hardwarebeschleunigung mit Android-Emulatoren (Hyper-V und AEHD).

19. Drücken Sie in der laufenden App im Android-Emulator mehrmals die Schaltfläche Klick mich und beobachten Sie, dass die Anzahl der Schaltflächenklicks hochgezählt wird.

    

Problembehandlung

Wenn Ihre App nicht kompiliert werden kann, lesen Sie Fehlerbehebung bei bekannten Problemen, die möglicherweise eine Lösung für Ihr Problem enthält. Wenn das Problem mit dem Android-Emulator zusammenhängt, siehe Fehlerbehebung im Android-Emulator.

6. Drücken Sie in der Visual Studio-Symbolleiste die Schaltfläche Windows Machine, um die App zu erstellen und auszuführen:

   

7. Drücken Sie in der laufenden App mehrmals die Schaltfläche Klick mich und beobachten Sie, dass die Anzahl der Schaltflächenklicks hochgezählt wird:

   

Problembehandlung

Wenn Ihre App nicht kompiliert werden kann, lesen Sie Fehlerbehebung bei bekannten Problemen, die möglicherweise eine Lösung für Ihr Problem enthält.

6. Koppeln Sie in Visual Studio die IDE mit einem Mac Build-Host. Weitere Informationen finden Sie unter Pair to Mac für die iOS-Entwicklung.

7. Verwenden Sie in der Visual Studio-Symbolleiste die Dropdown-Liste Debug-Ziel, um iOS-Simulatoren und anschließend einen bestimmten iOS-Simulator auszuwählen:

   

8. Drücken Sie in der Visual Studio-Symbolleiste auf die Schaltfläche Start für den gewählten iOS-Simulator, um Ihre App zu erstellen und auszuführen:

   

   Visual Studio erstellt die App, startet den entfernten iOS-Simulator für Windows und stellt die App auf dem entfernten Simulator bereit. Weitere Informationen über den iOS-Fernsimulator für Windows finden Sie unter Remote iOS Simulator für Windows.

9. Drücken Sie in der laufenden App mehrmals auf die Schaltfläche Klick mich und beobachten Sie, dass die Anzahl der Schaltflächenklicks hochgezählt wird.

   

Problembehandlung

Wenn Ihre App nicht kompiliert werden kann, lesen Sie Fehlerbehebung bei bekannten Problemen, die möglicherweise eine Lösung für Ihr Problem enthält.

.NET MAUI-Apps, die auf Mac Catalyst abzielen, können nur mit Visual Studio Code gestartet und gedebuggt werden.

Visual Studio Code

Voraussetzungen

• Visual Studio Code, wobei die .NET MAUI-Erweiterung installiert und konfiguriert ist:
  • Ihr Microsoft-Konto, das mit C# Dev Kit verbunden ist.
  • Das .NET SDK wurde installiert.
  • Das .NET MAUI SDK wurde installiert.
  • Xcode auf Ihrem Mac installiert, einschließlich Simulator-Laufzeiten und der Xcode-Befehlszeilentools, wenn Sie auf Apple-Plattformen abzielen.
  • Microsoft OpenJDK, das Android SDK und ein Android-Emulator, der auf Ihrem Computer installiert ist, wenn Android als Ziel verwendet wird.

Weitere Informationen finden Sie unter Installation.

Erstellen einer App

In diesem Lernprogramm erstellen Sie Ihre erste .NET MAUI-App in Visual Studio Code und führen sie auf einem Android-Emulator aus:

In diesem Lernprogramm erstellen Sie Ihre erste .NET MAUI-App in Visual Studio Code auf einem Mac und führen sie auf einem iOS-Simulator aus:

In diesem Lernprogramm erstellen Sie Ihre erste .NET MAUI-App in Visual Studio Code auf einem Mac und führen sie unter macOS aus:

In diesem Lernprogramm erstellen Sie Ihre erste .NET MAUI-App in Visual Studio Code unter Windows und führen sie unter Windows aus:

1. Starten Sie Visual Studio Code. Drücken Sie im Explorerauf .NET-Projekt erstellen.

   

   Alternativ können Sie STRG+UMSCHALT+P unter Windows drücken, oder CMD+UMSCHALT+P unter macOS und dann den Befehl .NET: Neues Projekt....

2. Wählen Sie in der Befehlspalette die Vorlage .NET MAUI App aus.

   

3. Wählen Sie im Dialogfeld Projektspeicherort den Speicherort aus, an dem das neue Projekt erstellt werden soll.

   Wichtig

   Projekte müssen in einem leeren Ordner erstellt werden.

4. Geben Sie in der Befehlspalette einen Namen für Ihr neues Projekt ein, und drücken Sie EINGABETASTE:

   

5. Drücken Sie in der Befehlspalette Projekt erstellen:

   

   Warten Sie, bis das Projekt erstellt wurde, und akzeptieren Sie den Ordner bei Bedarf als vertrauenswürdigen Speicherort.

6. Erweitern Sie im Explorerden Stammknoten Ihres Projekts, und öffnen Sie dann eine C#-Datei wie MainPage.xaml.cs:

   

7. Stellen Sie in Visual Studio Code sicher, dass Ihre Android-Umgebung ordnungsgemäß konfiguriert ist, indem Sie STRG+UMSCHALT+P unter Windows drücken, oder CMD+UMSCHALT+P unter macOS, und wählen Sie dann .NET MAUI: Konfigurieren von Androidgefolgt von Aktualisieren der Android-Umgebung. Alle erkannten Fehler müssen behoben werden.

8. Drücken Sie in der Statusleiste unten in Visual Studio Code das Klammersymbol { }, und stellen Sie sicher, dass die Debugziel- auf einen bestimmten Android-Emulator festgelegt ist:

   

   Sie können das Debugziel auch festlegen, indem Sie STRG+UMSCHALT+P- unter Windows oder CMD+UMSCHALT+P- unter macOS drücken und .NET MAUI auswählen: Wählen Sie android Device aus der Befehlspalette aus.

9. Erstellen Sie die App auf Android, und führen Sie sie aus, indem Sie F5- drücken oder die Schaltfläche Ausführen in der oberen rechten Ecke von Visual Studio Code drücken:

   

   Wenn Sie aufgefordert werden, einen Debugger in der Befehlspalette auszuwählen, wählen Sie C#- und dann die Startkonfiguration für Ihr Projekt aus.

10. Drücken Sie in der laufenden App in Ihrem ausgewählten Android-Emulator mehrmals die Schaltfläche Click me und beobachten Sie, wie sich die Anzahl der Klicks erhöht.

    

Debuggen der App auf einem Android-Gerät

So debuggen Sie die App auf einem Android-Gerät:

1. Stellen Sie sicher, dass Ihr Gerät für die Bereitstellung eingerichtet ist. Weitere Informationen finden Sie unter Einrichten eines Geräts für die Bereitstellung.
2. Schließen Sie Ihr Gerät an Ihren Computer an, und wählen Sie es als Debugziel in Visual Studio Code aus.
3. Führen Sie die App aus.

7. Überprüfen Sie in Visual Studio Code, ob Ihre Apple-Umgebung ordnungsgemäß konfiguriert ist, indem Sie CMD+UMSCHALT+P drücken und dann .NET MAUI auswählen: Konfigurieren Sie Apple, gefolgt von Aktualisieren der Apple-Umgebung. Alle erkannten Fehler müssen behoben werden.

8. Drücken Sie in der Statusleiste unten in Visual Studio Code das Klammersymbol { }, und stellen Sie sicher, dass das Debug-Ziel auf einen bestimmten iOS-Simulator eingestellt ist.

   

   Sie können das Debugziel auch festlegen, indem Sie CMD+UMSCHALT+P drücken und .NET MAUI auswählen: Wählen Sie iOS Device aus der Befehlspalette aus.

9. Erstellen und führen Sie die App unter iOS aus, indem Sie F5 drücken oder auf die Schaltfläche Ausführen in der oberen rechten Ecke von Visual Studio Code klicken.

   

   Wenn Sie aufgefordert werden, einen Debugger in der Befehlspalette auszuwählen, wählen Sie C#- und dann die Startkonfiguration für Ihr Projekt aus.

10. Drücken Sie in der laufenden App in Ihrem ausgewählten iOS-Simulator mehrmals die -Schaltfläche 'Klicken Sie auf mich' und beobachten Sie, wie die Anzahl der Schaltflächenklicks zunimmt.

    

Debuggen der App auf einem iOS-Gerät

So debuggen Sie die App auf einem iOS-Gerät:

1. Stellen Sie sicher, dass Sie Ihre Apple-ID in Xcode unter Xcode > Einstellungen > Accountshinzugefügt haben.
2. Stellen Sie sicher, dass Ihr Gerät bei Ihrem Team registriert wurde, wenn Sie zum Apple Developer Program gehören.
3. Aktivieren Sie den Entwicklermodus auf Ihrem Gerät. Wenn Sie Ihre App zum ersten Mal ausführen, erhalten Sie möglicherweise ein Popup auf dem Gerät – stellen Sie sicher, dass Sie Zulassen auswählen. Weitere Informationen zum Entwicklermodus finden Sie unter Aktivieren des Entwicklermodus auf einem Gerät auf developer.apple.com.
4. Schließen Sie Ihr Gerät an Ihren Computer an, und wählen Sie es als Debugziel in Visual Studio Code aus.
5. Führen Sie die App aus.

7. Überprüfen Sie in Visual Studio Code, ob Ihre Apple-Umgebung ordnungsgemäß konfiguriert ist, indem Sie CMD+UMSCHALT+P drücken und dann .NET MAUI auswählen: Konfigurieren Sie Apple, gefolgt von Aktualisieren der Apple-Umgebung. Alle erkannten Fehler müssen behoben werden.

8. Drücken Sie in der Statusleiste unten in Visual Studio Code das Klammersymbol { }, und stellen Sie sicher, dass das Debug-Ziel für Ihren Mac festgelegt ist.

   

   Sie können das Debugziel auch festlegen, indem Sie CMD+UMSCHALT+P drücken und .NET MAUI auswählen: Wählen Sie macOS Device aus der Befehlspalette aus.

9. Erstellen Sie und führen Sie die App auf macOS aus, indem Sie F5 drücken oder die Schaltfläche 'Ausführen' in der oberen rechten Ecke von Visual Studio Code drücken.

   

   Wenn Sie aufgefordert werden, einen Debugger in der Befehlspalette auszuwählen, wählen Sie C#- und dann die Startkonfiguration für Ihr Projekt aus.

10. Drücken Sie in der laufenden App mehrmals die Schaltfläche Klick mich und beobachten Sie, dass die Anzahl der Schaltflächenklicks hochgezählt wird:

    

7. Drücken Sie in der Statusleiste unten in Visual Studio Code das Klammersymbol { }, und stellen Sie sicher, dass das Debugziel auf Windows eingestellt ist:

   

   Sie können das Debugziel auch festlegen, indem Sie STRG+UMSCHALT+P drücken und .NET MAUI auswählen: Wählen Sie windows Device aus der Befehlspalette aus.

8. Erstellen und ausführen Sie die App unter Windows, indem Sie F5- drücken oder die Schaltfläche Ausführen in der oberen rechten Ecke von Visual Studio Code drücken:

   

   Wenn Sie aufgefordert werden, einen Debugger in der Befehlspalette auszuwählen, wählen Sie C#- und dann die Startkonfiguration für Ihr Projekt aus.

9. Drücken Sie in der laufenden App mehrmals die Schaltfläche Klick mich und beobachten Sie, dass die Anzahl der Schaltflächenklicks hochgezählt wird:

   

Problembehandlung

Wenn Ihre App nicht erstellt und bereitgestellt werden kann, überprüfen Sie Fehlerbehebung bei bekannten Problemen, die möglicherweise eine Lösung für Ihr Problem bietet.

Nächste Schritte

In diesem Tutorial haben Sie gelernt, wie Sie Ihre erste .NET Multi-platform App UI (.NET MAUI) erstellen und ausführen können.

Um die Grundlagen der Erstellung einer App mit .NET MAUI zu erlernen, siehe Erstellen einer .NET MAUI-App. Alternativ dazu finden Sie einen vollständigen .NET MAUI-Schulungskurs unter Mobile- und Desktop-Apps mit .NET MAUI entwickeln.