Interazioni tramite tastieraKeyboard interactions

banner di tastiera

Scopri come progettare e ottimizzare le tue app di Windows in modo che forniscano la migliore esperienza possibile sia per gli utenti esperti di tastiera che per quelli con disabilità e altri requisiti di accessibilità.Learn how to design and optimize your Windows apps so they provide the best experience possible for both keyboard power users and those with disabilities and other accessibility requirements.

Tra i dispositivi, l'input da tastiera è una parte importante dell'esperienza complessiva di interazione delle app Windows.Across devices, keyboard input is an important part of the overall Windows app interaction experience. Un'esperienza di tastiera ben progettata consente agli utenti di spostarsi in modo efficiente nell'interfaccia utente dell'app e di accedere alle funzionalità complete senza mai sollevare le mani dalla tastiera.A well-designed keyboard experience lets users efficiently navigate the UI of your app and access its full functionality without ever lifting their hands from the keyboard.

immagine della tastiera e del gamepad

*I modelli di interazione comuni sono condivisi tra tastiera e Gamepad _*Common interaction patterns are shared between keyboard and gamepad _

Questo argomento è incentrato specificamente sulla progettazione di app Windows per l'input da tastiera nei PC.In this topic, we focus specifically on Windows app design for keyboard input on PCs. Tuttavia, un'esperienza di tastiera ben progettata è importante per supportare gli strumenti di accessibilità, come assistente vocale di Windows, usando tastiere software come la tastiera touch e la tastiera su schermo (OSK) e per la gestione di altri tipi di dispositivi di input, ad esempio Xbox gamepad e controllo remoto.However, a well-designed keyboard experience is important for supporting accessibility tools such as Windows Narrator, using software keyboards such as the touch keyboard and the On-Screen Keyboard (OSK), and for handling other input device types, such as the Xbox gamepad and remote control.

Molte delle linee guida e dei consigli illustrati in questo articolo, inclusi gli oggetti visivi dello stato attivo, le chiavi di accessoe la navigazione dell'interfaccia utente, sono applicabili anche a questi scenari.Many of the guidelines and recommendations discussed here, including focus visuals, access keys, and UI navigation, are also applicable to these other scenarios.

_ Nota * anche se per l'input di testo vengono usate sia tastiere hardware che software, l'obiettivo di questo argomento è l'esplorazione e l'interazione._ NOTE * While both hardware and software keyboards are used for text input, the focus of this topic is navigation and interaction.

Supporto incorporatoBuilt-in support

Insieme al mouse, la tastiera è la periferica più utilizzata nei PC e, di conseguenza, costituisce una parte fondamentale dell'esperienza del computer.Along with the mouse, the keyboard is the most widely used peripheral on PCs and, as such, is a fundamental part of the PC experience. Gli utenti del PC si aspettano un'esperienza completa e coerente sia dal sistema che dalle singole app in risposta all'input da tastiera.PC users expect a comprehensive and consistent experience from both the system and individual apps in response to keyboard input.

Tutti i controlli UWP includono il supporto incorporato per le esperienze di tastiera avanzate e le interazioni con gli utenti, mentre la piattaforma stessa fornisce una base completa per la creazione di esperienze di tastiera che si ritiene siano più adatte sia ai controlli personalizzati che alle app.All UWP controls include built-in support for rich keyboard experiences and user interactions, while the platform itself provides an extensive foundation for creating keyboard experiences that you feel are best suited to both your custom controls and apps.

tastiera con immagine del telefono

*UWP supporta la tastiera con qualsiasi dispositivo _*UWP supports keyboard with any device _

Esperienze di baseBasic experiences

Dispositivi basati sullo stato attivo

Come indicato in precedenza, i dispositivi di input come Xbox gamepad e il controllo remoto e gli strumenti di accessibilità come assistente vocale condividono gran parte dell'esperienza di input da tastiera per la navigazione e i comandi.As mentioned previously, input devices such as the Xbox gamepad and remote control, and accessibility tools such as Narrator, share much of the keyboard input experience for navigation and commanding. Questa esperienza comune tra i tipi di input e gli strumenti riduce al minimo il lavoro aggiuntivo e contribuisce all'obiettivo "compilazione unica, esecuzione ovunque" del piattaforma UWP (Universal Windows Platform).This common experience across input types and tools minimizes additional work from you and contributes to the "build once, run anywhere" goal of the Universal Windows Platform.

Laddove necessario, verranno identificate le differenze principali da tenere presenti e verranno descritte le mitigazioni da prendere in considerazione.Where necessary, we'll identify key differences you should be aware of and describe any mitigations you should consider.

Ecco i dispositivi e gli strumenti descritti in questo argomento:Here are the devices and tools discussed in this topic:

Dispositivo/strumentoDevice/tool DescrizioneDescription
Tastiera (hardware e software)Keyboard (hardware and software) Oltre alla tastiera hardware standard, le applicazioni Windows supportano due tastiere software: la tastiera touch (o software) e la tastiera sullo schermo.In addition to the standard hardware keyboard, Windows applications support two software keyboards: the touch (or software) keyboard and the On-Screen Keyboard.
Game pad e telecomandoGamepad and remote control Xbox gamepad e controllo remoto sono dispositivi di input fondamentali nell' esperienza a 10 piedi.The Xbox gamepad and remote control are fundamental input devices in the 10-foot experience. Per informazioni dettagliate sul supporto di Windows per gamepad e controllo remoto, vedere Gamepad e interazioni di controllo remoto.For specific details on Windows support for gamepad and remote control, see Gamepad and remote control interactions.
Utilità per la lettura dello schermo (Assistente vocale)Screen readers (Narrator) Assistente vocale è un lettore di schermate incorporato per Windows che offre esperienze e funzionalità di interazione univoche, ma si basa ancora sull'input e sulla navigazione da tastiera di base.Narrator is a built-in screen reader for Windows that provides unique interaction experiences and functionality, but still relies on basic keyboard navigation and input. Per informazioni dettagliate sull'Assistente vocale, vedere Introduzione a Assistente vocale.For Narrator details, see Getting started with Narrator.

Esperienze personalizzate e un'efficace lavagnaCustom experiences and efficient keyboarding

Come indicato in precedenza, il supporto della tastiera è fondamentale per garantire che le applicazioni funzionino in modo ideale per gli utenti con competenze, capacità e aspettative differenti.As mentioned, keyboard support is integral to ensuring your applications work great for users with different skills, abilities, and expectations. È consigliabile assegnare una priorità ai seguenti elementi.We recommend that you prioritize the following.

  • Supportare la navigazione da tastiera e l'interazioneSupport keyboard navigation and interaction
    • Verificare che gli elementi che possono essere attivati siano identificati come arresti tabulari (e che non siano elementi non utilizzabili) e che l'ordine di navigazione sia logico e prevedibile (vedere Tab Stops)Ensure actionable items are identified as tab stops (and non-actionable items are not), and navigation order is logical and predictable (see Tab stops)
    • Imposta lo stato attivo iniziale sull'elemento più logico (vedere lo stato attivo iniziale)Set initial focus on the most logical element (see Initial focus)
    • Fornire la navigazione del tasto di direzione per "spostamenti interni" (vedere navigazione).Provide arrow key navigation for "inner navigations" (see Navigation)
  • Supporto tasti di scelta rapidaSupport keyboard shortcuts
    • Fornire tasti di scelta rapida per azioni rapide (vedere acceleratori)Provide accelerator keys for quick actions (see Accelerators)
    • Fornire le chiavi di accesso per spostarsi nell'interfaccia utente dell'applicazione (vedere chiavi di accesso)Provide access keys to navigate your application's UI (see Access keys)

Oggetti visivi dello stato attivoFocus visuals

