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" die Schaltflä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 mit installierter .NET MAUI Erweiterung. Weitere Informationen finden Sie unter Installation.

Erstellen einer App

So erstellen Sie eine neue .NET MAUI-App:

1. Starten Sie Visual Studio Code. Klicken Sie im Explorer auf .NET-Projekt erstellen im Explorer. Alternativ können Sie STRG/CMD+UMSCHALT+P .NET auswählen: Neues Projekt....
2. Wählen Sie .NET MAUI App oder .NET MAUI Blazor App aus.
3. Wählen Sie einen leeren Ordner aus. Wenn der Datei-Explorer erneut geöffnet wird, ist der Ordner nicht leer.
4. Projektname
5. Stellen Sie sicher, dass das Projekt im Projektmappen-Explorer erfolgreich geladen wird, und öffnen Sie dann eine C#- oder XAML-Datei.

Hinweis

Sie können auch ein vorhandenes .NET MAUI-Projekt in Visual Studio Code über das Menü Datei > öffnen... öffnen.

Sie sollten nun Ihre App im C# Dev Kit's Solution Explorer in Visual Studio Code sehen. Da die .NET MAUI-Erweiterung von C# Dev Kit abhängt, können Sie alle seine Funktionen zusammen mit der .NET MAUI-Erweiterung verwenden.

Wählen Sie Ihr Zielgerät aus

Um Ihr Zielgerät auszuwählen, klicken Sie in der unteren rechten Ecke von Visual Studio Code auf das geschweifte Klammernsymbol { }. Sie können dieses Symbol verwenden, um Ihr Startprojekt zu ändern, ihr Debugziel auf alles zu ändern, was auf Ihrem Entwicklungscomputer gültig ist, und eine der beiden Einstellungen an die Statusleiste von Visual Studio Code anheften:

Sie können auch das Startprojekt und das Debugziel in der Befehlspalette festlegen, indem Sie STRG/CMD+UMSCHALT+P verwenden und nach ".NET MAUI" suchen.

Sie können ohne zusätzliche Schritte auf Ihrem lokalen Entwicklungscomputer (Windows Desktop oder macOS mit Xcode) bereitstellen.

Android-Zielgeräte

Wenn Sie Android-Emulatoren verwenden möchten, führen Sie die folgenden Schritte aus, um einen Emulator zu installieren und zu erstellen:

1. Navigieren Sie in Ihrem Terminal zu <YOUR_ANDROID_SDK_DIRECTORY>/cmdline-tools/11.0/bin/.

2. Verwenden Sie sdkmanager, um den Emulator zu installieren.

   Führen Sie die folgenden Befehle unter Windows im Terminal aus:

   sdkmanager --install emulator
   sdkmanager --install "system-images;android-33;google_apis;x86_64"
   

   Führen Sie die folgenden Befehle unter macOS im Terminal aus:

   ./sdkmanager --install emulator
   ./sdkmanager --install "system-images;android-33;google_apis;x86_64"
   

   Hinweis

   Die Anführungszeichen um die sdkmanager-Befehlszeilenargumente sind wichtig.

3. Dann können Sie einen neuen Emulator auf der Kommandozeile mit dem avdmanager von Android erstellen.

   Führen Sie die folgenden Befehle unter Windows im Terminal aus:

   avdmanager create avd -n MyAndroidVirtualDevice-API33 -k "system-images;android-33;google_apis;x86_64"
   

   Führen Sie die folgenden Befehle unter macOS im Terminal aus:

   ./avdmanager create avd -n MyAndroidVirtualDevice-API33 -k "system-images;android-33;google_apis;x86_64"
   

   Hinweis

   Die Anführungszeichen um die avdmanager-Befehlszeilenargumente sind wichtig.

Sie können auch auf physischen Android-Geräten debuggen.

Ziel iOS

iOS-Simulatoren sind in Xcode integriert. Um die Simulatoren herunterzuladen, stellen Sie entweder sicher, dass die Option ausgewählt ist, sie beim ersten Start von Xcode zu installieren, oder navigieren Sie zu Xcode> Einstellungen >Plattformen, und wählen Sie eine Simulatorlaufzeit aus, die installiert werden soll.

Führen Sie die folgenden Schritte aus, um mit einem iOS-Gerät zu debuggen:

1. Geben Sie Ihre Apple-ID in Xcode> Einstellungen >Konto an.
2. Registrieren Sie das Gerät bei Ihrem Team, wenn Sie zum Apple Developer Program gehören.
3. Aktivieren Sie den Entwicklermodus auf Ihrem Gerät, wie unter Aktivieren des Entwicklermodus auf einem Gerät beschrieben. 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.

Debuggen der App

Um Ihre App zu debuggen, navigieren Sie zum Menü Ausführen und Debuggenvon Visual Studio Code, und wählen Sie die Schaltfläche Ausführen und Debuggen aus. Alternativ können Sie F5 verwenden, um eine Debugsitzung zu starten. Wenn Sie von Visual Studio Code aufgefordert werden, einen Debugger auszuwählen, stellen Sie sicher, dass Sie C# auswählen.

Hinweis

In Vorschauversionen der Erweiterung wurde der Debugger als .NET MAUI aufgeführt. In der stabilen Version wurde diese Konfiguration durch C# ersetzt.

Der Debugger wählt automatisch das Debugziel und das Startprojekt aus, das Sie in den geschweiften Klammern { } festgelegt haben. Wenn Sie nichts ausgewählt haben, werden Sie aufgefordert, ein Debugziel auszuwählen.

Sobald Ihre App mit dem Debugging beginnt, können Sie die integrierten Debugging-Tools von Visual Studio Code verwenden, um Haltepunkte zu setzen, Ihren Code zu durchsuchen und mehr.

Weitere Informationen

Wenn Sie Probleme mit der Erweiterung haben, können Sie die Schritte zur Problembehandlung ausführen, bekannte Probleme anzeigen oder Feedback geben.

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.