Condividi tramite

Controlli di testo

I controlli di testo sono costituiti da caselle di input di testo, caselle di password, caselle di suggerimento automatico e blocchi di testo. Il framework XAML fornisce diversi controlli per il rendering, l'immissione e la modifica del testo e un set di proprietà per la formattazione del testo.

API importanti: classe TextBlock, classe RichTextBlock, classe TextBox, classe RichEditBox, classe AutoSuggestBox, classe PasswordBox

Questo è il controllo giusto?

Il controllo di testo usato dipende dallo scenario in uso. Usa queste informazioni per selezionare il controllo di testo corretto da usare nella tua app.

Rendering del testo di sola lettura

Usare un TextBlock per visualizzare la maggior parte del testo di sola lettura nell'app. È possibile usarlo per visualizzare testo su riga singola o su più righe, collegamenti ipertestuali inline e testo con formattazione come grassetto, corsivo o sottolineato.

TextBlock è in genere più facile da usare e offre prestazioni di rendering del testo migliori rispetto a RichTextBlock, quindi è preferibile per la maggior parte del testo dell'interfaccia utente dell'app. Puoi accedere e usare facilmente il testo da un textBlock nella tua app ottenendo il valore della proprietà Text .

Offre anche molte delle stesse opzioni di formattazione per personalizzare il rendering del testo. Anche se puoi inserire interruzioni di riga nel testo, TextBlock è progettato per visualizzare un singolo paragrafo e non supporta il rientro del testo.

Usare RichTextBlock quando è necessario il supporto per più paragrafi, testo a più colonne o altri layout di testo complessi o elementi dell'interfaccia utente in linea, ad esempio, immagini. RichTextBlock offre diverse funzionalità per il layout di testo avanzato.

La proprietà contenuto di RichTextBlock è la proprietà Blocchi, che supporta il testo basato su paragrafo tramite l'elemento Paragrafo. Non dispone di una proprietà Testo che è possibile usare per accedere facilmente al contenuto di testo del controllo nell'app.

Input di testo

Usa un controllo TextBox per consentire a un utente di immettere e modificare testo non formattato, ad esempio in un modulo. Puoi usare la proprietà Text per recuperare e impostare il testo in un controllo TextBox.

Puoi impostare un controllo TextBox di sola lettura, ma questo stato dovrebbe essere temporaneo e condizionale. Se il testo non è mai modificabile, prendere in considerazione l'uso di un controllo TextBlock.

Usa un controllo PasswordBox per raccogliere password o altri dati privati, come un codice fiscale. Una casella della password è una casella di input di testo che nasconde i caratteri digitati per motivi di privacy. Ha l'aspetto di una casella di input di testo, con la differenza che visualizza pallini al posto del testo immesso. Il carattere punto elenco può essere personalizzato.

Usare un controllo AutoSuggestBox per mostrare all'utente un elenco di suggerimenti tra cui scegliere durante la digitazione. Una casella di suggerimento automatico è una casella di immissione di testo che attiva un elenco di suggerimenti di ricerca di base. I termini suggeriti possono trarre da una combinazione di termini di ricerca popolari e termini cronologici immessi dall'utente.

È anche consigliabile usare un controllo AutoSuggestBox per implementare una casella di ricerca.

Utilizzare un controllo RichEditBox per visualizzare e modificare i file di testo. Non usi un controllo RichEditBox per ottenere l'input dell'utente nella tua app nel modo in cui usi altre caselle di input di testo standard. Piuttosto è possibile usarlo per lavorare con file di testo separati dall'app. In genere il testo immesso in un RichEditBox viene salvato in un file .rtf.

L'input di testo è l'opzione migliore?

Esistono molti modi per ottenere l'input dell'utente nell'app. Queste domande consentiranno di rispondere se una delle caselle di input di testo standard o un altro controllo è la scelta migliore per ottenere l'input dell'utente.

  • È pratico enumerare in modo efficiente tutti i valori validi? In tal caso, è consigliabile usare uno dei controlli di selezione, ad esempio una casella di controllo, un elenco a discesa, una casella di riepilogo, un pulsante di opzione, un dispositivo di scorrimento, un interruttore, una selezione data o una selezione ora.
  • Esiste un set abbastanza piccolo di valori validi? In tal caso, prendere in considerazione un elenco a discesa o una casella di riepilogo, soprattutto se i valori sono più lunghi di alcuni caratteri.
  • I dati validi non sono completamente vincolati? Oppure i dati validi sono vincolati solo dal formato (tipi di caratteri o lunghezza vincolata)? In tal caso, usare un controllo di input di testo. È possibile limitare il numero di caratteri che è possibile immettere ed è possibile convalidare il formato nel codice dell'app.
  • Il valore rappresenta un tipo di dati con un controllo comune specializzato? In tal caso, usare il controllo appropriato anziché un controllo di input di testo. Ad esempio, usare un controllo DatePicker anziché un controllo di input di testo per accettare una voce di data.
  • Se i dati sono rigorosamente numerici:
    • Il valore immesso è approssimativo e/o relativo a un'altra quantità nella stessa pagina? In tal caso, usare un dispositivo di scorrimento.
    • L'utente può trarre vantaggio dal feedback immediato sull'effetto delle modifiche all'impostazione? In tal caso, usare un dispositivo di scorrimento, possibilmente con un controllo associato.
    • È probabile che il valore immesso venga regolato dopo l'osservazione del risultato, ad esempio con volume o luminosità dello schermo? In tal caso, usare un dispositivo di scorrimento.

Esempi

Raccolta WinUI 2
Raccolta WinUI

Se è installata l'app WinUI 2 Gallery , fare clic qui per aprire l'app e visualizzare i controlli di testo in azione.

Casella di testo

Una casella di testo

Casella di suggerimento automatico

Esempio del controllo di suggerimento automatico espanso

Casella password

Stato di focus della casella della password mentre si digita il testo

Creare un controllo di testo

Vedi questi articoli per informazioni ed esempi specifici per ogni controllo di testo.

Linee guida relative a tipi di carattere e stile

Vedere questi articoli per le linee guida per i tipi di carattere:

Input penna

Si applica a: TextBox, RichEditBox, AutoSuggestBox (solo UWP)

A partire da Windows 10, versione 1803, le caselle di input di testo XAML includono il supporto incorporato per l'input penna con Windows Ink. Quando un utente tocca una casella di input di testo usando una penna di Windows, la casella di testo si trasforma per consentire all'utente di scrivere direttamente in essa con una penna, anziché aprire un pannello di input separato.

Per altre info, vedi Input di testo con la visualizzazione grafia.

Scegliere la tastiera giusta per il controllo di testo

Si applica a: TextBox, PasswordBox RichEditBox

Per aiutare gli utenti a immettere dati con la tastiera virtuale, o SIP (Soft Input Panel), puoi impostare l'ambito di input del controllo di testo in modo che corrisponda al tipo di dati che l'utente deve immettere.

Suggerimento Queste informazioni si applicano solo al SIP. Non si applica alle tastiere hardware o alla tastiera su schermo disponibile nelle opzioni Accessibilità di Windows.

La tastiera touch può essere usata per l'inserimento di testo quando l'app viene eseguita su un dispositivo con un touchscreen. La tastiera virtuale viene richiamata quando l'utente tocca un campo di input modificabile, ad esempio un controllo TextBox o RichEditBox. È possibile facilitare e velocizzare notevolmente l'immissione dei dati nell'app impostando l'ambito di input del controllo di testo in base al tipo di dati che si prevede che l'utente immetta. L'ambito di input fornisce un suggerimento al sistema sul tipo di input di testo previsto dal controllo in modo che il sistema possa fornire un layout di tastiera touch specializzato per il tipo di input.

Ad esempio, se una casella di testo viene usata solo per immettere un PIN di 4 cifre, imposta la proprietà InputScope su Number. Questo indica al sistema di visualizzare il layout del tastierino numerico, che semplifica l'immissione del PIN da parte dell'utente.

Importante
L'ambito di input non consente di eseguire nessuna convalida di input e non impedisce all'utente di fornire input mediante tastiera hardware o altri dispositivi di input. Sei ancora responsabile della convalida dell'input nel tuo codice quando necessario.

Per altre info, vedi Usare l'ambito di input per modificare la tastiera virtuale.

Tipi di carattere a colori

Si applica a: TextBlock, RichTextBlock, TextBox, RichEditBox

Windows ha la possibilità di includere più livelli colorati per ogni glifo. Ad esempio, il tipo di carattere Segoe UI Emoji definisce le versioni dei colori di Emoticon e di altri caratteri Emoji.

I controlli standard e RTF supportano i tipi di carattere a colori di visualizzazione. Per impostazione predefinita, la proprietà IsColorFontEnabled è true e il rendering dei tipi di carattere con questi livelli aggiuntivi viene eseguito a colori. Il carattere di colore predefinito nel sistema è Segoe UI Emoji e i controlli eseguiranno il fallback a questo tipo di carattere per visualizzare i glifi a colori.

<TextBlock FontSize="30">Hello ☺⛄☂♨⛅</TextBlock>

Il testo di cui è stato eseguito il rendering è simile al seguente:

Blocco di testo con tipo di carattere a colori

Per altre info, vedi la proprietà IsColorFontEnabled .

Linee guida per i separatori di riga e paragrafo

Si applica a: TextBlock, RichTextBlock, TextBox a più righe, RichEditBox

Usare il carattere separatore di riga (0x2028) e il carattere separatore di paragrafo (0x2029) per dividere il testo normale. Dopo ogni separatore di riga viene avviata una nuova riga. Dopo ogni separatore di paragrafo viene avviato un nuovo paragrafo.

Non è necessario iniziare la prima riga o il paragrafo in un file con questi caratteri o per terminare l'ultima riga o paragrafo con essi; in questo modo indica che è presente una riga o un paragrafo vuoto in tale posizione.

L'app può usare il separatore di riga per indicare una fine non condizionale della riga. Tuttavia, i separatori di riga non corrispondono ai caratteri di ritorno a capo e avanzamento riga separati o a una combinazione di questi caratteri. I separatori di riga devono essere elaborati separatamente dai caratteri di ritorno a capo e avanzamento riga.

L'app può inserire un separatore di paragrafo tra paragrafi di testo. L'uso di questo separatore consente la creazione di file di testo normale che possono essere formattati con larghezze di riga diverse in sistemi operativi diversi. Il sistema di destinazione può ignorare tutti i separatori di riga e interrompere i paragrafi solo nei separatori di paragrafo.

Linee guida per il controllo ortografico

Si applica a: TextBox, RichEditBox

Durante l'immissione e la modifica del testo, il controllo ortografico informa l'utente che una parola viene digitata correttamente evidenziandola con una sottolineatura rossa ondulata e consente all'utente di correggere l'ortografia.

Ecco un esempio del correttore ortografico predefinito:

correttore ortografico predefinito

Usare il controllo ortografico con i controlli di input di testo per questi due scopi:

  • Per correggere automaticamente gli errori di ortografia

    Il motore di controllo ortografico corregge automaticamente le parole con errori di ortografia quando è sicuro della correzione. Ad esempio, il motore cambia automaticamente "the" in "the".

  • Per visualizzare ortografie alternative

    Quando il motore di controllo ortografico non è sicuro delle correzioni, aggiunge una linea rossa sotto la parola digitata e visualizza le alternative in un menu di scelta rapida quando si tocca o si fa clic con il pulsante destro del mouse sulla parola.

  • Usare il controllo ortografico per consentire agli utenti di immettere parole o frasi in controlli di input di testo. Il controllo ortografico funziona con input tocco, mouse e tastiera.

  • Non usare il controllo ortografico quando è improbabile che una parola si trova nel dizionario o se gli utenti non valorirebbero il controllo ortografico. Ad esempio, non attivarla se la casella di testo è destinata a acquisire un numero di telefono o un nome.

  • Non disabilitare il controllo ortografico solo perché il motore di controllo ortografico corrente non supporta la lingua dell'app. Quando il correttore ortografico non supporta una lingua, non esegue alcuna operazione, quindi non c'è alcun danno a lasciare l'opzione. Inoltre, alcuni utenti potrebbero usare un IME (Input Method Editor) per immettere un'altra lingua nell'app e tale lingua potrebbe essere supportata. Ad esempio, quando si compila un'app per la lingua giapponese, anche se il motore di controllo ortografico potrebbe non riconoscere la lingua corrente, non disattivare il controllo ortografico. L'utente può passare a un IME inglese e digitare inglese nell'app; se il controllo ortografico è abilitato, l'inglese riceverà il controllo ortografico.

Per i controlli TextBox e RichEditBox, il controllo ortografico è attivato per impostazione predefinita. È possibile disattivarla impostando la proprietà IsSpellCheckEnabled su false.

Per progettisti

Per sviluppatori (XAML)

  • Last updated on