UWP supporta un'unica progettazione visiva dello stato attivo che funziona bene per tutti i tipi di input e le esperienze.The UWP supports a single focus visual design that works well for all input types and experiences. Indicatore visivo dello stato attivoFocus visual

Oggetto visivo dello stato attivo:A focus visual:

  • Viene visualizzato quando un elemento dell'interfaccia utente riceve lo stato attivo da una tastiera e/o da Gamepad/controllo remotoIs shown when a UI element receives focus from a keyboard and/or gamepad/remote control
  • Viene sottoposto a rendering come bordo evidenziato intorno all'elemento dell'interfaccia utente per indicare che può essere eseguita un'azioneIs rendered as a highlighted border around the UI element to indicate an action can be taken
  • Consente a un utente di spostarsi nell'interfaccia utente di un'app senza perdersiHelps a user navigate an app UI without getting lost
  • Può essere personalizzato per l'app (vedere gli oggetti visivi dello stato attivo con visibilità elevata)Can be customized for your app (See High visibility focus visuals)

_ Nota * l'oggetto visivo UWP focus non corrisponde al rettangolo di attivazione dell'Assistente vocale._ NOTE * The UWP focus visual is not the same as the Narrator focus rectangle.

TabulazioniTab stops

Per usare un controllo (inclusi gli elementi di navigazione) con la tastiera, il controllo deve avere lo stato attivo.To use a control (including navigation elements) with the keyboard, the control must have focus. Uno dei modi in cui un controllo può ricevere lo stato attivo è renderlo accessibile tramite la navigazione tramite tabulazione identificando il tasto TAB nell'ordine di tabulazione dell'applicazione.One way for a control to receive keyboard focus is to make it accessible through tab navigation by identifying it as a tab stop in your application's tab order.

Per includere un controllo nell'ordine di tabulazione, la proprietà IsEnabled deve essere impostata su true e la proprietà IsTabStop deve essere impostata su true .For a control to be included in the tab order, the IsEnabled property must be set to true and the IsTabStop property must be set to true .

Per escludere in modo specifico un controllo dall'ordine di tabulazione, impostare la proprietà IsTabStop su false .To specifically exclude a control from the tab order, set the IsTabStop property to false .

Per impostazione predefinita, l'ordine di tabulazione riflette l'ordine in cui vengono creati gli elementi dell'interfaccia utente.By default, tab order reflects the order in which UI elements are created. Se, ad esempio, un oggetto StackPanel contiene un oggetto, Button un oggetto Checkbox e un oggetto TextBox , l'ordine di tabulazione è Button , Checkbox e TextBox .For example, if a StackPanel contains a Button, a Checkbox, and a TextBox, tab order is Button, Checkbox, and TextBox.

È possibile eseguire l'override dell'ordine di tabulazione predefinito impostando la proprietà TabIndex .You can override the default tab order by setting the TabIndex property.

L'ordine di tabulazione deve essere logico e prevedibileTab order should be logical and predictable

Un modello di navigazione da tastiera ben progettato, usando un ordine di tabulazione logico e prevedibile, rende l'app più intuitiva e consente agli utenti di esplorare, individuare e accedere alle funzionalità in modo più efficiente ed efficace.A well-designed keyboard navigation model, using a logical and predictable tab order, makes your app more intuitive and helps users explore, discover, and access functionality more efficiently and effectively.

Tutti i controlli interattivi devono avere tabulazioni, a meno che non si trovino in un gruppo, mentre i controlli non interattivi, ad esempio le etichette, non dovrebbero.All interactive controls should have tab stops (unless they are in a group), while non-interactive controls, such as labels, should not.

Evitare un ordine di tabulazione personalizzato che consente di spostarsi all'interno dell'applicazione.Avoid a custom tab order that makes the focus jump around in your application. Ad esempio, un elenco di controlli in un modulo deve avere un ordine di tabulazione che scorre dall'alto verso il basso e da sinistra a destra (a seconda delle impostazioni locali).For example, a list of controls in a form should have a tab order that flows from top to bottom and left to right (depending on locale).

Per ulteriori informazioni sulla personalizzazione delle tabulazioni, vedere accessibilità tastiera .See Keyboard accessibility for more details about customizing tab stops.

Provare a coordinare l'ordine di tabulazione e gli elementi visiviTry to coordinate tab order and visual order

Il coordinamento dell'ordine di tabulazione e dell'ordine di visualizzazione (noto anche come ordine di lettura o di visualizzazione) consente di ridurre la confusione per gli utenti mentre esplorano l'interfaccia utente dell'applicazione.Coordinating tab order and visual order (also referred to as reading order or display order) helps reduce confusion for users as they navigate through your application's UI.

Provare a classificare e presentare prima i comandi, i controlli e i contenuti più importanti sia nell'ordine di tabulazione sia nell'ordine visivo.Try to rank and present the most important commands, controls, and content first in both the tab order and the visual order. La posizione di visualizzazione effettiva dipende tuttavia dal contenitore padre del layout e da alcune proprietà degli elementi figlio che influenzano il layout.However, the actual display position can depend on the parent layout container and certain properties of the child elements that influence the layout. In particolare, i layout che usano una metafora della griglia o una metafora della tabella possono avere un ordine visivo piuttosto diverso dall'ordine di tabulazione.Specifically, layouts that use a grid metaphor or a table metaphor can have a visual order quite different from the tab order.

Nota L'ordine visivo dipende anche dalle impostazioni locali e dalla lingua.NOTE Visual order is also dependent on locale and language.

Stato attivo inizialeInitial focus

Lo stato attivo iniziale specifica l'elemento dell'interfaccia utente che riceve lo stato attivo quando un'applicazione o una pagina viene avviata o attivata per la prima volta.Initial focus specifies the UI element that receives focus when an application or a page is first launched or activated. Quando si usa una tastiera, è da questo elemento che un utente inizia a interagire con l'interfaccia utente dell'applicazione.When using a keyboard, it is from this element that a user starts interacting with your application's UI.

Per le app UWP, lo stato attivo iniziale è impostato sull'elemento con il TabIndex più alto che può ricevere lo stato attivo.For UWP apps, initial focus is set to the element with the highest TabIndex that can receive focus. Gli elementi figlio dei controlli contenitore vengono ignorati.Child elements of container controls are ignored. In una cravatta, il primo elemento della struttura ad albero visuale riceve lo stato attivo.In a tie, the first element in the visual tree receives focus.

Imposta lo stato attivo iniziale sull'elemento più logicoSet initial focus on the most logical element

Impostare lo stato attivo iniziale sull'elemento dell'interfaccia utente per la prima o la principale azione che gli utenti hanno più probabilità di eseguire quando si avvia l'app o si passa a una pagina.Set initial focus on the UI element for the first, or primary, action that users are most likely to take when launching your app or navigating to a page. Di seguito sono riportati alcuni esempi:Some examples include:

  • App Foto in cui lo stato attivo è impostato sul primo elemento in una raccoltaA photo app where focus is set to the first item in a gallery
  • App musicale in cui lo stato attivo è impostato sul pulsante RiproduciA music app where focus is set to the play button

Non impostare lo stato attivo iniziale su un elemento che espone un risultato potenzialmente negativo o addirittura disastrosoDon't set initial focus on an element that exposes a potentially negative, or even disastrous, outcome

Questo livello di funzionalità deve essere la scelta di un utente.This level of functionality should be a user's choice. L'impostazione dello stato attivo iniziale su un elemento con un risultato significativo può comportare la perdita di dati indesiderata o l'accesso al sistema.Setting initial focus to an element with a significant outcome might result in unintended data loss or system access. Ad esempio, non impostare lo stato attivo sul pulsante Elimina durante l'esplorazione di un messaggio di posta elettronica.For example, don't set focus to the delete button when navigating to an e-mail.

Per ulteriori informazioni sull'override dell'ordine di tabulazione, vedere spostamento dello stato attivo .See Focus navigation for more details about overriding tab order.

La navigazione tramite tastiera è in genere supportata tramite i tasti TAB e i tasti di direzione.Keyboard navigation is typically supported through the Tab keys and the Arrow keys.

tasti di direzione e tabulazione

Per impostazione predefinita, i controlli UWP seguono questi comportamenti di base della tastiera:By default, UWP controls follow these basic keyboard behaviors:

  • I tasti di tabulazione passano tra i controlli attivabili/attivi in ordine di tabulazione.Tab keys navigate between actionable/active controls in tab order.
  • MAIUSC + TAB consente di spostarsi tra i controlli nell'ordine di tabulazione inversa.Shift + Tab navigate controls in reverse tab order. Se l'utente si è spostato all'interno del controllo utilizzando il tasto freccia, lo stato attivo viene impostato sull'ultimo valore noto all'interno del controllo.If user has navigated inside the control using arrow key, focus is set to the last known value inside the control.
  • I tasti di direzione espongono una "navigazione interna" specifica del controllo quando l'utente immette "spostamento interno", i tasti di direzione non si spostano all'esterno di un controllo.Arrow keys expose control-specific "inner navigation" When user enters "inner navigation,"" arrow keys do not navigate out of a control. Di seguito sono riportati alcuni esempi:Some examples include:
    • Il tasto freccia su/giù consente di spostare lo stato attivo all'interno ListView e MenuFlyoutUp/Down arrow key moves focus inside ListView and MenuFlyout
    • Modificare i valori attualmente selezionati per Slider e RatingsControlModify currently selected values for Slider and RatingsControl
    • Sposta punto di inserimento all'interno TextBoxMove caret inside TextBox
    • Espandi/Comprimi elementi all'interno TreeViewExpand/collapse items inside TreeView

Usare questi comportamenti predefiniti per ottimizzare la navigazione da tastiera dell'applicazione.Use these default behaviors to optimize your application's keyboard navigation.

La navigazione con i tasti di direzione in un set di controlli correlati rafforza la relazione all'interno dell'organizzazione complessiva dell'interfaccia utente dell'applicazione.Providing arrow key navigation into a set of related controls reinforces their relationship within the overall organization of your application's UI.

Ad esempio, il ContentDialog controllo riportato di seguito fornisce la navigazione interna per impostazione predefinita per una riga orizzontale di pulsanti (per i controlli personalizzati, vedere la sezione gruppo di controllo ).For example, the ContentDialog control shown here provides inner navigation by default for a horizontal row of buttons (for custom controls, see the Control Group section).

esempio di finestra di dialogo

*L'interazione con una raccolta di pulsanti correlati è semplificata con la navigazione con il tasto freccia _*Interaction with a collection of related buttons is made easier with arrow key navigation _

Se gli elementi vengono visualizzati in una singola colonna, il tasto freccia su/giù consente di spostarsi tra gli elementi.If items are displayed in a single column, Up/Down arrow key navigates items. Se gli elementi vengono visualizzati in una singola riga, il tasto freccia destra/sinistra consente di spostarsi tra gli elementi.If items are displayed in a single row, Right/Left arrow key navigates items. Se gli elementi sono più colonne, tutti e quattro i tasti di direzione vengono spostati.If items are multiple columns, all 4 arrow keys navigate.

Definendo una singola tabulazione per una raccolta di controlli correlati o complementari, è possibile ridurre al minimo il numero di arresti tabulari generali nell'app.By defining a single tab stop for a collection of related, or complementary, controls, you can minimize the number of overall tab stops in your app.

Ad esempio, le immagini seguenti mostrano due controlli in pila ListView .For example, the following images show two stacked ListView controls. L'immagine a sinistra mostra la navigazione del tasto di direzione utilizzata con una tabulazione per spostarsi tra ListView i controlli, mentre l'immagine a destra Mostra come la navigazione tra gli elementi figlio possa essere resa più semplice ed efficiente eliminando la necessità di attraversare i controlli padre con un tasto TAB.The image on the left shows arrow key navigation used with a tab stop to navigate between ListView controls, while the image on the right shows how navigation between child elements could be made easier and more efficient by eliminating the need for to traverse parent controls with a tab key.

arrow and tab arrow only

L'interazione con due controlli ListView in pila può essere resa più semplice ed efficiente eliminando la tabulazione e navigando con solo i tasti di direzione.Interaction with two stacked ListView controls can be made easier and more efficient by eliminating the tab stop and navigating with just arrow keys.

Vedere la sezione del gruppo di controllo per informazioni su come applicare gli esempi di ottimizzazione all'interfaccia utente dell'applicazione.Visit Control Group section to learn how to apply the optimization examples to your application UI.

Interazione e comandoInteraction and commanding

Quando un controllo ha lo stato attivo, un utente può interagire con esso e richiamare qualsiasi funzionalità associata usando un input di tastiera specifico.Once a control has focus, a user can interact with it and invoke any associated functionality using specific keyboard input.

Voce di testoText entry

Per i controlli progettati specificamente per l'input di testo, ad esempio TextBox e RichEditBox , viene usato tutto l'input da tastiera per l'immissione o l'esplorazione del testo, che ha la priorità rispetto agli altri comandi della tastiera.For those controls specifically designed for text input such as TextBox and RichEditBox, all keyboard input is used for entering or navigating text, which takes priority over other keyboard commands. Il menu a discesa di un controllo, ad esempio, AutoSuggestBox non riconosce il tasto _ Space * come comando di selezione.For example, the drop down menu for an AutoSuggestBox control does not recognize the _ Space * key as a selection command.

immissione testo

Chiave spazioSpace key

Quando non è in modalità immissione testo, la chiave dello spazio richiama l'azione o il comando associato al controllo con stato attivo (come un tocco con tocco o con un clic del mouse).When not in text entry mode, the Space key invokes the action or command associated with the focused control (just like a tap with touch or a click with a mouse).

chiave spazio

INVIO (tasto)Enter key

Il tasto invio può eseguire un'ampia gamma di interazioni utente comuni, a seconda del controllo con lo stato attivo:The Enter key can perform a variety of common user interactions, depending on the control with focus:

  • Attiva i controlli comando, ad esempio Button o Hyperlink .Activates command controls such as a Button or Hyperlink. Per evitare confusione con l'utente finale, il tasto invio attiva anche i controlli che hanno un aspetto simile a quello dei comandi, ad esempio ToggleButton o AppBarToggleButton .To avoid end user confusion, the Enter key also activates controls that look like command controls such as ToggleButton or AppBarToggleButton.
  • Visualizza l'interfaccia utente di selezione per i controlli, ad esempio ComboBox e DatePicker .Displays the picker UI for controls such as ComboBox and DatePicker. Il tasto invio viene inoltre eseguito il commit e la chiusura dell'interfaccia utente di selezione.The Enter key also commits and closes the picker UI.
  • Attiva i controlli elenco, ad esempio ListView , GridView e ComboBox .Activates list controls such as ListView, GridView, and ComboBox.
    • Il tasto invio esegue l'azione di selezione come chiave dello spazio per gli elementi elenco e griglia, a meno che non vi sia un'azione aggiuntiva associata a questi elementi (aprendo una nuova finestra).The Enter key performs the selection action as the Space key for list and grid items, unless there is an additional action associated with these items (opening a new window).
    • Se al controllo è associata un'azione aggiuntiva, il tasto invio esegue l'azione aggiuntiva e la chiave dello spazio esegue l'azione di selezione.If an additional action is associated with the control, the Enter key performs the additional action and the Space key performs the selection action.

Nota Il tasto invio e la chiave dello spazio non sempre eseguono la stessa azione, ma spesso.NOTE The Enter key and Space key do not always perform the same action, but often do.

Immettere il tasto

