Creare un'applicazione Novell. Forms a pagina singolaCreate a Single Page Xamarin.Forms Application

Scaricare esempio Scaricare l'esempioDownload Sample Download the sample

In questa Guida introduttiva si apprenderà come:In this quickstart, you will learn how to:

  • Creare un'applicazione Novell. Forms multipiattaforma.Create a cross-platform Xamarin.Forms application.
  • Definire l'interfaccia utente per una pagina usando eXtensible Application Markup Language (XAML).Define the user interface for a page using eXtensible Application Markup Language (XAML).
  • Interagire con gli elementi dell'interfaccia utente XAML dal codice.Interact with XAML user interface elements from code.

Questa Guida introduttiva illustra come creare un'applicazione Novell. Forms multipiattaforma, che consente di immettere una nota e di renderla permanente nell'archiviazione del dispositivo.The quickstart walks through how to create a cross-platform Xamarin.Forms application, which enables you to enter a note and persist it to device storage. Il risultato è riportato di seguito:The final application is shown below:

PrerequisitiPrerequisites

  • Visual Studio 2019 (versione più recente) con il carico di lavoro sviluppo di applicazioni per dispositivi mobili con .NET installato.Visual Studio 2019 (latest release), with the Mobile development with .NET workload installed.
  • Conoscenza di C#.Knowledge of C#.
  • opzionale Un Mac associato per compilare l'applicazione in iOS.(optional) A paired Mac to build the application on iOS.

Per ulteriori informazioni su questi prerequisiti, vedere installazione di Novell.For more information about these prerequisites, see Installing Xamarin. Per informazioni sulla connessione di Visual Studio 2019 a un host di compilazione Mac, vedere Associa a Mac per lo sviluppo di Xamarin.iOS.For information about connecting Visual Studio 2019 to a Mac build host, see Pair to Mac for Xamarin.iOS development.

