Xamarin.Forms Esercitazione di immissione

Articolo
Developer (Principiante)
8 minuti per il completamento

Prima di provare questa esercitazione è necessario avere completato correttamente:

Creare la prima Xamarin.Forms guida introduttiva all'app .
Esercitazione su StackLayout.

In questa esercitazione apprenderai a:

Creare un Xamarin.FormsEntry oggetto in XAML.
Rispondere al cambiamento del testo dell'elemento Entry.
Personalizzare il comportamento di Entry.

Si userà Visual Studio 2019 o Visual Studio per Mac per creare un'applicazione semplice che dimostri come personalizzare il comportamento di un oggetto Entry. Gli screenshot seguenti illustrano l'applicazione finale:

Userai anche Ricaricamento rapido XAML per Xamarin.Forms visualizzare le modifiche dell'interfaccia utente senza ricompilare l'applicazione.

Crea una voce

7 minuti rimanenti

Visual Studio
Visual Studio per Mac

Per completare questa esercitazione è necessario Visual Studio 2019 (la versione più recente) con installato il carico di lavoro Sviluppo di applicazioni per dispositivi mobili con .NET. È inoltre necessario un Mac associato per compilare l'applicazione dell'esercitazione per iOS. Per informazioni sull'installazione della piattaforma Xamarin, vedere Installazione di 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.

Avviare Visual Studio e creare una nuova app vuota Xamarin.Forms denominata EntryTutorial.

Importante

I frammenti di codice C# e XAML in questa esercitazione richiedono che la soluzione sia denominata EntryTutorial. Se si usa un nome diverso, si verificheranno errori di compilazione quando si copia il codice da questa esercitazione alla soluzione.

Per altre informazioni sulla libreria .NET Standard che viene creata, vedere Anatomia di un'applicazione Xamarin.Forms nell'approfondimento della Xamarin.Forms guida introduttiva.
Fare doppio clic su MainPage.xaml nel progetto EntryTutorial in Esplora soluzioni per aprire il file. In MainPage.xaml rimuovere tutto il codice del modello e sostituirlo con il codice seguente:
```
<?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="EntryTutorial.MainPage">
    <StackLayout Margin="20,35,20,20">
        <Entry Placeholder="Enter text" />
    </StackLayout>
</ContentPage>
```
Questo codice definisce in modo dichiarativo l'interfaccia utente per la pagina costituita da un elemento Entry in uno StackLayout. La proprietà Entry.Placeholder specifica il testo segnaposto mostrato alla prima visualizzazione di Entry.
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 all'interno del simulatore iOS remoto o dell'emulatore Android prescelto:

In Visual Studio arrestare l'applicazione.

Per completare questa esercitazione è necessario Visual Studio per Mac, la versione più recente, con installato il supporto della piattaforma Android e iOS. Sarà necessario anche Xcode, la versione più recente. Per altre informazioni sull'installazione della piattaforma Xamarin, vedere Installazione di Xamarin.

Avviare Visual Studio per Mac e creare una nuova app vuota Xamarin.Forms denominata EntryTutorial.

Importante

I frammenti di codice C# e XAML in questa esercitazione richiedono che la soluzione sia denominata EntryTutorial. Se si usa un nome diverso, si verificheranno errori di compilazione quando si copia il codice da questa esercitazione alla soluzione.

Per altre informazioni sulla libreria .NET Standard che viene creata, vedere Anatomia di un'applicazione Xamarin.Forms nell'approfondimento della Xamarin.Forms guida introduttiva.
Fare doppio clic su MainPage.xaml nel progetto EntryTutorial nel riquadro della soluzione per aprire il file. In MainPage.xaml rimuovere tutto il codice del modello e sostituirlo con il codice seguente:
```
<?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="EntryTutorial.MainPage">
    <StackLayout Margin="20,35,20,20">
        <Entry Placeholder="Enter text" />
    </StackLayout>
</ContentPage>
```
Questo codice definisce in modo dichiarativo l'interfaccia utente per la pagina costituita da un elemento Entry in uno StackLayout. La proprietà Entry.Placeholder specifica il testo segnaposto mostrato alla prima visualizzazione di Entry.
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 o dell'emulatore Android prescelto:

In Visual Studio per Mac arrestare l'applicazione.

Rispondere alle modifiche di testo

5 minuti rimanenti

Visual Studio
Visual Studio per Mac

In MainPage.XAML modificare la dichiarazione Entry in modo che imposti un gestore per gli eventi TextChanged e Completed:
```
<Entry Placeholder="Enter text"
       TextChanged="OnEntryTextChanged"
       Completed="OnEntryCompleted" />
```
Questo codice imposta l'evento TextChanged su un gestore eventi denominato OnEntryTextChanged e l'evento Completed su un gestore eventi denominato OnEntryCompleted. Entrambi i gestori eventi verranno creati nel passaggio successivo.
In Esplora soluzioni espandere MainPage.xaml nel progetto EntryTutorial e fare doppio clic su MainPage.xaml.cs per aprirlo. In MainPage.xaml.cs aggiungere i gestori eventi OnEntryTextChanged e OnEntryCompleted alla classe:
```
void OnEntryTextChanged(object sender, TextChangedEventArgs e)
{
    string oldText = e.OldTextValue;
    string newText = e.NewTextValue;
}

void OnEntryCompleted(object sender, EventArgs e)
{
    string text = ((Entry)sender).Text;
}
```
Quando il testo in Entry cambia, viene eseguito il metodo OnEntryTextChanged. L'argomento sender è l'oggetto Entry responsabile dell'attivazione dell'evento TextChanged e può essere usato per accedere all'oggetto Entry. L'argomento TextChangedEventArgs fornisce i valori del testo nuovo e di quello precedente, prima e dopo la modifica del testo.

Quando si finalizza il testo in Entry con il tasto INVIO, viene eseguito il metodo OnEntryCompleted. L'argomento sender è l'oggetto Entry responsabile dell'attivazione dell'evento TextChanged e può essere usato per accedere all'oggetto Entry.

Importante

Il testo immesso in Entry viene archiviato nella proprietà Text.
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 all'interno del simulatore iOS remoto o dell'emulatore Android prescelto:

Impostare i punti di interruzione nei due gestori di eventi e immettere il testo in Entry e osservare la generazione degli eventi TextChanged e Completed.

Per altre informazioni sugli Entry eventi, vedere Eventi e interattività nella Xamarin.Forms Guida alla voce .

In MainPage.XAML modificare la dichiarazione Entry in modo che imposti un gestore per gli eventi TextChanged e Completed:
```
<Entry Placeholder="Enter text"
       TextChanged="OnEntryTextChanged"
       Completed="OnEntryCompleted" />
```
Questo codice imposta l'evento TextChanged su un gestore eventi denominato OnEntryTextChanged e l'evento Completed su un gestore eventi denominato OnEntryCompleted. Entrambi i gestori eventi verranno creati nel passaggio successivo.
Nel riquadro della soluzione espandere MainPage.xaml nel progetto EntryTutorial e fare doppio clic su MainPage.xaml.cs per aprirlo. In MainPage.xaml.cs aggiungere i gestori eventi OnEntryTextChanged e OnEntryCompleted alla classe:
```
void OnEntryTextChanged(object sender, TextChangedEventArgs e)
{
    string oldText = e.OldTextValue;
    string newText = e.NewTextValue;
}

void OnEntryCompleted(object sender, EventArgs e)
{
    string text = ((Entry)sender).Text;
}
```
Quando il testo in Entry cambia, viene eseguito il metodo OnEntryTextChanged. L'argomento sender è l'oggetto Entry responsabile dell'attivazione dell'evento TextChanged e può essere usato per accedere all'oggetto Entry. L'argomento TextChangedEventArgs fornisce i valori del testo nuovo e di quello precedente, prima e dopo la modifica del testo.

Quando si finalizza il testo in Entry con il tasto INVIO, viene eseguito il metodo OnEntryCompleted. L'argomento sender è l'oggetto Entry responsabile dell'attivazione dell'evento TextChanged e può essere usato per accedere all'oggetto Entry.

Importante