Il tasto ESC consente a un utente di annullare l'interfaccia utente temporanea, insieme alle eventuali azioni in corso nell'interfaccia utente.The Esc key lets a user cancel transient UI (along with any ongoing actions in that UI).

Di seguito sono riportati alcuni esempi di questa esperienza:Examples of this experience include:

  • L'utente apre un oggetto ComboBox con un valore selezionato e usa i tasti di direzione per spostare la selezione dello stato attivo su un nuovo valore.User opens a ComboBox with a selected value and uses the arrow keys to move the focus selection to a new value. Premendo il tasto ESC si chiude il ComboBox e si reimposta nuovamente il valore selezionato sul valore originale.Pressing the Esc key closes the ComboBox and resets the selected value back to the original value.
  • L'utente richiama un'azione di eliminazione permanente per un messaggio di posta elettronica e viene richiesto un oggetto ContentDialog per confermare l'azione.User invokes a permanent delete action for an email and is prompted with a ContentDialog to confirm the action. L'utente decide che non si tratta dell'azione desiderata e preme il tasto ESC per chiudere la finestra di dialogo.The user decides this is not the intended action and presses the Esc key to close the dialog. Poiché il tasto ESC è associato al pulsante Annulla , la finestra di dialogo viene chiusa e l'azione viene annullata.As the Esc key is associated with the Cancel button, the dialog is closed and the action is canceled. Il tasto ESC influisce solo sull'interfaccia utente temporanea, non si chiude o si sposta all'interno dell'interfaccia utente dell'app.The Esc key only affects transient UI, it does not close, or back navigate through, app UI.

Tasto ESC

Tasti home o fineHome and End keys

Le chiavi Home e end consentono a un utente di scorrere fino all'inizio o alla fine di un'area dell'interfaccia utente.The Home and End keys let a user scroll to the beginning or end of a UI region.

Di seguito sono riportati alcuni esempi di questa esperienza:Examples of this experience include:

  • Per ListView i GridView controlli e, il tasto Home sposta lo stato attivo sul primo elemento e lo scorre nella visualizzazione, mentre il tasto fine sposta lo stato attivo sull'ultimo elemento e lo scorre nella visualizzazione.For ListView and GridView controls, the Home key moves focus to the first element and scrolls it into view, whereas the End key moves focus to the last element and scrolls it into view.
  • Per un ScrollView controllo, il tasto Home scorre alla parte superiore dell'area, mentre il tasto fine scorre fino alla parte inferiore dell'area (lo stato attivo non viene modificato).For a ScrollView control, the Home key scrolls to the top of the region, whereas the End key scrolls to the bottom of the region (focus is not changed).

chiavi Home e fine

PGSU e PGGIÙPage up and Page down keys

I tasti di pagina consentono a un utente di scorrere un'area dell'interfaccia utente in incrementi discreti.The Page keys let a user scroll a UI region in discrete increments.