Introduzione a Visual Studio 2019Get started with Visual Studio 2019

  1. Avviare Visual Studio 2019 e nella finestra di avvio fare clic su Crea un nuovo progetto per creare un nuovo progetto:Launch Visual Studio 2019, and in the start window click Create a new project to create a new project:

  2. Nella finestra Crea un nuovo progetto selezionare mobile nell'elenco a discesa tipo di progetto , selezionare l' app per dispositivi mobili (modello Novell. Forms ) e fare clic sul pulsante Avanti :In the Create a new project window, select Mobile in the Project type drop down, select the Mobile App (Xamarin.Forms template), and click the Next button:

  3. Nella finestra Configura nuovo progetto impostare il nome del progetto su Note, scegliere un percorso appropriato per il progetto e fare clic sul pulsante Crea :In the Configure your new project window, set the Project name to Notes, choose a suitable location for the project, and click the Create button:

    Importante

    I frammenti di codice C# e XAML in questa guida introduttiva richiedono che la soluzione sia denominata Notes.The C# and XAML snippets in this quickstart requires that the solution is named Notes. Se si usa un nome diverso, si verificheranno errori di compilazione quando si copia il codice da questa guida introduttiva alla soluzione.Using a different name will result in build errors when you copy code from this quickstart into the solution.

  4. Nella finestra di dialogo nuova app multipiattaforma fare clic su app vuota, quindi fare clic sul pulsante OK :In the New Cross Platform App dialog, click Blank App, and click the OK button:

    Per altre informazioni sulla libreria .NET Standard che viene creata, vedere Anatomy of a Xamarin.Forms application (Anatomia di un'applicazione Xamarin.Forms) in Xamarin.Forms Quickstart Deep Dive (Approfondimenti per l'avvio rapido di Xamarin.Forms).For more information about the .NET Standard library that gets created, see Anatomy of a Xamarin.Forms application in the Xamarin.Forms Quickstart Deep Dive.

  5. Fare doppio clic su MainPage.xaml nel progetto Notes in Esplora soluzioni per aprire il file:In Solution Explorer, in the Notes project, double-click MainPage.xaml to open it:

  6. In MainPage.xaml rimuovere tutto il codice del modello e sostituirlo con il codice seguente:In MainPage.xaml, remove all of the template code and replace it with the following code:

    <?xml version="1.0" encoding="utf-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="Notes.MainPage">
        <StackLayout Margin="10,35,10,10">
            <Label Text="Notes"
                   HorizontalOptions="Center"
                   FontAttributes="Bold" />
            <Editor x:Name="editor"
                    Placeholder="Enter your note"
                    HeightRequest="100" />
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Button Text="Save"
                        Clicked="OnSaveButtonClicked" />
                <Button Grid.Column="1"
                        Text="Delete"
                        Clicked="OnDeleteButtonClicked"/>
            </Grid>
        </StackLayout>
    </ContentPage>
    

    Questo codice definisce in modo dichiarativo l'interfaccia utente per la pagina, che Label è costituita da un Editor oggetto per visualizzare il testo, Button un oggetto per l'input di testo e due istanze che indirizzano l'applicazione al salvataggio o all'eliminazione di un file.This code declaratively defines the user interface for the page, which consists of a Label to display text, an Editor for text input, and two Button instances that direct the application to save or delete a file. Le due istanze di Button sono disposte orizzontalmente in un oggetto Grid, con Label, Editor e Grid disposti verticalmente in un oggetto StackLayout.The two Button instances are horizontally laid out in a Grid, with the Label, Editor, and Grid being vertically laid out in a StackLayout. Per ulteriori informazioni sulla creazione dell'interfaccia utente, vedere interfaccia utente nella Guida introduttiva a Novell. Forms.For more information about creating the user interface, see User interface in the Xamarin.Forms Quickstart Deep Dive.

    Salvare le modifiche apportate a MainPage.xaml premendo CTRL+S, e chiudere il file.Save the changes to MainPage.xaml by pressing CTRL+S, and close the file.

  7. In Esplora soluzioni espandere MainPage.xaml nel progetto Notes e fare doppio clic su MainPage.xaml.cs per aprirlo:In Solution Explorer, in the Notes project, expand MainPage.xaml and double-click MainPage.xaml.cs to open it:

  8. In MainPage.xaml.cs rimuovere tutto il codice del modello e sostituirlo con il codice seguente:In MainPage.xaml.cs, remove all of the template code and replace it with the following code:

    using System;
    using System.IO;
    using Xamarin.Forms;
    
    namespace Notes
    {
        public partial class MainPage : ContentPage
        {
            string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
    
            public MainPage()
            {
                InitializeComponent();
    
                if (File.Exists(_fileName))
                {
                    editor.Text = File.ReadAllText(_fileName);
                }
            }
    
            void OnSaveButtonClicked(object sender, EventArgs e)
            {
                File.WriteAllText(_fileName, editor.Text);
            }
    
            void OnDeleteButtonClicked(object sender, EventArgs e)
            {
                if (File.Exists(_fileName))
                {
                    File.Delete(_fileName);
                }
                editor.Text = string.Empty;
            }
        }
    }
    

    Questo codice definisce un campo _fileName, che fa riferimento a un file denominato notes.txt che archivia i dati delle note nella cartella locale dei dati delle applicazioni per l'applicazione.This code defines a _fileName field, which references a file named notes.txt that will store note data in the local application data folder for the application. Quando viene eseguito il costruttore della pagina, il file viene letto, se presente, e visualizzato in Editor.When the page constructor is executed the file is read, if it exists, and displayed in the Editor. Quando si seleziona Salva premendo Button, viene eseguito il gestore eventi OnSaveButtonClicked, che consente di salvare il contenuto di Editor nel file.When the Save Button is pressed the OnSaveButtonClicked event handler is executed, which saves the content of the Editor to the file. Se per selezionare Elimina si preme Button, viene eseguito il gestore eventi OnDeleteButtonClicked, che elimina il file, a condizione che esista, e rimuove qualsiasi testo da Editor.When the Delete Button is pressed the OnDeleteButtonClicked event handler is executed, which deletes the file, provided that it exists, and removes any text from the Editor. Per altre informazioni sull'interazione dell'utente, vedere risposta all'interazione dell'utente nella Guida introduttiva a Novell. Forms.For more information about user interaction, see Responding to user interaction in the Xamarin.Forms Quickstart Deep Dive.

    Salvare le modifiche apportate a MainPage.xaml.cs premendo CTRL+S, e chiudere il file.Save the changes to MainPage.xaml.cs by pressing CTRL+S, and close the file.