Il testo immesso in Entry viene archiviato nella proprietà Text.
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 o dell'emulatore Android prescelto:

Impostare i punti di interruzione nei due gestori di eventi e immettere il testo in Entry e osservare la generazione degli eventi TextChanged e Completed.

Per altre informazioni sugli Entry eventi, vedere Eventi e interattività nella Xamarin.Forms Guida alla voce .

Personalizzare il comportamento

2 minuti rimanenti

Visual Studio
Visual Studio per Mac

In MainPage.xaml modificare la dichiarazione Entry per personalizzarne il comportamento:
```
<Entry Placeholder="Enter password"
       MaxLength="15"
       IsSpellCheckEnabled="false"
       IsTextPredictionEnabled="false"
       IsPassword="true" />
```
Questo codice imposta le proprietà che personalizzano il comportamento di Entry. La proprietà MaxLength limita la lunghezza di input valida per Entrye la proprietà IsSpellCheckEnabled è impostata su false per disabilitare il controllo ortografico. Analogamente, la proprietà IsTextPredictionEnabled è impostata su false per disabilitare il completamento del testo e il completamento automatico del testo. Inoltre, la proprietà IsPassword garantisce che i caratteri immessi vengono mascherati con un carattere della password (un cerchio nero).

Nota

Per alcuni scenari di immissione del testo, quali l'immissione di una password, il controllo ortografico e il completamento del testo offre un'esperienza negativa e pertanto deve essere disabilitata.
Se l'applicazione è ancora in esecuzione, salvare le modifiche apportate al file e l'interfaccia utente dell'applicazione verrà aggiornata automaticamente nel simulatore o nell'emulatore. In caso contrario, sulla 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 all'interno del simulatore iOS remoto o dell'emulatore Android prescelto. Immettere il testo in Entry e osservare che ogni carattere viene sostituito con un carattere della maschera della password e che il numero massimo di caratteri che possono essere immessi è 15:

In Visual Studio arrestare l'applicazione.

Per altre informazioni sulla personalizzazione del Entry comportamento, vedere la Xamarin.Forms Guida alla voce .

In MainPage.xaml modificare la dichiarazione Entry per personalizzarne il comportamento:
```
<Entry Placeholder="Enter password"
       MaxLength="15"
       IsSpellCheckEnabled="false"
       IsTextPredictionEnabled="false"
       IsPassword="true" />
```
Questo codice imposta le proprietà che personalizzano il comportamento di Entry. La proprietà MaxLength limita la lunghezza di input valida per Entrye la proprietà IsSpellCheckEnabled è impostata su false per disabilitare il controllo ortografico. Analogamente, la proprietà IsTextPredictionEnabled è impostata su false per disabilitare il completamento del testo e il completamento automatico del testo. Inoltre, la proprietà IsPassword garantisce che i caratteri immessi vengono mascherati con un carattere della password (un cerchio nero).

Nota

Per alcuni scenari di immissione del testo, quali l'immissione di una password, il controllo ortografico e il completamento del testo offre un'esperienza negativa e pertanto deve essere disabilitata.
Se l'applicazione è ancora in esecuzione, salvare le modifiche apportate al file e l'interfaccia utente dell'applicazione verrà aggiornata automaticamente nel simulatore o nell'emulatore. In caso contrario, sulla 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 o dell'emulatore Android prescelto. Immettere il testo in Entry e osservare che ogni carattere viene sostituito con un carattere della maschera della password e che il numero massimo di caratteri che possono essere immessi è 15:

In Visual Studio per Mac arrestare l'applicazione.

Per altre informazioni sulla personalizzazione del Entry comportamento, vedere la Xamarin.Forms Guida alla voce .

Condividi tramite

Xamarin.Forms Esercitazione di immissione

Crea una voce

Rispondere alle modifiche di testo

Personalizzare il comportamento

Congratulazioni!

Passaggi successivi

Condividi tramite

Xamarin.Forms Esercitazione di immissione

Crea una voce

Rispondere alle modifiche di testo

Personalizzare il comportamento

Congratulazioni!

Passaggi successivi

Collegamenti correlati