Condividi tramite


Creare un'app .NET MAUIBlazor Hybrid

Nota

Questa non è la versione più recente di questo articolo. Per la versione corrente, vedere la versione .NET 8 di questo articolo.

Avviso

Questa versione di ASP.NET Core non è più supportata. Per altre informazioni, vedere Criteri di supporto di .NET e .NET Core. Per la versione corrente, vedere la versione .NET 8 di questo articolo.

Importante

Queste informazioni si riferiscono a un prodotto non definitive che può essere modificato in modo sostanziale prima che venga rilasciato commercialmente. Microsoft non riconosce alcuna garanzia, espressa o implicita, in merito alle informazioni qui fornite.

Per la versione corrente, vedere la versione .NET 8 di questo articolo.

Questa esercitazione illustra come compilare ed eseguire un'app .NET MAUIBlazor Hybrid . Scopri come:

  • Creare un .NET MAUIBlazor Hybrid progetto di app in Visual Studio
  • Eseguire l'app in Windows
  • Eseguire l'app in un dispositivo mobile emulato nell'emulatore Android

Prerequisiti

Per altre informazioni sui prerequisiti e sull'installazione del software per questa esercitazione, vedere le risorse seguenti nella .NET MAUI documentazione:

Creare un'app .NET MAUIBlazor Hybrid

Avviare Visual Studio. Nella finestra iniziale selezionare Crea un nuovo progetto:

Nuova soluzione.

Nella finestra Crea un nuovo progetto usare l'elenco a discesa Tipo di progetto per filtrare i modelli MAUI:

Filtrare i modelli in .NET MAUI.

Selezionare il .NET MAUIBlazor Hybrid modello App e quindi selezionare il pulsante Avanti:

Scegliere un modello.

Nota

In .NET 7 o versioni precedenti il modello è denominato .NET MAUIBlazor App.

Nella finestra di dialogo Configura il nuovo progetto :

  • Impostare Il nome del progetto su MauiBlazor.
  • Scegliere una posizione adatta per il progetto.
  • Seleziona il pulsante Avanti.

Configurare il progetto.

Nella finestra di dialogo Informazioni aggiuntive selezionare la versione del framework con l'elenco a discesa Framework. Selezionare il pulsante Crea :

Finestra di dialogo informazioni aggiuntive per la selezione della versione del framework e la creazione del progetto.

Attendere che Visual Studio crei il progetto e ripristini le dipendenze del progetto. Monitorare lo stato di avanzamento in Esplora soluzioni aprendo la voce Dipendenze.

Ripristino delle dipendenze:

Ripristino delle dipendenze.

Dipendenze ripristinate:

Dipendenze ripristinate.

Eseguire l'app in Windows

Nella barra degli strumenti di Visual Studio selezionare il pulsante Computer Windows per compilare e avviare il progetto:

Pulsante Computer Windows.

Se la modalità sviluppatore non è abilitata, viene richiesto di abilitarla in Impostazioni>per sviluppatori modalità sviluppatore> (Windows 10) o Impostazioni>Privacy e sicurezza>per sviluppatori>modalità sviluppatore (Windows 11). Impostare l'opzione su .

L'app in esecuzione come app desktop di Windows:

App in esecuzione in Windows.

Eseguire l'app nell'emulatore Android

Se sono state seguite le indicazioni nella sezione Esegui l'app in Windows , selezionare il pulsante Arresta debug sulla barra degli strumenti per arrestare l'app di Windows in esecuzione:

Pulsante Arresta debug.

Nella barra degli strumenti di Visual Studio selezionare il pulsante a discesa Avvia configurazione. Selezionare Emulatori Android Emulatori> Android:

Selezione dell'elenco a discesa Emulatori Android per il pulsante Emulatore Android.

Gli SDK Android sono necessari per creare app per Android. Nel pannello Elenco errori viene visualizzato un messaggio che chiede di fare doppio clic sul messaggio per installare gli SDK Android necessari:

Elenco errori di Visual Studio con messaggio che chiede di fare clic sul messaggio per installare gli SDK Android.

Viene visualizzata la finestra Accettazione della licenza di Android SDK, selezionare il pulsante Accetta per ogni licenza visualizzata. Viene visualizzata una finestra aggiuntiva per le licenze dell'emulatore Android e dell'SDK Patch Applier. Selezionare il pulsante Accetta.

Attendere che Visual Studio scarichi Android SDK e Android Emulator. È possibile tenere traccia dello stato di avanzamento selezionando l'indicatore delle attività in background nell'angolo inferiore sinistro dell'interfaccia utente di Visual Studio:

Indicatore delle attività in background di Visual Studio.

L'indicatore mostra un segno di spunta al termine delle attività in background:

Indicatore delle attività in background di Visual Studio selezionato.

Nella barra degli strumenti selezionare il pulsante Emulatore Android:

Pulsante Emulatore Android.

Nella finestra Crea un dispositivo Android predefinito selezionare il pulsante Crea :

Creare una finestra Dispositivo Android predefinito.

Attendere che Visual Studio scarichi, decomprima e crei un emulatore Android. Quando l'emulatore di telefono Android è pronto, selezionare il pulsante Start .

Nota

Abilitare l'accelerazione hardware per migliorare le prestazioni dell'emulatore Android.

Chiudere la finestra Gestione dispositivi Android. Attendere che venga visualizzata la finestra del telefono emulato, il sistema operativo Android viene caricato e viene visualizzata la home schermata.

Importante

Il telefono emulato deve essere acceso con il sistema operativo Android caricato per caricare ed eseguire l'app nel debugger. Se il telefono emulato non è in esecuzione, attivare il telefono usando la scelta rapida da tastiera CTRL+P o selezionando il pulsante Di alimentazione nell'interfaccia utente:

Pulsante di alimentazione dell'emulatore Android.

Nella barra degli strumenti di Visual Studio selezionare il Pixel 5 - {VERSION} pulsante per compilare ed eseguire il progetto, dove il {VERSION} segnaposto è la versione di Android. Nell'esempio seguente la versione di Android è API 30 (Android 11.0 - API 30)e viene visualizzata una versione successiva in base all'SDK Android installato:

Pulsante dell'emulatore Pixel 5 API 30.

Visual Studio compila il progetto e distribuisce l'app nell'emulatore.

L'avvio dell'emulatore, il caricamento del telefono emulato e del sistema operativo e la distribuzione e l'esecuzione dell'app possono richiedere alcuni minuti a seconda della velocità del sistema e se l'accelerazione hardware è abilitata o meno. È possibile monitorare lo stato di avanzamento della distribuzione esaminando la barra di stato di Visual Studio nella parte inferiore dell'interfaccia utente. L'indicatore Ready riceve un segno di spunta e gli indicatori di distribuzione e caricamento dell'app dell'emulatore scompaiono quando l'app è in esecuzione:

Durante la distribuzione:

Primo indicatore di distribuzione visualizzato nella barra del piè di pagina di Visual Studio.

Durante l'avvio dell'app:

Secondo indicatore di distribuzione visualizzato nella barra del piè di pagina di Visual Studio.

L'app in esecuzione nell'emulatore Android:

App in esecuzione nell'emulatore Android.

Passaggi successivi

Questa esercitazione ha descritto come:

  • Creare un .NET MAUIBlazor Hybrid progetto di app in Visual Studio
  • Eseguire l'app in Windows
  • Eseguire l'app in un dispositivo mobile emulato nell'emulatore Android

Altre informazioni sulle Blazor Hybrid app: