Creare la prima Xamarin.Forms app

  • Articolo

Istruzioni dettagliate per Windows

Download Sample Scaricare l'esempio

Seguire questi passaggi e il video precedente:

  1. Scegliere File > Nuovo > progetto... oppure fare clic sul pulsante Crea nuovo progetto.

  2. Cercare "Xamarin" o scegliere Mobile dal menu Tipo di progetto. Selezionare il tipo di progetto App per dispositivi mobili (Xamarin.Forms).

  3. Scegliere un nome di progetto: l'esempio usa "AwesomeApp".

  4. Fare clic sul tipo di progetto Vuoto e verificare che siano selezionati Android e iOS:

    Android and iOS Blank App

  5. Attendere finché non vengono ripristinati i pacchetti NuGet (nella barra di stato verrà visualizzato il messaggio "Ripristino completato").

  6. Le nuove installazioni di Visual Studio 2022 non avranno sdk Android installati, potrebbe essere richiesto di installare l'SDK Android più recente:

    Install Android SDK

  7. Le nuove installazioni di Visual Studio 2022 non avranno un emulatore Android configurato. Fare clic sulla freccia a discesa sul pulsante Debug e scegliere Crea emulatore Android per avviare la schermata di creazione dell'emulatore:

    Create Android Emulator dropdown

  8. Nella schermata di creazione dell'emulatore usare le impostazioni predefinite e fare clic sul pulsante Crea:

    Android emulator creation screen

  9. Creando un emulatore, verrà nuovamente visualizzata la finestra Gestione dispositivi. Fare clic sul pulsante Avvia per avviare il nuovo emulatore:

    Android emulator in the Device Manager

  10. Visual Studio 2022 dovrebbe ora visualizzare il nome del nuovo emulatore nel pulsante Debug :

    Android emulator name on the Debug button

  11. Fare clic sul pulsante Debug per compilare e distribuire l'applicazione nell'emulatore Android:

    Android emulator displaying the application

Personalizzare l'applicazione

L'applicazione può essere personalizzata per aggiungere funzionalità interattive. Per aggiungere l'interazione utente all'applicazione, seguire questa procedura:

  1. Modificare MainPage.xaml aggiungendo questo XAML prima della fine del </StackLayout>:

    <Button Text="Click Me" Clicked="Button_Clicked" />

  2. Modificare MainPage.xaml.cs aggiungendo questo codice alla fine della classe:

    int count = 0;
void Button_Clicked(object sender, System.EventArgs e)
{
    count++;
    ((Button)sender).Text = $"You clicked {count} times.";
}

  3. Debug dell'app su Android:

    Android app with Button

Creare un'app iOS in Visual Studio 2022

È possibile compilare ed eseguire il debug dell'app iOS da Visual Studio con un computer Mac in rete. Vedere le istruzioni di installazione per altre informazioni.

Istruzioni dettagliate per Windows

Download Sample Scaricare l'esempio

Seguire questi passaggi e il video precedente:

  1. Scegliere File > Nuovo > progetto... oppure fare clic sul pulsante Crea nuovo progetto:

    Create a new project

  2. Cercare "Xamarin" o scegliere Mobile dal menu Tipo di progetto. Selezionare il tipo di progetto App per dispositivi mobili (Xamarin.Forms):

    Filter for Xamarin projects

  3. Scegliere un nome di progetto: l'esempio usa "AwesomeApp":

    Choose a project name

  4. Fare clic sul tipo di progetto Vuoto e verificare che siano selezionati Android e iOS:

    Android and iOS, with .NET Standard

  5. Attendere finché non vengono ripristinati i pacchetti NuGet (nella barra di stato verrà visualizzato il messaggio "Ripristino completato").

  6. Le nuove installazioni di Visual Studio 2019 non avranno un emulatore Android configurato. Fare clic sulla freccia a discesa sul pulsante Debug e scegliere Crea emulatore Android per avviare la schermata di creazione dell'emulatore:

    Create Android Emulator dropdown

  7. Nella schermata di creazione dell'emulatore usare le impostazioni predefinite e fare clic sul pulsante Crea:

    Android emulator creation screen

  8. Creando un emulatore, verrà nuovamente visualizzata la finestra Gestione dispositivi. Fare clic sul pulsante Avvia per avviare il nuovo emulatore:

    Android emulator in the Device Manager

  9. Visual Studio 2019 visualizzerà ora il nome del nuovo emulatore sul pulsante Debug:

    Android emulator name on the Debug button

  10. Fare clic sul pulsante Debug per compilare e distribuire l'applicazione nell'emulatore Android:

    Android emulator displaying the application

Personalizzare l'applicazione