Compilazione della guida rapidaBuilding the quickstart

  1. In Visual Studio selezionare la voce di menu Compila > Compila soluzione o premere F6.In Visual Studio, select the Build > Build Solution menu item (or press F6). La soluzione viene compilata e nella barra di stato di Visual Studio viene visualizzato un messaggio di operazione completata:The solution will build and a success message will appear in the Visual Studio status bar:

    In caso di errori, ripetere i passaggi precedenti e correggere gli errori fino a quando la soluzione non viene compilata correttamente.If there are errors, repeat the previous steps and correct any mistakes until the solution builds successfully.

  2. Nella barra degli strumenti di Visual Studio premere il pulsante Avvia, ovvero il pulsante a forma di triangolo simile a un pulsante di riproduzione, per avviare l'applicazione in un emulatore Android:In the Visual Studio toolbar, press the Start button (the triangular button that resembles a Play button) to launch the application in your chosen Android emulator:

    Immettere una nota e premere il pulsante Salva.Enter a note and press the Save button.

    Per altre informazioni su come viene avviata l'applicazione in ogni piattaforma, vedere avvio dell'applicazione in ogni piattaforma dell' esercitazione introduttiva di Novell. Forms.For more information about how the application is launched on each platform, see Launching the application on each platform in the Xamarin.Forms Quickstart Deep Dive.

    Nota

    I passaggi seguenti devono essere effettuati solo se si usa un Mac associato che soddisfa i requisiti di sistema per lo sviluppo di Xamarin.Forms.The following steps should only be carried out if you have a paired Mac that meets the system requirements for Xamarin.Forms development.

  3. Nella barra degli strumenti di Visual Studio fare clic con il pulsante destro del mouse sul progetto Notes.iOS e selezionare Imposta come progetto di avvio.In the Visual Studio toolbar, right-click on the Notes.iOS project, and select Set as StartUp Project.

  4. Nella barra degli strumenti di Visual Studio premere il pulsante Avvia, ovvero il pulsante a forma di triangolo simile a un pulsante di riproduzione, per avviare l'applicazione nel simulatore iOS remoto:In the Visual Studio toolbar, press the Start button (the triangular button that resembles a Play button) to launch the application in your chosen iOS remote simulator:

    Note nel simulatore iOS [ ![(single-page-images/vs/notes-ios.png " ")]] (single-page-images/vs/notes-ios-large.png#lightbox "Note nel simulatore iOS")

    Immettere una nota e premere il pulsante Salva.Enter a note and press the Save button.

    Per altre informazioni su come viene avviata l'applicazione in ogni piattaforma, vedere avvio dell'applicazione in ogni piattaforma dell' esercitazione introduttiva di Novell. Forms.For more information about how the application is launched on each platform, see Launching the application on each platform in the Xamarin.Forms Quickstart Deep Dive.

PrerequisitiPrerequisites

  • Visual Studio 2017, con il carico di lavoro sviluppo di applicazioni per dispositivi mobili con .NET installato.Visual Studio 2017, with the Mobile development with .NET workload installed.
  • Conoscenza di C#.Knowledge of C#.
  • opzionale Un Mac associato per compilare l'applicazione in iOS.(optional) A paired Mac to build the application on iOS.

Per ulteriori informazioni su questi prerequisiti, vedere installazione di Novell.For more information about these prerequisites, see Installing Xamarin. Per informazioni sulla connessione di Visual Studio 2019 a un host di compilazione Mac, vedere Associa a Mac per lo sviluppo di Xamarin.iOS.For information about connecting Visual Studio 2019 to a Mac build host, see Pair to Mac for Xamarin.iOS development.

Introduzione a Visual Studio 2017Get started with Visual Studio 2017

  1. Avviare Visual Studio 2017 e nella pagina iniziale fare clic su Crea nuovo progetto per creare un nuovo progetto:Launch Visual Studio 2017, and on the start page click Create new project... to create a new project:

  2. Nella finestra di dialogo Nuovo progetto fare clic su Multipiattaforma, selezionare il modello App per dispositivi mobili (Xamarin.Forms) , impostare il nome su Notes, scegliere un percorso adatto per il progetto e fare clic sul pulsante OK:In the New Project dialog, click Cross-Platform, select the Mobile App (Xamarin.Forms) template, set the Name to Notes, choose a suitable location for the project and click the OK button:

    Importante

    I frammenti di codice C# e XAML in questa guida introduttiva richiedono che la soluzione sia denominata Notes.The C# and XAML snippets in this quickstart requires that the solution is named Notes. Se si usa un nome diverso, si verificheranno errori di compilazione quando si copia il codice da questa guida introduttiva alla soluzione.Using a different name will result in build errors when you copy code from this quickstart into the solution.

  3. Nella finestra di dialogo Nuova app multipiattaforma, fare clic su App vuota, selezionare .NET Standard come strategia di condivisione del codice e fare clic sul pulsante OK:In the New Cross Platform App dialog, click Blank App, select .NET Standard as the Code Sharing Strategy, and click the OK button:

    Per altre informazioni sulla libreria .NET Standard che viene creata, vedere Anatomy of a Xamarin.Forms application (Anatomia di un'applicazione Xamarin.Forms) in Xamarin.Forms Quickstart Deep Dive (Approfondimenti per l'avvio rapido di Xamarin.Forms).For more information about the .NET Standard library that gets created, see Anatomy of a Xamarin.Forms application in the Xamarin.Forms Quickstart Deep Dive.

  4. Fare doppio clic su MainPage.xaml nel progetto Notes in Esplora soluzioni per aprire il file:In Solution Explorer, in the Notes project, double-click MainPage.xaml to open it:

  5. In MainPage.xaml rimuovere tutto il codice del modello e sostituirlo con il codice seguente:In MainPage.xaml, remove all of the template code and replace it with the following code:

    <?xml version="1.0" encoding="utf-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="Notes.MainPage">
        <StackLayout Margin="10,35,10,10">
            <Label Text="Notes"
                   HorizontalOptions="Center"
                   FontAttributes="Bold" />
            <Editor x:Name="editor"
                    Placeholder="Enter your note"
                    HeightRequest="100" />
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Button Text="Save"
                        Clicked="OnSaveButtonClicked" />
                <Button Grid.Column="1"
                        Text="Delete"
                        Clicked="OnDeleteButtonClicked"/>
            </Grid>
        </StackLayout>
    </ContentPage>
    

    Questo codice definisce in modo dichiarativo l'interfaccia utente per la pagina, che Label è costituita da un Editor oggetto per visualizzare il testo, Button un oggetto per l'input di testo e due istanze che indirizzano l'applicazione al salvataggio o all'eliminazione di un file.This code declaratively defines the user interface for the page, which consists of a Label to display text, an Editor for text input, and two Button instances that direct the application to save or delete a file. Le due istanze di Button sono disposte orizzontalmente in un oggetto Grid, con Label, Editor e Grid disposti verticalmente in un oggetto StackLayout.The two Button instances are horizontally laid out in a Grid, with the Label, Editor, and Grid being vertically laid out in a StackLayout. Per ulteriori informazioni sulla creazione dell'interfaccia utente, vedere interfaccia utente nella Guida introduttiva a Novell. Forms.For more information about creating the user interface, see User interface in the Xamarin.Forms Quickstart Deep Dive.

    Salvare le modifiche apportate a MainPage.xaml premendo CTRL+S, e chiudere il file.Save the changes to MainPage.xaml by pressing CTRL+S, and close the file.

  6. In Esplora soluzioni espandere MainPage.xaml nel progetto Notes e fare doppio clic su MainPage.xaml.cs per aprirlo:In Solution Explorer, in the Notes project, expand MainPage.xaml and double-click MainPage.xaml.cs to open it:

  7. In MainPage.xaml.cs rimuovere tutto il codice del modello e sostituirlo con il codice seguente:In MainPage.xaml.cs, remove all of the template code and replace it with the following code:

    using System;
    using System.IO;
    using Xamarin.Forms;
    
    namespace Notes
    {
        public partial class MainPage : ContentPage
        {
            string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
    
            public MainPage()
            {
                InitializeComponent();
    
                if (File.Exists(_fileName))
                {
                    editor.Text = File.ReadAllText(_fileName);
                }
            }
    
            void OnSaveButtonClicked(object sender, EventArgs e)
            {
                File.WriteAllText(_fileName, editor.Text);
            }
    
            void OnDeleteButtonClicked(object sender, EventArgs e)
            {
                if (File.Exists(_fileName))
                {
                    File.Delete(_fileName);
                }
                editor.Text = string.Empty;
            }
        }
    }
    

    Questo codice definisce un campo _fileName, che fa riferimento a un file denominato notes.txt che archivia i dati delle note nella cartella locale dei dati delle applicazioni per l'applicazione.This code defines a _fileName field, which references a file named notes.txt that will store note data in the local application data folder for the application. Quando viene eseguito il costruttore della pagina, il file viene letto, se presente, e visualizzato in Editor.When the page constructor is executed the file is read, if it exists, and displayed in the Editor. Quando si seleziona Salva premendo Button, viene eseguito il gestore eventi OnSaveButtonClicked, che consente di salvare il contenuto di Editor nel file.When the Save Button is pressed the OnSaveButtonClicked event handler is executed, which saves the content of the Editor to the file. Se per selezionare Elimina si preme Button, viene eseguito il gestore eventi OnDeleteButtonClicked, che elimina il file, a condizione che esista, e rimuove qualsiasi testo da Editor.When the Delete Button is pressed the OnDeleteButtonClicked event handler is executed, which deletes the file, provided that it exists, and removes any text from the Editor. Per altre informazioni sull'interazione dell'utente, vedere risposta all'interazione dell'utente nella Guida introduttiva a Novell. Forms.For more information about user interaction, see Responding to user interaction in the Xamarin.Forms Quickstart Deep Dive.

    Salvare le modifiche apportate a MainPage.xaml.cs premendo CTRL+S, e chiudere il file.Save the changes to MainPage.xaml.cs by pressing CTRL+S, and close the file.

Compilazione della guida rapidaBuilding the quickstart

  1. In Visual Studio selezionare la voce di menu Compila > Compila soluzione o premere F6.In Visual Studio, select the Build > Build Solution menu item (or press F6). La soluzione viene compilata e nella barra di stato di Visual Studio viene visualizzato un messaggio di operazione completata:The solution will build and a success message will appear in the Visual Studio status bar:

    In caso di errori, ripetere i passaggi precedenti e correggere gli errori fino a quando la soluzione non viene compilata correttamente.If there are errors, repeat the previous steps and correct any mistakes until the solution builds successfully.

  2. Nella barra degli strumenti di Visual Studio premere il pulsante Avvia, ovvero il pulsante a forma di triangolo simile a un pulsante di riproduzione, per avviare l'applicazione in un emulatore Android:In the Visual Studio toolbar, press the Start button (the triangular button that resembles a Play button) to launch the application in your chosen Android emulator:

    Immettere una nota e premere il pulsante Salva.Enter a note and press the Save button.

    Per altre informazioni su come viene avviata l'applicazione in ogni piattaforma, vedere avvio dell'applicazione in ogni piattaforma dell' esercitazione introduttiva di Novell. Forms.For more information about how the application is launched on each platform, see Launching the application on each platform in the Xamarin.Forms Quickstart Deep Dive.

    Nota

    I passaggi seguenti devono essere effettuati solo se si usa un Mac associato che soddisfa i requisiti di sistema per lo sviluppo di Xamarin.Forms.The following steps should only be carried out if you have a paired Mac that meets the system requirements for Xamarin.Forms development.

  3. Nella barra degli strumenti di Visual Studio fare clic con il pulsante destro del mouse sul progetto Notes.iOS e selezionare Imposta come progetto di avvio.In the Visual Studio toolbar, right-click on the Notes.iOS project, and select Set as StartUp Project.

  4. Nella barra degli strumenti di Visual Studio premere il pulsante Avvia, ovvero il pulsante a forma di triangolo simile a un pulsante di riproduzione, per avviare l'applicazione nel simulatore iOS remoto:In the Visual Studio toolbar, press the Start button (the triangular button that resembles a Play button) to launch the application in your chosen iOS remote simulator:

    Note nel simulatore iOS [ ![(single-page-images/vs/notes-ios.png " ")]] (single-page-images/vs/notes-ios-large.png#lightbox "Note nel simulatore iOS")

    Immettere una nota e premere il pulsante Salva.Enter a note and press the Save button.

    Per altre informazioni su come viene avviata l'applicazione in ogni piattaforma, vedere avvio dell'applicazione in ogni piattaforma dell' esercitazione introduttiva di Novell. Forms.For more information about how the application is launched on each platform, see Launching the application on each platform in the Xamarin.Forms Quickstart Deep Dive.

PrerequisitiPrerequisites

  • Visual Studio per Mac (versione più recente) con supporto della piattaforma iOS e Android installato.Visual Studio for Mac (latest release), with iOS and Android platform support installed.
  • Xcode (versione più recente).Xcode (latest release).
  • Conoscenza di C#.Knowledge of C#.

Per ulteriori informazioni su questi prerequisiti, vedere installazione di Novell.For more information about these prerequisites, see Installing Xamarin.

Introduzione a Visual Studio per MacGet started with Visual Studio for Mac

  1. Avviare Visual Studio per Mac e nella finestra di avvio fare clic su nuovo per creare un nuovo progetto:Launch Visual Studio for Mac, and in the start window click New to create a new project:

  2. Nella finestra di dialogo, Scegli un modello per il nuovo progetto fare clic su Multipiattaforma > App, selezionare il modello App Forms vuota e fare clic sul pulsante Avanti:In the Choose a template for your new project dialog, click Multiplatform > App, select the Blank Forms App template, and click the Next button:

  3. Nella finestra di dialogo Configura l'app Forms vuota denominare la nuova app Notes, verificare che sia selezionato il pulsante di opzione Usa .NET Standard e fare clic sul pulsante Avanti:In the Configure your Blank Forms app dialog, name the new app Notes, ensure that the Use .NET Standard radio button is selected, and click the Next button:

  4. Nella finestra di dialogo Configura l'app Forms vuota lasciare i nomi di soluzione e progetto impostati su Notes, scegliere un percorso appropriato per il progetto e fare clic sul pulsante Crea per creare il progetto:In the Configure your new Blank Forms app dialog, leave the Solution and Project names set to Notes, choose a suitable location for the project, and click the Create button to create the project:

    Importante

    I frammenti di codice C# e XAML in questa guida introduttiva richiedono che sia la soluzione che il progetto siano denominati Notes.The C# and XAML snippets in this quickstart requires that the solution and project are both named Notes. Se si usa un nome diverso, si verificheranno errori di compilazione quando si copia il codice da questa guida introduttiva al progetto.Using a different name will result in build errors when you copy code from this quickstart into the project.

    Per altre informazioni sulla libreria .NET Standard che viene creata, vedere Anatomy of a Xamarin.Forms application (Anatomia di un'applicazione Xamarin.Forms) in Xamarin.Forms Quickstart Deep Dive (Approfondimenti per l'avvio rapido di Xamarin.Forms).For more information about the .NET Standard library that gets created, see Anatomy of a Xamarin.Forms application in the Xamarin.Forms Quickstart Deep Dive.

  5. Fare doppio clic su MainPage.xaml nel progetto Notes nel riquadro della soluzione per aprire il file:In the Solution Pad, in the Notes project, double-click MainPage.xaml to open it:

  6. In MainPage.xaml rimuovere tutto il codice del modello e sostituirlo con il codice seguente:In MainPage.xaml, remove all of the template code and replace it with the following code:

    <?xml version="1.0" encoding="utf-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 x:Class="Notes.MainPage">
        <StackLayout Margin="10,35,10,10">
            <Label Text="Notes"
                   HorizontalOptions="Center"
                   FontAttributes="Bold" />
            <Editor x:Name="editor"
                    Placeholder="Enter your note"
                    HeightRequest="100" />
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Button Text="Save"
                        Clicked="OnSaveButtonClicked" />
                <Button Grid.Column="1"
                        Text="Delete"
                        Clicked="OnDeleteButtonClicked"/>
            </Grid>
        </StackLayout>
    </ContentPage>
    

    Questo codice definisce in modo dichiarativo l'interfaccia utente per la pagina, che Label è costituita da un Editor oggetto per visualizzare il testo, Button un oggetto per l'input di testo e due istanze che indirizzano l'applicazione al salvataggio o all'eliminazione di un file.This code declaratively defines the user interface for the page, which consists of a Label to display text, an Editor for text input, and two Button instances that direct the application to save or delete a file. Le due istanze di Button sono disposte orizzontalmente in un oggetto Grid, con Label, Editor e Grid disposti verticalmente in un oggetto StackLayout.The two Button instances are horizontally laid out in a Grid, with the Label, Editor, and Grid being vertically laid out in a StackLayout. Per ulteriori informazioni sulla creazione dell'interfaccia utente, vedere interfaccia utente nella Guida introduttiva a Novell. Forms.For more information about creating the user interface, see User interface in the Xamarin.Forms Quickstart Deep Dive.

    Salvare le modifiche apportate a MainPage.xaml scegliendo File > Salva o premendo ⌘ + S, e chiudere il file.Save the changes to MainPage.xaml by choosing File > Save (or by pressing ⌘ + S), and close the file.

  7. Nel riquadro della soluzione espandere MainPage.xaml nel progetto Notes e fare doppio clic su MainPage.xaml.cs per aprirlo:In the Solution Pad, in the Notes project, expand MainPage.xaml and double-click MainPage.xaml.cs to open it:

  8. In MainPage.xaml.cs rimuovere tutto il codice del modello e sostituirlo con il codice seguente:In MainPage.xaml.cs, remove all of the template code and replace it with the following code:

    using System;
    using System.IO;
    using Xamarin.Forms;
    
    namespace Notes
    {
        public partial class MainPage : ContentPage
        {
            string _fileName = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), "notes.txt");
    
            public MainPage()
            {
                InitializeComponent();
    
                if (File.Exists(_fileName))
                {
                    editor.Text = File.ReadAllText(_fileName);
                }
            }
    
            void OnSaveButtonClicked(object sender, EventArgs e)
            {
                File.WriteAllText(_fileName, editor.Text);
            }
    
            void OnDeleteButtonClicked(object sender, EventArgs e)
            {
                if (File.Exists(_fileName))
                {
                    File.Delete(_fileName);
                }
                editor.Text = string.Empty;
            }
        }
    }
    

    Questo codice definisce un campo _fileName, che fa riferimento a un file denominato notes.txt che archivia i dati delle note nella cartella locale dei dati delle applicazioni per l'applicazione.This code defines a _fileName field, which references a file named notes.txt that will store note data in the local application data folder for the application. Quando viene eseguito il costruttore della pagina, il file viene letto, se presente, e visualizzato in Editor.When the page constructor is executed the file is read, if it exists, and displayed in the Editor. Quando si seleziona Salva premendo Button, viene eseguito il gestore eventi OnSaveButtonClicked, che consente di salvare il contenuto di Editor nel file.When the Save Button is pressed the OnSaveButtonClicked event handler is executed, which saves the content of the Editor to the file. Se per selezionare Elimina si preme Button, viene eseguito il gestore eventi OnDeleteButtonClicked, che elimina il file, a condizione che esista, e rimuove qualsiasi testo da Editor.When the Delete Button is pressed the OnDeleteButtonClicked event handler is executed, which deletes the file, provided that it exists, and removes any text from the Editor. Per altre informazioni sull'interazione dell'utente, vedere risposta all'interazione dell'utente nella Guida introduttiva a Novell. Forms.For more information about user interaction, see Responding to user interaction in the Xamarin.Forms Quickstart Deep Dive.

    Salvare le modifiche apportate a MainPage.xaml.cs scegliendo File > Salva o premendo ⌘ + S, e chiudere il file.Save the changes to MainPage.xaml.cs by choosing File > Save (or by pressing ⌘ + S), and close the file.

