Creare la prima app

In questa esercitazione si apprenderà come creare ed eseguire la prima app .NET Multipiattaforma App UI (.NET MAUI) in Visual Studio 2022 in Windows o Visual Studio 2022 per Mac. Ciò consentirà di garantire che l'ambiente di sviluppo sia configurato correttamente.

Visual Studio

Prerequisiti

• Visual Studio 2022 17.8 o versione successiva, con il carico di lavoro app multipiattaforma .NET installato. Per altre informazioni, vedere Installazione.

Crea un'app

In questa esercitazione si creerà la prima app MAUI .NET in Visual Studio 2022 ed eseguirla in un emulatore Android:

Lo sviluppo di app MAUI .NET per iOS in Windows richiede un host di compilazione Mac. Se non è necessario specificare come destinazione iOS e non si ha un Mac, è consigliabile iniziare a usare Android o Windows.

In questa esercitazione si creerà la prima app MAUI .NET in Visual Studio ed eseguirla in un simulatore iOS:

In questa esercitazione si creerà la prima app MAUI .NET in Visual Studio 2022 ed eseguirla in Windows:

1. Avviare Visual Studio 2022. Nella finestra iniziale fare clic su Crea un nuovo progetto per creare un nuovo progetto:

   

2. Nella finestra Crea un nuovo progetto selezionare MAUI nell'elenco a discesa Tutti i tipi di progetto, selezionare il modello App MAUI .NET e fare clic sul pulsante Avanti:

   

3. Nella finestra Configura il nuovo progetto assegnare un nome al progetto, scegliere un percorso appropriato e fare clic sul pulsante Avanti:

   

4. Nella finestra Informazioni aggiuntive scegliere la versione di .NET di destinazione e fare clic sul pulsante Crea:

   

5. Attendere che il progetto venga creato e che vengano ripristinate le relative dipendenze:

   

6. Nella barra degli strumenti di Visual Studio usare l'elenco a discesa Destinazione di debug per selezionare Emulatori Android e quindi la voce Emulator Android :

   

7. Nella barra degli strumenti di Visual Studio premere il pulsante Emulatore Android:

   

   Visual Studio inizierà a installare l'SDK Android predefinito e l'emulatore Android.

8. Nella finestra Android SDK - Contratto di licenza premere il pulsante Accetta:

   

9. Nella finestra Android SDK - Contratto di licenza premere il pulsante Accetta:

   

10. Nella finestra di dialogo Controllo account utente premere il pulsante Sì:

    

11. Nella finestra Accettazione della licenza premere il pulsante Accetta:

    

    Attendere che Visual Studio scarichi Android SDK e Android Emulator.

12. Nella barra degli strumenti di Visual Studio premere il pulsante Emulatore Android:

    

    Visual Studio inizierà a creare un emulatore Android predefinito.

13. Nella finestra di dialogo Controllo account utente premere il pulsante Sì:

    

14. Nella finestra Nuovo dispositivo premere il pulsante Crea:

    

    Attendere che Visual Studio scarichi, decomprima e crei un emulatore Android.

15. Chiudere la finestra Gestione dispositivi Android:

    

16. Nella barra degli strumenti di Visual Studio premere il pulsante Pixel 5 - API 34 (Android 14.0 - API 33) per compilare ed eseguire l'app:

    

    Visual Studio avvierà l'emulatore Android, compilerà l'app e distribuirà l'app nell'emulatore.

    Avviso

    L'accelerazione hardware deve essere abilitata per ottimizzare le prestazioni dell'emulatore Android. In caso contrario, l'emulatore verrà eseguito molto lentamente. Per altre informazioni, vedere Come abilitare l'accelerazione hardware con emulatori Android (Hyper-V e AEHD).

17. Nell'app in esecuzione nell'emulatore Android premere più volte il pulsante Fai clic su di me e osservare che il numero di clic sul pulsante viene incrementato.

    

Risoluzione dei problemi

Se la compilazione dell'app non riesce, vedere Risoluzione dei problemi noti che potrebbero avere una soluzione al problema. Se il problema è correlato all'emulatore Android, vedere Risoluzione dei problemi dell'emulatore Android.