L'applicazione può essere personalizzata per aggiungere funzionalità interattive. Per aggiungere l'interazione utente all'applicazione, seguire questa procedura:

  1. Modificare MainPage.xaml aggiungendo questo XAML prima della fine del </StackLayout>:

    <Button Text="Click Me" Clicked="Button_Clicked" />

  2. Modificare MainPage.xaml.cs aggiungendo questo codice alla fine della classe:

    int count = 0;
void Button_Clicked(object sender, System.EventArgs e)
{
    count++;
    ((Button)sender).Text = $"You clicked {count} times.";
}

  3. Debug dell'app su Android:

    Android app

Nota

L'applicazione di esempio include le funzionalità interattive aggiuntive non incluse nel video.

Compilare un'app iOS in Visual Studio 2019

È possibile compilare ed eseguire il debug dell'app iOS da Visual Studio con un computer Mac in rete. Vedere le istruzioni di installazione per altre informazioni.

Questo video descrive il processo di compilazione e test di un'app iOS con Visual Studio 2019 in Windows:

Istruzioni dettagliate per Mac

Download Sample Scaricare l'esempio

Seguire questi passaggi e il video precedente:

  1. Scegliere File > Nuova soluzione... o fare clic sul pulsante Nuovo progetto, quindi selezionare App multipiattaforma > App >Form vuota:

    Blank Forms App

  2. Verificare che Android e iOS siano selezionati:

    Android and iOS, with .NET Standard

Nota

Solo A-Z, a-z, '_', '.' e i numeri sono caratteri supportati per il nome dell'app e l'identificatore dell'organizzazione.

  1. Ripristinare i pacchetti NuGet, facendo clic sulla soluzione:

    Screenshot shows Restore NuGet Packages selected from the context menu for the solution.

  2. Avviare l'emulatore Android premendo il pulsante di debug (o Avvia > debug).

  3. Modificare MainPage.xaml aggiungendo questo XAML prima della fine del </StackLayout>:

    <Button Text="Click Me" Clicked="Handle_Clicked" />

  4. Modificare MainPage.xaml.cs aggiungendo questo codice alla fine della classe:

    int count = 0;
void Handle_Clicked(object sender, System.EventArgs e)
{
    count++;
    ((Button)sender).Text = $"You clicked {count} times.";
}

  5. Debug dell'app su Android:

    Screenshot shows the Android Emulator.

  6. Fare clic con il pulsante destro del mouse per impostare iOS su Progetto di avvio:

    Set the startup project to iOS

  7. Eseguire il debug dell'app in iOS selezionando un simulatore iOS dall'elenco a discesa.

Istruzioni dettagliate per Mac

Download Sample Scaricare l'esempio

Seguire questi passaggi e il video precedente:

  1. Scegliere File > Nuova soluzione... o fare clic sul pulsante Nuovo progetto, quindi selezionare App multipiattaforma > App >Form vuota:

    Blank Forms App

  2. Assicurarsi che le opzioni Android e iOS siano selezionate, con la condivisione codice .NET Standard:

    Android and iOS, with .NET Standard

Nota

Solo A-Z, a-z, '_', '.' e i numeri sono caratteri supportati per il nome dell'app e l'identificatore dell'organizzazione.

  1. Ripristinare i pacchetti NuGet, facendo clic sulla soluzione:

    Screenshot shows Restore NuGet Packages selected from the context menu for the solution.

  2. Avviare l'emulatore Android premendo il pulsante di debug (o Avvia > debug).

  3. Modificare MainPage.xaml aggiungendo questo XAML prima della fine del </StackLayout>:

    <Button Text="Click Me" Clicked="Handle_Clicked" />

  4. Modificare MainPage.xaml.cs aggiungendo questo codice alla fine della classe:

    int count = 0;
void Handle_Clicked(object sender, System.EventArgs e)
{
    count++;
    ((Button)sender).Text = $"You clicked {count} times.";
}

  5. Debug dell'app su Android:

    Screenshot shows the Android Emulator.

  6. Fare clic con il pulsante destro del mouse per impostare iOS su Progetto di avvio:

    Set the startup project to iOS

  7. Debug dell'app su iOS:

    iOS app

È possibile scaricare il codice completo dalla Raccolta esempi o visualizzarlo su GitHub.

Passaggi successivi

  • Guida introduttiva a pagina singola: creare un'app più funzionale.
  • Xamarin.Forms Esempi: scaricare ed eseguire esempi di codice e app di esempio.
  • Creazione di ebook per app per dispositivi mobili: capitoli approfonditi che illustrano Xamarin.Forms lo sviluppo, disponibili come PDF e include centinaia di esempi aggiuntivi.