Compilazione della guida rapidaBuilding the quickstart

  1. In Visual Studio per Mac, selezionare la voce di menu Compila > Compila tutto o premere ⌘ + B.In Visual Studio for Mac, select the Build > Build All menu item (or press ⌘ + B). I progetti vengono compilati e viene visualizzato un messaggio di operazione completata nella barra degli strumenti di Visual Studio per Mac.The projects will build and a success message will appear in the Visual Studio for Mac toolbar.

    In caso di errori, ripetere i passaggi precedenti e correggere gli errori finché i progetti non vengono compilati correttamente.If there are errors, repeat the previous steps and correct any mistakes until the projects build successfully.

  2. Nella riquadro della soluzioneselezionare il progetto Notes. iOS , fare clic con il pulsante destro del mouse e selezionare Imposta come progetto di avvio:In the Solution Pad, select the Notes.iOS project, right-click, and select Set As Startup Project:

  3. Nella barra degli strumenti di Visual Studio per Mac premere il pulsante Avvia, ovvero il pulsante a forma di triangolo simile a un pulsante di riproduzione, per avviare l'applicazione all'interno del simulatore iOS prescelto:In the Visual Studio for Mac toolbar, press the Start button (the triangular button that resembles a Play button) to launch the application inside your chosen iOS Simulator:

    Note nel simulatore iOS [ ![(single-page-images/vsmac/notes-ios.png " ")]] (single-page-images/vsmac/notes-ios-large.png#lightbox "Note nel simulatore iOS")

    Immettere una nota e premere il pulsante Salva.Enter a note and press the Save button.

    Per altre informazioni su come viene avviata l'applicazione in ogni piattaforma, vedere avvio dell'applicazione in ogni piattaforma dell' esercitazione introduttiva di Novell. Forms.For more information about how the application is launched on each platform, see Launching the application on each platform in the Xamarin.Forms Quickstart Deep Dive.

  4. Nella riquadro della soluzioneselezionare il progetto Notes. Droid , fare clic con il pulsante destro del mouse e selezionare Imposta come progetto di avvio:In the Solution Pad, select the Notes.Droid project, right-click, and select Set As Startup Project:

  5. Nella barra degli strumenti di Visual Studio per Mac premere il pulsante Avvia, ovvero il pulsante a forma di triangolo simile a un pulsante di riproduzione, per avviare l'applicazione all'interno dell'emulatore Android prescelto:In the Visual Studio for Mac toolbar, press the Start button (the triangular button that resembles a Play button) to launch the application inside your chosen Android emulator:

    Immettere una nota e premere il pulsante Salva.Enter a note and press the Save button.

    Per altre informazioni su come viene avviata l'applicazione in ogni piattaforma, vedere avvio dell'applicazione in ogni piattaforma dell' esercitazione introduttiva di Novell. Forms.For more information about how the application is launched on each platform, see Launching the application on each platform in the Xamarin.Forms Quickstart Deep Dive.

Passaggi successiviNext steps

In questa Guida introduttiva si è appreso come:In this quickstart, you learned how to:

  • Creare un'applicazione Novell. Forms multipiattaforma.Create a cross-platform Xamarin.Forms application.
  • Definire l'interfaccia utente per una pagina usando eXtensible Application Markup Language (XAML).Define the user interface for a page using eXtensible Application Markup Language (XAML).
  • Interagire con gli elementi dell'interfaccia utente XAML dal codice.Interact with XAML user interface elements from code.

Per trasformare questa applicazione a pagina singola in un'applicazione a più pagine, passare alla Guida introduttiva successiva.To turn this single page application into a multi-page application, continue to the next quickstart.