6. Nella barra degli strumenti di Visual Studio usare l'elenco a discesa Destinazione di debug per selezionare Framework e quindi la voce net8.0-windows :

   

7. Nella barra degli strumenti di Visual Studio premere il pulsante Computer Windows per compilare ed eseguire l'app:

   

   Se non è stata abilitata la modalità sviluppatore, Visual Studio chiederà di abilitarlo. Nella finestra di dialogo Abilita modalità sviluppatore per Windows fare clic su Impostazioni per gli sviluppatori per aprire l'app Impostazioni:

   

   Nell'app Impostazioni attivare la modalità sviluppatore e accettare la dichiarazione di non responsabilità:

   

   Chiudere l'app Impostazioni e quindi chiudere la finestra di dialogo Abilita modalità sviluppatore per Windows.

8. Nell'app in esecuzione premere più volte il pulsante Fai clic su di me e osservare che il numero di clic del pulsante viene incrementato:

   

Risoluzione dei problemi

Se la compilazione dell'app non riesce, vedere Risoluzione dei problemi noti che potrebbero avere una soluzione al problema.

6. In Visual Studio associare l'IDE a un host di compilazione Mac. Per altre informazioni, vedere Associare a Mac per lo sviluppo iOS.

7. Nella barra degli strumenti di Visual Studio usare l'elenco a discesa Destinazione di debug per selezionare simulatori iOS e quindi un simulatore iOS specifico:

   

8. Nella barra degli strumenti di Visual Studio premere il pulsante Start per il simulatore iOS scelto per compilare ed eseguire l'app:

   

   Visual Studio compilerà l'app, avvierà il simulatore iOS remoto per Windows e distribuirà l'app nel simulatore remoto. Per altre informazioni sul simulatore iOS remoto per Windows, vedere Simulatore iOS remoto per Windows.

9. Nell'app in esecuzione premere più volte il pulsante Fai clic su di me e osservare che il numero di clic del pulsante viene incrementato.

   

Risoluzione dei problemi

Se la compilazione dell'app non riesce, vedere Risoluzione dei problemi noti che potrebbero avere una soluzione al problema.

Le app MAUI .NET destinate a Mac Catalyst possono essere avviate e sottoposto a debug solo con Visual Studio 2022 per Mac.

Visual Studio per Mac

Nota

Visual Studio per Mac è prevista la pensione entro il 31 agosto 2024 in conformità con Criteri moderni relativi al ciclo di vita di Microsoft. Visual Studio per Mac 17.6 continuerà a essere supportato fino al 31 agosto 2024, con aggiornamenti di manutenzione per problemi di sicurezza e piattaforme aggiornate da Apple. Per altre informazioni, incluse le opzioni alternative per lo sviluppo in un Mac, vedere What's happening to Visual Studio per Mac?.

Prerequisiti

• Visual Studio 2022 per Mac 17.6 con i carichi di lavoro .NET, .NET MAUI, Android e iOS installati. Per altre informazioni, vedere Installazione.

Importante

Per usare Visual Studio per Mac con .NET 8, abilitare la casella di controllo Preferenze > di Visual Studio > Altre > funzionalità > di anteprima Usare .NET 8 SDK se installato (richiede il riavvio).

Crea un'app

In questa esercitazione si creerà la prima app MAUI .NET in Visual Studio 2022 per Mac ed eseguirla nella piattaforma scelta:

1. Avviare Visual Studio 2022 per Mac. Nella finestra iniziale fare clic su Nuovo per creare un nuovo progetto:

   

2. Nella finestra Scegliere un modello per il nuovo progetto selezionare Multipiattaforma > App, selezionare il modello App MAUI .NET e fare clic sul pulsante Continua:

   

3. Nella finestra Configura la nuova app MAUI .NET scegliere la versione di .NET di destinazione e fare clic sul pulsante Continua:

   

4. Nella finestra Configura la nuova app MAUI .NET immettere MyMauiApp come nome del progetto, selezionare un percorso appropriato per il progetto e fare clic sul pulsante Crea:

   