Per i ListView controlli e, ad esempio GridView , il tasto PGSU scorre l'area verso l'alto di una "pagina" (in genere l'altezza del viewport) e sposta lo stato attivo sulla parte superiore dell'area.For example, for ListView and GridView controls, the Page up key scrolls the region up by a "page" (typically the viewport height) and moves focus to the top of the region. In alternativa, il tasto PGGIÙ scorre l'area verso il basso di una pagina e sposta lo stato attivo nella parte inferiore dell'area.Alternately, the Page down key scrolls the region down by a page and moves focus to the bottom of the region.

tasti PGSU e PGGIÙ

Tasti di scelta rapidaKeyboard shortcuts

Le scelte rapide da tastiera consentono di semplificare l'uso dell'app offrendo supporto avanzato per l'accessibilità e una migliore efficienza per gli utenti della tastiera.Keyboard shortcuts can make your app easier to use by providing both enhanced support for accessibility and improved efficiency for keyboard users.

Oltre a supportare la navigazione da tastiera e l'attivazione nell'app, è anche consigliabile fornire collegamenti per la funzionalità dell'applicazione.In addition to supporting keyboard navigation and activation in your app, it is also good practice to provide shortcuts for your application's functionality. La navigazione tramite TAB fornisce un buon livello di base del supporto della tastiera, ma con un'interfaccia utente più complessa è possibile aggiungere anche il supporto per i tasti di scelta rapida.Tab navigation provides a good, basic level of keyboard support, but with more complex UI you might want to add support for shortcut keys as well.

I tasti di scelta rapida sono combinazioni di tasti che consentono di migliorare la produttività offrendo agli utenti un modo efficiente per accedere alle funzionalità dell’app.A shortcut is a keyboard combination that enhances productivity by providing an efficient way for the user to access app functionality. Esistono due tipi di tasti di scelta rapida:There are two kinds of shortcut:

  • Gli acceleratori sono collegamenti che richiamano un comando dell'app.Accelerators are shortcuts that invoke an app command. L'app può fornire o meno un'interfaccia utente specifica che corrisponde al comando.Your app may or may not provide specific UI that corresponds to the command. Gli acceleratori sono in genere costituiti dal tasto CTRL più un tasto lettera.Accelerators typically consist of the Ctrl key plus a letter key.
  • Le chiavi di accesso sono collegamenti che consentono di impostare lo stato attivo su un'interfaccia utente specifica nell'applicazione.Access keys are shortcuts that set focus to specific UI in your application. Le chiavi di accesso tipiche sono costituite dal tasto ALT più un tasto lettera.Access keys typicaly consist of the Alt key plus a letter key.

Fornire scelte rapide da tastiera coerenti che supportano attività simili tra le applicazioni li rende molto più utili e potenti e consente agli utenti di ricordarli.Providing consistent keyboard shortcuts that support similar tasks across applications makes them much more useful and powerful and helps users remember them.

Tasti di scelta rapidaAccelerators

Gli acceleratori consentono agli utenti di eseguire azioni comuni in un'applicazione in modo molto più rapido ed efficiente.Accelerators help users perform common actions in an application much more quickly and efficiently.

Esempi di acceleratori:Examples of Accelerators:

  • Premendo CTRL + N Key in un punto qualsiasi dell'app di posta elettronica , viene avviato un nuovo elemento di posta elettronica.Pressing Ctrl + N key anywhere in the Mail app launches a new mail item.
  • Se si preme CTRL + E in un punto qualsiasi di Microsoft Edge (e molti Microsoft Store applicazioni) viene avviata la ricerca.Pressing Ctrl + E key anywhere in Microsoft Edge (and many Microsoft Store applications) launches search.

Gli acceleratori hanno le seguenti caratteristiche:Accelerators have the following characteristics:

  • Usano principalmente le sequenze di tasti CTRL e Function (i tasti di scelta rapida del sistema Windows usano anche tasti ALT + non alfanumerici e il tasto logo Windows).They primarily use Ctrl and Function key sequences (Windows system shortcut keys also use Alt + non-alphanumeric keys and the Windows logo key).
  • Vengono assegnati solo ai comandi usati più comunemente.They are assigned only to the most commonly used commands.
  • È previsto che vengano memorizzati e vengono documentati solo nei menu, nelle descrizioni comandi e nella Guida.They are intended to be memorized, and are documented only in menus, tooltips, and Help.
  • Hanno effetto nell'intera applicazione, se supportato.They have effect throughout the entire application, when supported.
  • Devono essere assegnati in modo coerente man mano che vengono memorizzati e non direttamente documentati.They should be assigned consistently as they are memorized and not directly documented.

Chiavi di accessoAccess keys

Per informazioni più dettagliate sul supporto delle chiavi di accesso con UWP, vedere la pagina relativa alle chiavi di accesso .See Access keys page for more in-depth information for supporting access keys with UWP.

Le chiavi di accesso consentono agli utenti con funzionalità motori di disabilità di utilizzare una chiave alla volta per eseguire un'azione su un elemento specifico nell'interfaccia utente.Access keys help users with motor function disabilities an ability to press one key at a time to action on a specific item in the UI. Inoltre, è possibile usare le chiavi di accesso per comunicare tasti di scelta rapida aggiuntivi per consentire agli utenti avanzati di eseguire rapidamente le azioni.Moreover, access keys can be used to communicate additional shortcut keys to help advanced users perform actions quickly.

I tasti di scelta presentano le caratteristiche seguenti:Access keys have the following characteristics:

  • Usano il tasto ALT e un tasto alfanumerico.They use the Alt key plus an alphanumeric key.
  • Servono principalmente per l'accessibilità.They are primarily for accessibility.
  • Sono documentati direttamente nell'interfaccia utente, adiacenti al controllo, tramite suggerimenti chiave.They are documented directly in the UI, adjacent to the control, through Key Tips.
  • Hanno effetto solo nella finestra corrente e passano alla voce di menu o al controllo corrispondente.They have effect only in the current window, and navigate to the corresponding menu item or control.
  • Le chiavi di accesso devono essere assegnate in modo coerente ai comandi di uso comune, in particolare i pulsanti di commit, quando possibile.Access keys should be assigned consistently to commonly used commands (especially commit buttons), whenever possible.
  • Vengono localizzati.They are localized.

Tasti di scelta rapida comuniCommon keyboard shortcuts

La tabella seguente è un piccolo esempio di scelte rapide da tastiera usate di frequente.The following table is a small sample of frequently used keyboard shortcuts.

AzioneAction Comando tramite tastoKey command
Seleziona tuttoSelect all CTRL+ACtrl+A
Selezione continuaContinuously select MAIUSC+frecciaShift+Arrow key
SalvaSave CTRL+SCtrl+S
FindFind CTRL+FCtrl+F
PrintPrint Ctrl+PCtrl+P
CopiaCopy CTRL+CCtrl+C
TagliaCut CTRL+XCtrl+X
IncollaPaste CTRL+VCtrl+V
AnnullaUndo CTRL+ZCtrl+Z
Scheda successivaNext tab CTRL+TABCtrl+Tab
Chiudi schedaClose tab CTRL + F4 o CTRL + WCtrl+F4 or Ctrl+W
Zoom semanticoSemantic zoom CTRL++ o CTRL+-Ctrl++ or Ctrl+-

Per un elenco completo dei collegamenti di sistema Windows, vedere tasti di scelta rapida per Windows.For a comprehensive list of Windows system shortcuts, see keyboard shortcuts for Windows. Per i collegamenti alle applicazioni comuni, vedere tasti di scelta rapida per le applicazioni Microsoft.For common application shortcuts, see keyboard shortcuts for Microsoft applications.

Esperienze avanzateAdvanced experiences

In questa sezione vengono illustrate alcune delle esperienze di interazione tra tastiera più complesse supportate dalle app UWP, oltre ad alcuni comportamenti che è necessario tenere presente quando l'app viene usata in dispositivi diversi e con strumenti diversi.In this section, we discuss some of the more complex keyboard interaction experiences supported by UWP apps, along with some of the behaviors you should be aware of when your app is used on different devices and with different tools.

Gruppo di controlloControl group

È possibile raggruppare un set di controlli correlati o complementari in un "gruppo di controllo" (o in un'area direzionale), che consente la "navigazione interna" tramite i tasti di direzione.You can group a set of related, or complementary, controls in a "control group" (or directional area), which enables "inner navigation" using the arrow keys. Il gruppo di controllo può essere costituito da una singola tabulazione oppure è possibile specificare più interruzioni di tabulazioni all'interno del gruppo di controlli.The control group can be a single tab stop, or you can specify multiple tab stops within the control group.

Navigazione con i tasti frecciaArrow key navigation

Gli utenti si aspettano il supporto per la navigazione con i tasti di direzione in presenza di un gruppo di controlli simili e correlati in un'area dell'interfaccia utente:Users expect support for arrow key navigation when there is a group of similar, related controls in a UI region:

  • AppBarButtons in un CommandBarAppBarButtons in a CommandBar
  • ListItems o GridItems all'interno ListView o GridViewListItems or GridItems inside ListView or GridView
  • Buttons dentro ContentDialogButtons inside ContentDialog

Per impostazione predefinita, i controlli UWP supportano la navigazione con i tasti di direzione.UWP controls support arrow key navigation by default. Per i layout personalizzati e i gruppi di controllo, usare XYFocusKeyboardNavigation="Enabled" per fornire un comportamento simile.For custom layouts and control groups, use XYFocusKeyboardNavigation="Enabled" to provide similar behavior.

È consigliabile aggiungere il supporto per la navigazione con i tasti di direzione quando si usano i controlli seguenti:Consider adding support for arrow key navigation when using the following controls:

Dialog buttons

Pulsanti di dialogoDialog buttons

Radio buttons

RadioButtonsRadioButtons

AppBar buttons

AppBarButtonsAppBarButtons

List and Grid items

ListItems e GridItemsListItems and GridItems

TabulazioniTab stops

A seconda delle funzionalità e del layout dell'applicazione, l'opzione di navigazione migliore per un gruppo di controllo potrebbe essere un singolo punto di tabulazione con spostamento freccia sugli elementi figlio, più tabulazioni o una combinazione.Depending on your application's functionality and layout, the best navigation option for a control group might be a single tab stop with arrow navigation to child elements, multiple tab stops, or some combination.

Usare più tabulazioni e tasti di direzione per i pulsantiUse multiple tab stops and arrow keys for buttons

Gli utenti di accessibilità utilizzano regole di navigazione da tastiera ben stabilite, che in genere non utilizzano tasti di direzione per spostarsi in una raccolta di pulsanti.Accessibility users rely on well-established keyboard navigation rules, which do not typically use arrow keys to navigate a collection of buttons. Tuttavia, gli utenti privi di problemi visivi potrebbero risentire che il comportamento è naturale.However, users without visual impairments might feel that the behavior is natural.

Un esempio di comportamento predefinito di UWP in questo caso è ContentDialog .An example of default UWP behavior in this case is the ContentDialog. Mentre è possibile usare i tasti di direzione per spostarsi tra i pulsanti, ogni pulsante è anche una tabulazione.While arrow keys can be used to navigate between buttons, each button is also a tab stop.

Assegnare una singola tabulazione a modelli di interfaccia utente familiariAssign single tab stop to familiar UI patterns

Nei casi in cui il layout segue un modello di interfaccia utente noto per i gruppi di controllo, l'assegnazione di una singola tabulazione al gruppo può migliorare l'efficienza di navigazione degli utenti.In cases where your layout follows a well-known UI pattern for control groups, assigning a single tab stop to the group can improve navigation efficiency for users.

Tra gli esempi sono inclusi:Examples include:

  • RadioButtons
  • Più simili ListViews a e si comportano come una singola ListViewMultiple ListViews that look like and behave like a single ListView
  • Qualsiasi interfaccia utente eseguita per apparire e comportarsi come griglia di riquadri (ad esempio, i riquadri del menu Start)Any UI made to look and behave like grid of tiles (such as the Start menu tiles)

Specifica del comportamento del gruppo di controlloSpecifying control group behavior

Usare le API seguenti per supportare il comportamento del gruppo di controlli personalizzato (tutti sono trattati in modo più dettagliato più avanti in questo argomento):Use the following APIs to support custom control group behavior (all are discussed in more detail later in this topic):

Nell'immagine seguente viene illustrato un comportamento intuitivo di navigazione da tastiera per un gruppo di controlli di pulsanti di opzione associati.The following image shows an intuitive keyboard navigation behavior for a control group of associated radio buttons. In questo caso, è consigliabile una singola tabulazione per il gruppo di controllo, la navigazione interna tra i pulsanti di opzione usando i tasti di direzione, il tasto Home associato al primo pulsante di opzione e la chiave finale associata all'ultimo pulsante di opzione.In this case, we recommend a single tab stop for the control group, inner navigation between the radio buttons using the arrow keys, Home key bound to the first radio button, and End key bound to the last radio button.

riunendoli

Tastiera e Assistente vocaleKeyboard and Narrator

Assistente vocale è uno strumento di accessibilità dell'interfaccia utente per gli utenti della tastiera (sono supportati anche altri tipi di input).Narrator is a UI accessibility tool geared towards keyboard users (other input types are also supported). Tuttavia, la funzionalità dell'Assistente vocale va oltre le interazioni tra tastiera supportate dalle app UWP ed è necessario prestare particolare attenzione durante la progettazione dell'app UWP per Assistente vocale.However, Narrator functionality goes beyond the keyboard interactions supported by UWP apps and extra care is required when designing your UWP app for Narrator. La pagina delle nozioni di base dell'assistente vocale illustra l'esperienza utente dell'Assistente vocale.(The Narrator basics page guides you through the Narrator user experience.)

Di seguito sono riportate alcune delle differenze tra i comportamenti della tastiera UWP e quelli supportati dall'Assistente vocale:Some of the differences between UWP keyboard behaviors and those supported by Narrator include:

  • Combinazioni di tasti aggiuntive per l'esplorazione degli elementi dell'interfaccia utente che non sono esposte tramite la navigazione da tastiera standard, ad esempio Caps Lock + tasti di direzione per leggere le etichette dei controlli.Extra key combinations for navigation to UI elements that are not exposed through standard keyboard navigation, such as Caps lock + arrow keys to read control labels.
  • Spostamento agli elementi disabilitati.Navigation to disabled items. Per impostazione predefinita, gli elementi disabilitati non vengono esposti tramite la navigazione da tastiera standard.By default, disabled items are not exposed through standard keyboard navigation.
  • Controllare le "visualizzazioni" per una navigazione più rapida in base alla granularità dell'interfaccia utente.Control "views" for quicker navigation based on UI granularity. Gli utenti possono passare a elementi, caratteri, parole, righe, paragrafi, collegamenti, intestazioni, tabelle, punti di riferimento e suggerimenti.Users can navigate to items, characters, word, lines, paragraphs, links, headings, tables, landmarks, and suggestions. La navigazione tramite tastiera standard espone questi oggetti come un elenco semplice, che potrebbe rendere complesso l'esplorazione, a meno che non si forniscano tasti di scelta rapida.Standard keyboard navigation exposes these objects as a flat list, which might make navigation cumbersome unless you provide shortcut keys.

Case Study-controllo AutoSuggestBoxCase Study – AutoSuggestBox control

Il pulsante Cerca per AutoSuggestBox non è accessibile alla navigazione da tastiera standard usando i tasti di direzione e di tabulazione perché l'utente può premere il tasto invio per inviare la query di ricerca.The search button for the AutoSuggestBox is not accessible to standard keyboard navigation using tab and arrow keys because the user can press the Enter key to submit the search query. Tuttavia, è accessibile tramite Assistente vocale quando l'utente preme BLOC MAIUSC + un tasto di direzione.However, it is accessible through Narrator when the user presses Caps Lock + an arrow key.

stato attivo suggerimento automatico tastiera

Con la * tastiera, gli utenti preme Immettere _ _key per inviare la query di ricerca *With keyboard, users press the Enter _ _key to submit search query

autosuggest narrator focus

Con Assistente vocale, gli utenti preme invio per inviare la query di ricercaWith Narrator, users press the Enter key to submit search query

autosuggest narrator focus on search

Con Assistente vocale, gli utenti possono anche accedere al pulsante Cerca usando il tasto MAIUSC + freccia destra, quindi premendo spazio .With Narrator, users are also able to access the search button using the Caps Lock + Right arrow key, then pressing Space key

Tastiera e Xbox gamepad e controllo remotoKeyboard and the Xbox gamepad and remote control

I gamepad Xbox e i controlli remoti supportano molti comportamenti ed esperienze della tastiera UWP.Xbox gamepads and remote controls support many UWP keyboard behaviors and experiences. Tuttavia, a causa della mancanza di diverse opzioni chiave disponibili su una tastiera, gamepad e controllo remoto non hanno molte ottimizzazioni della tastiera (il controllo remoto è ancora più limitato di gamepad).However, due to the lack of various key options available on a keyboard, gamepad and remote control lack many keyboard optimizations (remote control is even more limited than gamepad).

Per informazioni più dettagliate sul supporto di UWP per gamepad e l'input di controllo remoto, vedere Gamepad e interazioni di controllo remoto .See Gamepad and remote control interactions for more detail on UWP support for gamepad and remote control input.

Di seguito vengono illustrati alcuni mapping delle chiavi tra la tastiera, il gamepad e il controllo remoto.The following shows some key mappings between keyboard, gamepad, and remote control.

TastieraKeyboard Game padGamepad Controllo remotoRemote control
SpaceSpace Pulsante AA button Pulsante SelezionaSelect button
ImmettereEnter Pulsante AA button Pulsante SelezionaSelect button
Carattere speciale di escapeEscape Pulsante BB button Pulsante IndietroBack button
Home/fineHome/End N/DN/A N/DN/A
Pagina verso l'alto o verso il bassoPage Up/Down Pulsante trigger per scorrimento verticale, pulsante Bumper per scorrimento orizzontaleTrigger button for vertical scroll, Bumper button for horizontal scroll N/DN/A

Di seguito sono riportate alcune differenze principali da tenere presenti quando si progetta l'app UWP per l'uso con gamepad e l'utilizzo del controllo remoto:Some key differences you should be aware of when designing your UWP app for use with gamepad and remote control usage include:

  • Per la voce di testo è necessario che l'utente prema un oggetto per attivare un controllo di testo.Text entry requires the user to press A to activate a text control.

  • Lo spostamento dello stato attivo non è limitato ai gruppi di controllo, gli utenti possono spostarsi liberamente in qualsiasi elemento dell'interfaccia utente attivabile nell'app.Focus navigation is not limited to control groups, users can navigate freely to any focusable UI element in the app.

    Nota Lo stato attivo può essere spostato in qualsiasi elemento dell'interfaccia utente attivabile nella direzione di pressione della chiave, a meno che non si trovi in un'interfaccia utente sovrapposta o se è specificato Engagement , che impedisce lo stato attivo per l'immissione o l'uscita da un'area fino a quando non viene attivato o disattivato con il pulsanteNOTE Focus can move to any focusable UI element in the key press direction unless it is in an overlay UI or focus engagement is specified, which prevents focus from entering/exiting a region until engaged/disengaged with the A button. Per altre informazioni, vedere la sezione navigazione direzionale .For more info, see the directional navigation section.

  • I pulsanti D-Pad e Left Stick vengono usati per spostare lo stato attivo tra i controlli e per la navigazione interna.D-pad and left stick buttons are used to move focus between controls and for inner navigation.

    Nota Gamepad e controllo remoto passano solo agli elementi che si trovano nello stesso ordine visivo del tasto direzionale premuto.NOTE Gamepad and remote control only navigate to items that are in the same visual order as the directional key pressed. La navigazione è disabilitata in tale direzione quando non è presente alcun elemento successivo che può ricevere lo stato attivo.Navigation is disabled in that direction when there is no subsequent element that can receive focus. A seconda della situazione, gli utenti della tastiera non hanno sempre tale vincolo.Depending on the situation, keyboard users do not always have that constraint. Per altre informazioni, vedere la sezione ottimizzazione della tastiera incorporata .See the Built in keyboard optimization section for more info.

Navigazione direzionaleDirectional navigation

La navigazione direzionale viene gestita da una classe helper UWP Focus Manager , che accetta il tasto direzionale premuto (tasto freccia, D-Pad) e tenta di spostare lo stato attivo nella direzione dell'oggetto visivo corrispondente.Directional navigation is managed by a UWP Focus Manager helper class, which takes the directional key pressed (arrow key, D-pad) and attempts to move focus in the corresponding visual direction.

A differenza della tastiera, quando un'app sceglie la modalità mouse, la navigazione direzionale viene applicata all'intera applicazione per gamepad e controllo remoto.Unlike the keyboard, when an app opts out of Mouse Mode, directional navigation is applied across the entire application for gamepad and remote control. Per informazioni più dettagliate sull'ottimizzazione della navigazione direzionale, vedere Gamepad e interazioni di controllo remoto .See Gamepad and remote control interactions for more detail on directional navigation optimization.

Nota La navigazione tramite il tasto TAB della tastiera non è considerata la navigazione direzionale.NOTE Navigation using the keyboard Tab key is not considered directional navigation. Per altre informazioni, vedere la sezione Tab Stops .For more info, see the Tab stops section.

directional navigation

Navigazione direzionale supportataDirectional navigation supported
Usando chiavi direzionali (frecce della tastiera, gamepad e D-pad di controllo remoto), l'utente può spostarsi tra i diversi controlli.
Using directional keys (keyboard arrows, gamepad and remote control D-pad), user can navigate between different controls.

no directional navigation

Spostamento direzionale non supportato Directional navigation not supported
L'utente non può spostarsi tra controlli diversi usando chiavi direzionali.User cannot navigate between different controls using directional keys. Altri metodi per spostarsi tra i controlli (tasto TAB) non sono interessati.
Other methods of navigating between controls (tab key) are not impacted.

Ottimizzazione della tastiera incorporataBuilt in keyboard optimization

A seconda del layout e dei controlli usati, le app UWP possono essere ottimizzate in modo specifico per l'input da tastiera.Depending on the layout and controls used, UWP apps can be optimized specifically for keyboard input.

Nell'esempio seguente viene illustrato un gruppo di voci di elenco, elementi della griglia e voci di menu assegnati a una singola tabulazione (vedere la sezione relativa ai arresti tabulari ).The following example shows a group of list items, grid items, and menu items that have been assigned to a single tab stop (see the Tab stops section). Quando il gruppo dispone dello stato attivo, la navigazione interna viene eseguita con i tasti di direzione direzionali nell'ordine visivo corrispondente. vedere la sezione relativa alla navigazione .When the group has focus, inner navigation is performed with the directional arrow keys in the corresponding visual order (see Navigation section).

navigazione con tasto freccia a colonna singola

*Navigazione con tasto freccia a colonna singola _*Single Column Arrow Key Navigation _

navigazione con chiave a freccia singola riga

Navigazione con chiave a freccia singola rigaSingle Row Arrow Key Navigation

navigazione con chiavi a più colonne e righe

Navigazione tra più colonne/chiavi di frecceMultiple Column/Row Arrow Key Navigation

Wrapping di elementi di visualizzazione elenco e griglia omogeneiWrapping homogeneous List and Grid View Items

La navigazione direzionale non è sempre il modo più efficiente per esplorare più righe e colonne di elementi list e GridView.Directional navigation is not always the most efficient way to navigate multiple rows and columns of List and GridView items.

_ Nota * le voci di menu sono in genere elenchi a colonna singola, ma in alcuni casi è possibile che vengano applicate regole speciali (vedere interfaccia utente popup)._ NOTE * Menu items are typically single column lists, but special focus rules might apply in some cases (see Popup UI).

È possibile creare oggetti elenco e griglia con più righe e colonne.List and Grid objects can be created with multiple rows and columns. Si tratta in genere di righe-principali (dove gli elementi riempiono l'intera riga prima di compilare la riga successiva) o di colonna-principale (dove gli elementi riempiono l'intera colonna prima di riempire l'ordine della colonna successiva).These are typically in row-major (where items fill entire row first before filling in the next row) or column-major (where items fill entire column first before filling in the next column) order. L'ordine principale di riga o colonna dipende dalla direzione di scorrimento ed è necessario assicurarsi che l'ordine degli elementi non sia in conflitto con questa direzione.Row or column major order depends on scroll direction and you should ensure that item order does not conflict with this direction.

In ordine di riga (dove gli elementi si riempiono da sinistra verso destra, dall'alto verso il basso), quando lo stato attivo si trova sull'ultimo elemento di una riga e viene premuto il tasto freccia destra, lo stato attivo viene spostato sul primo elemento nella riga successiva.In row-major order (where items fill in left to right, top to bottom), when the focus is on the last item in a row and the Right arrow key is pressed, focus is moved to the first item in the next row. Questo stesso comportamento si verifica in senso inverso: quando lo stato attivo è impostato sul primo elemento in una riga e viene premuto il tasto freccia sinistra, lo stato attivo viene spostato nell'ultimo elemento della riga precedente.This same behavior occurs in reverse: When focus is set to the first item in a row and the Left arrow key is pressed, focus is moved to the last item in the previous row.

In ordine colonne (dove gli elementi si riempiono dall'alto verso il basso, da sinistra a destra), quando lo stato attivo è l'ultimo elemento in una colonna e l'utente preme il tasto freccia giù, lo stato attivo viene spostato sul primo elemento nella colonna successiva.In column-major order (where items fill in top to bottom, left to right), when the focus is on the last item in a column and user presses the Down arrow key, focus is moved to the first item in the next column. Questo stesso comportamento si verifica in senso inverso: quando lo stato attivo è impostato sul primo elemento in una colonna e viene premuto il tasto freccia su, lo stato attivo viene spostato nell'ultimo elemento della colonna precedente.This same behavior occurs in reverse: When focus is set to the first item in a column and the Up arrow key is pressed, focus is moved to the last item in the previous column.

row major keyboard navigation

Navigazione da tastiera principale rigaRow major keyboard navigation

column major keyboard navigation

Spostamento della tastiera principale della colonnaColumn major keyboard navigation

Come indicato in precedenza, è consigliabile provare a garantire che la navigazione direzionale corrisponda all'ordine visivo dei controlli nell'interfaccia utente dell'applicazione.As mentioned, you should try to ensure directional navigation corresponds to the visual order of the controls in your application's UI.

Alcuni controlli, ad esempio il menu di scelta rapida, il menu di overflow della barra dei comandi e il menu suggerimenti automatici, visualizzano una finestra popup di menu in una posizione e direzione (verso il basso per impostazione predefinita) rispetto al controllo primario e allo spazio disponibile sullo schermo.Some controls (such as the context menu, CommandBar overflow menu, and AutoSuggest menu) display a menu popup in a location and direction (downwards by default) relative to the primary control and available screen space. Si noti che la direzione di apertura può essere interessata da diversi fattori in fase di esecuzione.Note that the opening direction can be affected by a variety of factors at run time.

command bar opens down with down arrow key command bar opens up with down arrow key

Per questi controlli, quando il menu viene aperto per la prima volta (e nessun elemento è stato selezionato dall'utente), il tasto freccia giù imposta sempre lo stato attivo sul primo elemento mentre il tasto freccia su imposta sempre lo stato attivo sull'ultimo elemento nel menu.For these controls, when the menu is first opened (and no item has been selected by the user), the Down arrow key always sets focus to the first item while the Up arrow key always sets focus to the last item on the menu.

Se l'ultimo elemento ha lo stato attivo e viene premuto il tasto freccia giù, lo stato attivo passa al primo elemento nel menu.If the last item has focus and the Down arrow key is pressed, focus moves to the first item on the menu. Analogamente, se il primo elemento ha lo stato attivo e viene premuto il tasto freccia su, lo stato attivo passa all'ultimo elemento nel menu.Similarly, if the first item has focus and the Up arrow key is pressed, focus moves to the last item on the menu. Questo comportamento è noto come Cycling ed è utile per spostarsi tra i menu popup che possono essere aperti in direzioni imprevedibili.This behavior is referred to as cycling and is useful for navigating popup menus that can open in unpredictable directions.

Nota

Il ciclo deve essere evitato nelle interfacce utente non popup in cui è possibile che gli utenti si trovino in un ciclo infinito.Cycling should be avoided in non-popup UIs where users might come to feel trapped in an endless loop.

Si consiglia di emulare questi stessi comportamenti nei controlli personalizzati.We recommend that you emulate these same behaviors in your custom controls. Il codice di esempio su come implementare questo comportamento è disponibile nella documentazione di esplorazione dello stato attivo a livello di codice.Code sample on how to implement this behavior can be found in Programmatic focus navigation documentation.

Test dell'appTest your app

Testare l'app con tutti i dispositivi di input supportati per assicurarsi che gli elementi dell'interfaccia utente possano essere spostati in modo coerente e intuitivo e che nessun elemento imprevisto interferisca con l'ordine di tabulazione desiderato.Test your app with all supported input devices to ensure UI elements can be navigated to in a coherent and intuitive way and that no unexpected elements interfere with the desired tab order.

AppendiceAppendix

Tastiera softwareSoftware keyboard

Tastiera software è una tastiera visualizzata sullo schermo che l'utente può usare al posto della tastiera fisica per digitare e immettere i dati usando il tocco, il mouse, la penna o lo stilo o un altro dispositivo di puntamento (non è necessario un touchscreen).Software keyboard is a keyboard that is displayed on screen that user can use instead of the physical keyboard to type and enter data using touch, mouse, pen/stylus or other pointing device (a touch screen is not required). Nel touchscreen, queste tastiere possono essere toccate direttamente per immettere anche il testo.On touch screen, these keyboards can be touched directly to enter text as well. Nei dispositivi Xbox One è necessario selezionare le singole chiavi spostando l'immagine dello stato attivo o usando i tasti di scelta rapida usando gamepad o controllo remoto.On Xbox One devices, individual keys need to be selected by moving focus visual or using shortcut keys using gamepad or remote control.

Tastiera Windows 10 touch

*Tastiera Windows 10 touch _*Windows 10 Touch Keyboard _

Tastiera di Xbox One sullo schermo

Tastiera di Xbox One sullo schermoXbox One Onscreen Keyboard

A seconda del dispositivo, la tastiera software viene visualizzata quando un campo di testo o un altro controllo testo modificabile ottiene lo stato attivo o quando l'utente lo abilita manualmente tramite il _ * centro notifiche * *:Depending on the device, the software keyboard appears when a text field or other editable text control gets focus, or when the user manually enables it through the _*Notification Center**:

icona della tastiera virtuale nel Centro notifiche

Se la tua app imposta a livello di codice lo stato attivo su un controllo input di testo, la tastiera virtuale non viene richiamata.If your app sets focus programmatically to a text input control, the touch keyboard is not invoked. Così si eliminano i comportamenti imprevisti non avviati dall'utente.This eliminates unexpected behaviors not instigated directly by the user. La tastiera viene però nascosta automaticamente quando lo stato attivo viene spostato a livello di codice su un controllo input non di testo.However, the keyboard does automatically hide when focus is moved programmatically to a non-text input control.

La tastiera virtuale rimane in genere visibile mentre l'utente si sposta tra i controlli di un modulo.The touch keyboard typically remains visible while the user navigates between controls in a form. Questo comportamento può variare in base agli altri tipi di controllo all'interno del modulo.This behavior can vary based on the other control types within the form.

Il seguente è un elenco di controlli non di modifica che possono assumere lo stato attivo durante una sessione di immissione testo mediante la tastiera virtuale senza annullare la tastiera.The following is a list of non-edit controls that can receive focus during a text entry session using the touch keyboard without dismissing the keyboard. Invece di complicare l'interfaccia con il rischio di disorientare l'utente, la tastiera virtuale rimane visibile perché è probabile che si passi da un controllo all'immissione di testo con la tastiera stessa.Rather than needlessly churn the UI and potentially disorient the user, the touch keyboard remains in view because the user is likely to go back and forth between these controls and text entry with the touch keyboard.

  • Casella di controlloCheck box
  • Casella combinataCombo box
  • Pulsante di opzioneRadio button
  • Barra di scorrimentoScroll bar
  • AlberoTree
  • Elemento di struttura ad alberoTree item
  • MenuMenu
  • Barra dei menuMenu bar
  • Voce di menuMenu item
  • Barra degli strumentiToolbar
  • ElencoList
  • Elemento elencoList item

Ecco alcuni esempi delle diverse modalità per la tastiera virtuale.Here are examples of different modes for the touch keyboard. La prima immagine illustra il layout predefinito, la seconda il layout di scrittura con pollici, non necessariamente disponibile per tutte le lingue.The first image is the default layout, the second is the thumb layout (which might not be available in all languages).

tastiera virtuale nella modalità layout predefinito

*Tastiera touch in modalità di layout predefinita _*The touch keyboard in default layout mode _

tastiera virtuale nella modalità layout espanso

Tastiera touch in modalità di layout espansaThe touch keyboard in expanded layout mode

Le corrette interazioni tramite tastiera consentono agli utenti di eseguire scenari di base delle app usando solo la tastiera. In altre parole, gli utenti possono accedere a tutti gli elementi interattivi e attivarne la funzionalità predefinita.Successful keyboard interactions enable users to accomplish basic app scenarios using only the keyboard; that is, users can reach all interactive elements and activate default functionality. La riuscita può essere influenzata da diversi fattori, tra cui lo spostamento da tastiera, i tasti di scelta per l'accessibilità e i tasti di scelta rapida (o combinazioni di tasti) per gli utenti avanzati.A number of factors can affect the degree of success, including keyboard navigation, access keys for accessibility, and accelerator (or shortcut) keys for advanced users.

_ Nota * la tastiera touch non supporta l'attivazione e la maggior parte dei comandi di sistema._ NOTE * The touch keyboard does not support toggle and most system commands.

Tastiera su schermoOn-Screen Keyboard

Analogamente alla tastiera software, la tastiera su schermo è una tastiera software visiva che è possibile usare al posto della tastiera fisica per digitare e immettere i dati usando il tocco, il mouse, la penna o lo stilo o un altro dispositivo di puntamento (non è necessario un touchscreen).Like software keyboard, the On-Screen Keyboard is a visual, software keyboard that you can use instead of the physical keyboard to type and enter data using touch, mouse, pen/stylus or other pointing device (a touch screen is not required). Tastiera su schermo è destinata ai sistemi privi di una tastiera fisica o agli utenti che a causa di problemi di mobilità non possono usare i tradizionali dispositivi di input fisici.The On-Screen Keyboard is provided for systems that don't have a physical keyboard, or for users whose mobility impairments prevent them from using traditional physical input devices. Tastiera su schermo emula la maggior parte delle funzionalità, se non tutte, di una tastiera hardware.The On-Screen Keyboard emulates most, if not all, the functionality of a hardware keyboard.

Tastiera su schermo può essere attivata dalla pagina Tastiera in Impostazioni > Accessibilità.The On-Screen Keyboard can be turned on from the Keyboard page in Settings > Ease of access.

Nota La tastiera su schermo ha la priorità sulla tastiera touch, che non verrà visualizzata se è presente la tastiera sullo schermo.NOTE The On-Screen Keyboard has priority over the touch keyboard, which won't be shown if the On-Screen Keyboard is present.

tastiera su schermo

Tastiera su schermoOn-Screen Keyboard

Per ulteriori informazioni sulla tastiera su schermo, visitare la pagina della tastiera su schermo .Visit On-Screen keyboard page for more details about On-Screen Keyboard.