5. Attendere che il progetto venga creato e che vengano ripristinate le relative dipendenze:

   

6. Visual Studio 2022 per Mac visualizzerà una barra delle informazioni se il Mac non dispone dei componenti android SDK. Fare clic sul pulsante Installa per installare Android SDK:

   

7. Nella finestra Android SDK selezionare la casella di controllo Download and install Android dependencies automatically (Scarica e installa dipendenze Android automaticamente) e fare clic sul pulsante Download and Install (Scarica e installa):

   

8. Nella finestra Accettazione della licenza fare clic sul pulsante Accetta:

   

   Attendere che Visual Studio 2022 per Mac scarichi Android SDK:

9. Nella barra degli strumenti di Visual Studio 2022 per Mac modificare la destinazione di debug in Emulatore Android:

   

10. Nella barra degli strumenti di Visual Studio 2022 per Mac premere il pulsante Riproduci per compilare l'app e tentare di avviarla:

    

    Visual Studio 2022 per Mac compilerà l'app e quindi creerà un emulatore Android predefinito.

11. Nella finestra Nuovo dispositivo fare clic sul pulsante Crea :

    

12. Nella finestra Accettazione della licenza fare clic sul pulsante Accetta:

    

    Attendere che Visual Studio 2022 per Mac scarichi e installi un emulatore Android.

13. Chiudere la finestra Gestione dispositivi Android:

    

14. Nella barra degli strumenti di Visual Studio 2022 per Mac modificare la destinazione di debug in Pixel 5 - API 34 (API 34):In the Visual Studio 2022 for Mac toolbar, change the debug target to Pixel 5 - API 34 (API 34):

    

15. Nella barra degli strumenti di Visual Studio 2022 per Mac premere il pulsante Riproduci per avviare l'app nell'emulatore Android:

    

    Visual Studio 2022 per Mac avvierà l'emulatore Android, compilerà l'app e distribuirà l'app nell'emulatore.

16. Nell'app in esecuzione nell'emulatore Android premere più volte il pulsante Fai clic su di me e osservare che il numero di clic dei pulsanti viene incrementato:

    

6. Nella barra degli strumenti di Visual Studio 2022 per Mac assicurarsi che la destinazione di debug sia impostata su un simulatore iOS:

   

7. Nella barra degli strumenti di Visual Studio 2022 per Mac premere il pulsante Riproduci per avviare l'app nel simulatore iOS scelto:

   

   Visual Studio 2022 per Mac avvierà il simulatore iOS, compilerà l'app e distribuirà l'app nel simulatore.

8. Nell'app in esecuzione premere più volte il pulsante Fai clic su di me e osservare che il numero di clic dei pulsanti viene incrementato:

   

6. Nella barra degli strumenti di Visual Studio 2022 per Mac verificare che la destinazione di debug sia impostata su My Mac (MacCatalyst):In the Visual Studio 2022 for Mac toolbar, ensure that the debug target is set to My Mac (MacCatalyst):

   

7. In Visual Studio 2022 per Mac fare clic con il pulsante destro del mouse sul progetto MyMauiApp e scegliere Modifica file di progetto. Quindi, nell'editor di file di progetto inserire il codice XML seguente prima del primo <ItemGroup>:

   <PropertyGroup Condition="'$(Configuration)|$(TargetFramework)|$(Platform)'=='Debug|net8.0-maccatalyst|AnyCPU'">
       <RuntimeIdentifiers>maccatalyst-x64;maccatalyst-arm64</RuntimeIdentifiers>
   </PropertyGroup>
   

8. Nella barra degli strumenti di Visual Studio 2022 per Mac premere il pulsante Riproduci per avviare l'app nel Mac:

   

   Visual Studio 2022 per Mac compilerà e distribuirà l'app.

9. Nell'app in esecuzione premere più volte il pulsante Fai clic su di me e osservare che il numero di clic dei pulsanti viene incrementato:

   

Le app MAUI .NET destinate a Windows possono essere avviate e sottoposto a debug solo con Visual Studio 2022.

Visual Studio Code (anteprima)

Nota

Il supporto di MAUI .NET in Visual Studio Code è ancora in anteprima. Provalo e condividi i tuoi commenti e suggerimenti.

Installare l'estensione

Seguire le istruzioni per configurare l'estensione MAUI .NET per Visual Studio Code.

Creazione dell'app

Per creare una nuova app MAUI .NET:

1. Fare clic su Crea progetto .NET in Esplora risorse oppureCTRL/CMD+SHIFT+P> su .NET: Nuovo progetto....
2. Selezionare .NET MAUI App o .NET MAUI Blazor App.
3. Selezionare una cartella vuota . Se Esplora file viene aperto di nuovo, la cartella non è vuota.
4. Assegna un nome al progetto.
5. Assicurarsi che il progetto venga caricato correttamente nella Esplora soluzioni e quindi aprire un file C# o XAML.

È anche possibile aprire un progetto .NET MAUI esistente in Visual Studio Code tramite File > Open....

L'app dovrebbe ora essere visualizzata nelle Esplora soluzioni di C# Dev Kit in Visual Studio Code. Poiché l'estensione .NET MAUI dipende da C# Dev Kit, è possibile usare tutte le funzionalità insieme all'estensione MAUI .NET.

Scegliere il dispositivo di destinazione

Fare clic sul simbolo { } parentesi graffe nell'angolo inferiore destro di Visual Studio Code. In questo caso, è possibile modificare il progetto di avvio, impostare Destinazione di debug su qualsiasi valore valido nel computer di sviluppo e aggiungere una delle impostazioni alla barra di stato di Visual Studio Code:

È anche possibile impostare il progetto di avvio e la destinazione di debug nel riquadro comandi usando CTRL/CMD+SHIFT+P e cercando ".NET MAUI".

Per impostazione predefinita, è possibile eseguire la distribuzione nel computer di sviluppo macOS o Windows locale. In macOS è anche possibile eseguire la distribuzione nei simulatori iOS.

Per usare gli emulatori Android, seguire questa procedura:

1. Passare al terminale a <YOUR_ANDROID_SDK_DIRECTORY>/cmdline-tools/latest/bin/.
2. Eseguire sdkmanager --install emulator e sdkmanager --install system-images;android-33;google_apis;x86_64 in Windows o ./sdkmanager --install emulator in ./sdkmanager --install system-images;android-33;google_apis;x86_64 macOS.
3. È quindi possibile creare un nuovo emulatore nella riga di comando con avdmanager di Android. Ad esempio, è possibile eseguire avdmanager create avd -n MyAndroidVirtualDevice-API33 -k "system-images;android-33;google_apis;x86_64" in Windows o ./avdmanager create avd -n MyAndroidVirtualDevice-API33 -k "system-images;android-33;google_apis;x86_64" in macOS.

È anche possibile eseguire il debug su dispositivi Android fisici.

Eseguire il debug dell'app

Per eseguire il debug dell'app, passare al menu Esegui e debug di Visual Studio Code e selezionare il pulsante "Esegui e debug". In alternativa, è possibile usare F5 per avviare una sessione di debug. Se Visual Studio Code richiede di selezionare un debugger, assicurarsi di selezionare ".NET MAUI".

Il debugger sceglierà automaticamente la destinazione di debug e il progetto di avvio impostati nel menu parentesi graffe { } . Se non è stato selezionato alcun elemento, verrà richiesto di scegliere una destinazione di debug.

Dopo l'avvio del debug dell'app, è possibile usare gli strumenti di debug predefiniti di Visual Studio Code per impostare punti di interruzione, eseguire passaggi nel codice e altro ancora.

Altre informazioni

Se si verificano problemi con l'estensione, è possibile seguire la procedura di risoluzione dei problemi, vedere i problemi noti o inviare commenti e suggerimenti.

Passaggi successivi

In questa esercitazione si è appreso come creare ed eseguire la prima app .NET Multi-platform App UI (.NET MAUI).

Per informazioni sui concetti fondamentali della creazione di un'app con .NET MAUI, vedere Creare un'app MAUI .NET. In alternativa, per un corso di formazione .NET MAUI completo, vedere Creare app per dispositivi mobili e desktop con .NET MAUI.