Interacciones de teclado

Obtenga información sobre cómo diseñar y optimizar las aplicaciones de Windows para que proporcionen las mejores experiencias tanto para los usuarios avanzados del teclado como para aquellos con discapacidades y otros requisitos de accesibilidad.

En todos los dispositivos, la entrada del teclado es una parte importante de la experiencia general de interacción de aplicaciones de Windows. Una experiencia de teclado bien diseñada permite a los usuarios navegar eficazmente por la interfaz de usuario de la aplicación y acceder a su funcionalidad completa sin levantar nunca sus manos desde el teclado.

Los patrones de interacción comunes se comparten entre el teclado y el controlador para juegos

En este tema, nos centramos específicamente en el diseño de aplicaciones de Windows para la entrada de teclado en equipos. Sin embargo, una experiencia de teclado bien diseñada es importante para admitir herramientas de accesibilidad como Narrador de Windows, mediante teclados de software como el teclado táctil y el Teclado en pantalla (OSK) y para controlar otros tipos de dispositivos de entrada, como un panel de juegos o control remoto.

Muchas de las directrices y recomendaciones que se describen aquí, incluidos los objetos visuales de foco, las claves de acceso y la navegación de la interfaz de usuario, también se aplican a estos otros escenarios.

NOTA Aunque los teclados de hardware y software se usan para la entrada de texto, el foco de este tema es la navegación y la interacción.

Soporte integrado

Junto con el mouse, el teclado es el periférico más usado en equipos y, como tal, es una parte fundamental de la experiencia del equipo. Los usuarios de PC esperan una experiencia completa y coherente tanto del sistema como de las aplicaciones individuales en respuesta a la entrada del teclado.

Todos los controles para UWP incluyen compatibilidad integrada con experiencias de teclado enriquecidas e interacciones de usuario, mientras que la propia plataforma proporciona una base amplia para crear experiencias de teclado que te sientan más adecuadas tanto para tus controles personalizados como para las aplicaciones.

UWP admite el teclado con cualquier dispositivo

Experiencias básicas

Como se mencionó anteriormente, los dispositivos de entrada, como un panel de juegos y el control remoto, y las herramientas de accesibilidad, como Narrador, comparten gran parte de la experiencia de entrada del teclado para la navegación y el comando. Esta experiencia común entre los tipos de entrada y las herramientas minimiza el trabajo adicional de usted y contribuye al objetivo de "compilar una vez, ejecutar en cualquier lugar" de la Plataforma universal de Windows.

Cuando sea necesario, identificaremos las diferencias clave que debe tener en cuenta y describiremos las mitigaciones que debe tener en cuenta.

Estos son los dispositivos y las herramientas que se describen en este tema:

Dispositivo o herramienta	Description
Teclado (hardware y software)	Además del teclado de hardware estándar, las aplicaciones de Windows admiten dos teclados de software: el teclado táctil (o software) y el teclado en pantalla.
Panel de juegos y control remoto	Un panel de juego y un control remoto son dispositivos de entrada fundamentales en la experiencia de 10 pies. Para obtener detalles específicos sobre la compatibilidad de Windows con el panel de juegos y el control remoto, consulta Panel de juegos y interacciones de control remoto.
Lectores de pantalla (Narrador)	Narrador es un lector de pantalla integrado para Windows que proporciona experiencias y funcionalidades de interacción únicas, pero que todavía se basa en la navegación básica del teclado y la entrada. Para obtener detalles del narrador, consulte Introducción al narrador.

Experiencias personalizadas y teclado eficaz

Como se mencionó, la compatibilidad con teclado es integral para garantizar que las aplicaciones funcionen bien para los usuarios con diferentes aptitudes, habilidades y expectativas. Se recomienda priorizar lo siguiente.

• Soporte para la navegación y la interacción con el teclado
  • Asegúrese de que los elementos accionables se identifican como paradas de tabulación (y que los elementos no accionables no se identifican así), y que el orden de navegación sea lógico y predecible (consulte Paradas de tabulación).
  • Establecer el foco inicial en el elemento más lógico (vea Foco inicial)
  • Proporcionar navegación por teclas de dirección para "navegaciones internas" (consulte Navegación)
• Compatibilidad con métodos abreviados de teclado
  • Proporcionar teclas de aceleración para acciones rápidas (consulte Aceleradores)
  • Proporcionar claves de acceso para navegar por la interfaz de usuario de la aplicación (consulte Claves de acceso)

Objetos visuales de foco

UWP admite un único diseño visual de foco que funciona bien para todos los tipos de entrada y experiencias.

Objeto visual de foco:

• Se muestra cuando un elemento de la interfaz de usuario recibe el foco de un teclado o controlador para juegos o control remoto
• Se representa como un borde resaltado alrededor del elemento de interfaz de usuario para indicar que se puede realizar una acción.
• Ayuda a un usuario a navegar por una interfaz de usuario de la aplicación sin perderse
• Se puede personalizar para su aplicación (consulta Objetos visuales de foco de alta visibilidad)

NOTA El objeto visual de foco de UWP no es el mismo que el rectángulo de foco del narrador.

Tabulaciones

Para usar un control (incluidos los elementos de navegación) con el teclado, el control debe tener el foco. Una manera de que un control reciba el foco del teclado es hacerlo accesible a través de la navegación por tabulador, identificándolo como un tabulador en el orden de tabulación de la aplicación.

Para que un control se incluya en el orden de tabulación, la propiedad IsEnabled debe establecerse en true y la propiedad IsTabStop debe establecerse en true.

Para excluir específicamente un control del orden de tabulación, establezca la propiedad IsTabStop en false.

De forma predeterminada, el orden de tabulación refleja el orden en el que se crean los elementos de la interfaz de usuario. Por ejemplo, si un StackPanel contiene un Button, un Checkbox, y un TextBox, el orden de tabulación es Button, Checkbox, y TextBox.

Puede invalidar el orden de tabulación predeterminado estableciendo la propiedad TabIndex .

El orden de tabulación debe ser lógico y predecible

Un modelo de navegación con teclado bien diseñado, con un orden de tabulación lógico y predecible, hace que la aplicación sea más intuitiva y ayude a los usuarios a explorar, detectar y acceder a la funcionalidad de forma más eficaz y eficaz.

Todos los controles interactivos deben tener puntos de tabulación (a menos que estén en un grupo), mientras que los controles no interactivos, como las etiquetas, no deben tenerlos.

Evite un orden de tabulación personalizado que haga que el foco salte por la aplicación. Por ejemplo, una lista de controles de un formulario debe tener un orden de tabulación que fluya de arriba a abajo y de izquierda a derecha (según la configuración regional).

Consulte Accesibilidad del teclado para obtener más detalles sobre cómo personalizar los puntos de tabulación.

Intente coordinar el orden de tabulación y el orden visual

Coordinar el orden de tabulación y el orden visual (también denominado orden de lectura o orden de visualización) ayuda a reducir la confusión de los usuarios a medida que navegan por la interfaz de usuario de la aplicación.

Intente clasificar y presentar primero los comandos, controles y contenido más importantes tanto en el orden de tabulación como en el orden visual. Sin embargo, la posición de visualización real puede depender del contenedor de diseño primario y de determinadas propiedades de los elementos secundarios que influyen en el diseño. En concreto, los diseños que usan una metáfora de cuadrícula o una metáfora de tabla pueden tener un orden visual bastante diferente del orden de tabulación.

NOTA El orden visual también depende de la configuración regional y del idioma.

Foco inicial

El foco inicial especifica el elemento de interfaz de usuario que recibe el foco cuando una aplicación o una página se inician o activan por primera vez. Cuando se usa un teclado, procede de este elemento que un usuario empieza a interactuar con la interfaz de usuario de la aplicación.

En el caso de las aplicaciones para UWP, el foco inicial se establece en el elemento con el tabIndex más alto que puede recibir el foco. Se omiten los elementos secundarios de los controles de contenedor. En un empate, el primer elemento del árbol visual recibe el foco.

Establecer el foco inicial en el elemento más lógico

Establezca el foco inicial en el elemento de la interfaz de usuario para la primera acción, o principal, que es más probable que los usuarios realicen al iniciar la aplicación o navegar a una página. Algunos ejemplos son:

• Una aplicación de fotos donde el foco se establece en el primer elemento de una galería
• Una aplicación de música donde el foco está establecido en el botón reproducir

No establezca el foco inicial en un elemento que expone un resultado potencialmente negativo, o incluso desastroso,

Este nivel de funcionalidad debe ser la opción del usuario. Establecer el foco inicial en un elemento con un resultado significativo podría dar lugar a una pérdida de datos no deseada o al acceso del sistema. Por ejemplo, no establezca el foco en el botón Eliminar al navegar a un correo electrónico.

Consulte Navegación de foco para obtener más detalles sobre cómo anular el orden de tabulación.

Navegación

Normalmente, la navegación por teclado se admite a través de las teclas Tab y las teclas de flecha.

De forma predeterminada, los controles para UWP siguen estos comportamientos básicos de teclado:

• Las teclas de tabulación navegan entre controles accionables o activos en orden de tabulación.
• Shift + Tab navega por los controles en orden inverso de tabulación. Si el usuario ha navegado dentro del control mediante la tecla de dirección, el foco se establece en el último valor conocido dentro del control.
• Las teclas de dirección exponen la "navegación interna" específica del control Cuando el usuario escribe "navegación interna", las teclas de dirección no navegan fuera de un control. Entre algunos ejemplos se incluyen:
  • La tecla de flecha arriba/abajo mueve el foco dentro ListView y MenuFlyout
  • Modificar los valores seleccionados actualmente para Slider y RatingsControl
  • Mover el cursor dentro de TextBox
  • Expandir o contraer elementos dentro de TreeView

Use estos comportamientos predeterminados para optimizar la navegación por teclado de la aplicación.

Uso de "navegación interna" con conjuntos de controles relacionados

Proporcionar navegación por teclas de flecha en un conjunto de controles relacionados refuerza su relación dentro de la organización general de la interfaz de usuario de la aplicación.

Por ejemplo, el ContentDialog control que se muestra aquí proporciona navegación interna de forma predeterminada para una fila horizontal de botones (para controles personalizados, vea la sección Grupo de controles ).

La interacción con una colección de botones relacionados se facilita con la navegación de teclas de dirección

Si los elementos se muestran en una sola columna, la tecla de flecha arriba/abajo navega por los elementos. Si los elementos se muestran en una sola fila, la tecla de flecha derecha/izquierda navega por los elementos. Si los elementos están en múltiples columnas, las 4 teclas de dirección navegan.

Establecer una sola tabulación o pestaña para una colección de controles relacionados

Al definir una sola posición de tabulación para una colección de controles relacionados o complementarios, puedes minimizar el número total de posiciones de tabulación en tu aplicación.

Por ejemplo, las siguientes imágenes muestran dos controles ListView apilados. La imagen de la izquierda muestra la navegación de teclas de flecha usada en combinación con un punto de tabulación para navegar entre ListView controles, mientras que la imagen de la derecha muestra cómo la navegación entre elementos secundarios podría ser más fácil y eficaz eliminando la necesidad de recorrer los controles principales con una tecla Tab.

La interacción con dos controles ListView apilados puede ser más fácil y eficaz eliminando el punto de tabulación y navegando usando solo las teclas de flecha.

Visite la sección Grupo de control para obtener información sobre cómo aplicar los ejemplos de optimización a la interfaz de usuario de la aplicación.

Interacción y comandos

Una vez que un control tiene el foco, un usuario puede interactuar con él e invocar cualquier funcionalidad asociada mediante la entrada de teclado específica.

Entrada de texto

Para esos controles diseñados específicamente para la entrada de texto, como TextBox y RichEditBox, se usa toda la entrada del teclado para escribir o navegar por texto, que tiene prioridad sobre otros comandos de teclado. Por ejemplo, el menú desplegable de un AutoSuggestBox control no reconoce la tecla Espacio como comando de selección.

Tecla de espacio

Cuando no está en modo de entrada de texto, la tecla Espacio invoca la acción o comando asociado al control centrado (al igual que una pulsación con entrada táctil o un clic con un mouse).

Escriba la tecla

La tecla Entrar puede realizar una variedad de interacciones comunes del usuario, en función del control con foco:

• Activa controles de comando como un Button o Hyperlink. Para evitar confusiones del usuario final, la tecla Entrar también activa los controles que tienen un aspecto similar a los controles de comando, como ToggleButton o AppBarToggleButton.
• Muestra la interfaz de usuario del selector para controles como ComboBox y DatePicker. La tecla Entrar también confirma y cierra la interfaz de usuario del selector.
• Activa controles de lista como ListView, GridViewy ComboBox.
  • La tecla Entrar realiza la acción de selección como clave espaciadora para los elementos de lista y cuadrícula, a menos que haya una acción adicional asociada a estos elementos (abrir una nueva ventana).
  • Si se asocia una acción adicional con el control, la tecla Entrar realiza la acción adicional y la tecla Espacio realiza la acción de selección.

NOTA La tecla Entrar y la tecla Espaciadora no siempre realizan la misma acción, pero a menudo lo hacen.

Tecla esc

La clave esc permite que un usuario cancele la interfaz de usuario transitoria (junto con las acciones en curso de esa interfaz de usuario).

Entre los ejemplos de esta experiencia se incluyen:

• El usuario abre un ComboBox con un valor seleccionado y usa las teclas de dirección para mover la selección de foco a un nuevo valor. Al presionar la tecla Esc, se cierra ComboBox y se restablece el valor seleccionado al valor original.
• El usuario invoca una acción de eliminación permanente para un correo electrónico y se le pide que ContentDialog confirme la acción. El usuario decide que no es la acción deseada y presiona la tecla Esc para cerrar el cuadro de diálogo. A medida que la tecla Esc está asociada al botón Cancelar , el cuadro de diálogo se cierra y se cancela la acción. La tecla Esc solo afecta a la interfaz de usuario transitoria, no cierra ni permite retroceder en la interfaz de usuario de la aplicación.

Claves de inicio y finalización

Las teclas Inicio y Fin permiten al usuario desplazarse al principio o al final de una región de interfaz de usuario.

Entre los ejemplos de esta experiencia se incluyen:

• Para los controles ListView y GridView, la tecla Inicio mueve el foco al primer elemento y lo desplaza a la vista, mientras que la tecla Fin mueve el foco al último elemento y también lo desplaza a la vista.
• Para un ScrollView control, la tecla Inicio se desplaza a la parte superior de la región, mientras que la tecla End se desplaza a la parte inferior de la región (no se cambia el foco).

Tecla Page Up y tecla Page Down

Las claves de página permiten a un usuario desplazarse por una región de interfaz de usuario en incrementos discretos.

Por ejemplo, para los controles ListView y GridView, la tecla Página arriba desplaza la región en una "página" (normalmente el alto de la ventanilla) y mueve el foco hasta la parte superior de la región. Como alternativa, la tecla Bajar página desplaza la región hacia abajo por una página y mueve el foco a la parte inferior de la región.

Tecla F6

La tecla F6 permite al usuario recorrer paneles o secciones importantes de la aplicación o la interfaz de usuario. Mayús-F6 normalmente se desplaza hacia atrás (consulte Accesibilidad del teclado).

A menudo se relacionan con puntos de referencia y encabezados, pero no es necesario que se correspondan directamente.

Por ejemplo:

• En Edge, al presionar F6 se desplazará entre la barra de pestañas, la barra de direcciones o la barra de aplicaciones y el contenido de la página.
• En el Explorador de archivos, al presionar F6 se recorrerán las secciones de la aplicación.
• En el escritorio, al presionar F6 se desplazará entre las partes de la barra de tareas y el escritorio.

Atajos de teclado

Además de implementar la navegación y activación del teclado, también se recomienda implementar métodos abreviados de teclado, como aceleradores de teclado y teclas de acceso para funcionalidades importantes o usadas con frecuencia.

Los métodos abreviados de teclado pueden facilitar el uso de la aplicación al proporcionar compatibilidad mejorada para la accesibilidad y mejorar la eficacia de los usuarios del teclado.

Un método abreviado es una combinación de teclado que mejora la productividad al proporcionar una manera eficaz de que el usuario acceda a la funcionalidad de la aplicación. Existen dos tipos de vistas:

• Los aceleradores son accesos directos que invocan un comando de aplicación. Es posible que la aplicación proporcione o no una interfaz de usuario específica que corresponda al comando. Normalmente, los aceleradores constan de la tecla Ctrl más una tecla de letra.
• Las secuencia de teclas son métodos abreviados que establecen el foco en una interfaz de usuario específica de la aplicación. Las claves de acceso normalmente constan de la tecla Alt más una clave de letra.

Proporcionar métodos abreviados de teclado coherentes que admiten tareas similares entre aplicaciones los hace mucho más útiles y eficaces y ayuda a los usuarios a recordarlos.

Aceleradores

Los aceleradores ayudan a los usuarios a realizar acciones comunes en una aplicación de forma mucho más rápida y eficaz.

Ejemplos de aceleradores:

• Al presionar Ctrl + N tecla en cualquier parte de la aplicación Correo , se inicia un nuevo elemento de correo.
• Al presionar Ctrl + E tecla en cualquier lugar de Microsoft Edge (y muchas aplicaciones de Microsoft Store), se inicia la búsqueda.

Los aceleradores tienen las siguientes características:

• Usan principalmente secuencias de teclas Ctrl y Función (las teclas de método abreviado del sistema de Windows también usan teclas alt + no alfanuméricas y la tecla del logotipo de Windows).
• Solo se asignan a los comandos más usados.
• Están diseñados para ser memorizados y solo se documentan en menús, información sobre herramientas y Ayuda.
• Tienen efecto en toda la aplicación, cuando se admiten.
• Deben asignarse de forma coherente a medida que se memorizan y no se documentan directamente.

Claves de acceso

Consulta la página Claves de acceso para obtener información más detallada sobre cómo admitir las claves de acceso con UWP.

Las teclas de acceso ayudan a los usuarios con discapacidades de la función motora a presionar una tecla cada vez para actuar en un elemento específico de la interfaz de usuario. Además, las teclas de acceso se pueden usar para comunicar teclas de método abreviado adicionales para ayudar a los usuarios avanzados a realizar acciones rápidamente.

Las claves de acceso tienen las siguientes características:

• Usan la tecla Alt más una clave alfanumérica.
• Son principalmente para accesibilidad.
• Se documentan directamente en la interfaz de usuario, adyacentes al control, a través de sugerencias clave.
• Solamente tienen efecto en la ventana actual y se dirigen al elemento de menú o control correspondiente.
• Las teclas de acceso se deben asignar de forma coherente a los comandos usados habitualmente (especialmente los botones de confirmación), siempre que sea posible.
• Se localizan.

Métodos abreviados de teclado comunes

En la tabla siguiente se muestra un pequeño ejemplo de métodos abreviados de teclado usados con frecuencia.

Acción	Comando de teclas
Seleccionar todo	Ctrl+A
Continuar seleccionando	Mayús+Tecla de flecha
Guardar	Ctrl+S
Buscar	Ctrl+F
Print	Ctrl+P
Copiar	Ctrl+C
Cortar	Ctrl+X
Pegar	Ctrl+V
Deshacer	Ctrl+Z
Pestaña siguiente	Ctrl+Tab
Cerrar pestaña	Ctrl+F4 o Ctrl+W
Zoom semántico	Ctrl++ o Ctrl+-

Para obtener una lista completa de los métodos abreviados del sistema de Windows, consulte métodos abreviados de teclado para Windows. Para obtener métodos abreviados de aplicación comunes, consulte Métodos abreviados de teclado para aplicaciones de Microsoft.

Experiencias avanzadas

En esta sección, analizamos algunas de las experiencias de interacción de teclado más complejas que admiten las aplicaciones para UWP, junto con algunos de los comportamientos que debes tener en cuenta cuando la aplicación se usa en diferentes dispositivos y con distintas herramientas.

Grupo de control

Puede agrupar un conjunto de controles relacionados, o complementarios, en un "grupo de control" (o área direccional), que permite la "navegación interna" mediante las teclas de dirección. El grupo de control puede ser una sola tabulación o puede especificar varias tabulaciones dentro del grupo de control.

Navegación por teclas de dirección

Los usuarios esperan compatibilidad con la navegación por teclas de flecha cuando hay un grupo de controles similares relacionados en una región de interfaz de usuario:

• AppBarButtons en un CommandBar
• ListItems o GridItems dentro de ListView o GridView
• Buttons adentro ContentDialog

Los controles de UWP admiten la navegación por teclas de dirección de forma predeterminada. Para diseños personalizados y grupos de controles, use XYFocusKeyboardNavigation="Enabled" para proporcionar un comportamiento similar.

Considere la posibilidad de agregar compatibilidad con la navegación por teclas de dirección al usar los siguientes controles:

Botones de diálogo Botones de radio

AppBarButtons ElementosDeLista y ElementosDeCuadrícula

Tabulaciones

En función de la funcionalidad y el diseño de la aplicación, la mejor opción de navegación para un grupo de control puede ser una sola parada de tabulación con navegación mediante flechas a elementos secundarios, varias paradas de tabulación o una combinación de las anteriores.

Usar múltiples paradas de tabulación y teclas de flecha para los botones

Los usuarios de accesibilidad se basan en reglas de navegación de teclado bien establecidas, que normalmente no usan teclas de dirección para navegar por una colección de botones. Sin embargo, los usuarios sin discapacidades visuales pueden sentir que el comportamiento es natural.

Un ejemplo de comportamiento predeterminado de UWP en este caso es .ContentDialog Aunque las teclas de dirección se pueden usar para navegar entre botones, cada botón también es un punto de tabulación.

Asigna una parada de tabulación única a patrones familiares de interfaz de usuario

En los casos en los que el diseño sigue un patrón de interfaz de usuario conocido para los grupos de control, asignar un único punto de tabulación al grupo puede mejorar la eficiencia de navegación para los usuarios.

Algunos ejemplos son:

• RadioButtons
• Varios ListViews que parecen y se comportan como un solo ListView
• Cualquier interfaz de usuario hecha para parecerse y comportarse como cuadrícula de iconos (como los iconos del menú Inicio)

Especificación del comportamiento del grupo de control

Use las SIGUIENTES API para admitir el comportamiento del grupo de control personalizado (todos se describen con más detalle más adelante en este tema):

• XYFocusKeyboardNavigation habilita la navegación por teclas de dirección entre controles
• TabFocusNavigation indica si hay varios puntos de tabulación o un solo punto de tabulación
• FindFirstFocusableElement y FindLastFocusableElement establecen el foco en el primer elemento con la tecla Inicio y el último elemento con la tecla End

En la imagen siguiente se muestra un comportamiento intuitivo de navegación por teclado para un grupo de controles de botones de radio asociados. En este caso, se recomienda una sola tabulación para el grupo de control, la navegación interna entre los botones de radio mediante las teclas de flecha, la tecla Inicio vinculada al primer botón de radio y la tecla Fin vinculada al último botón de radio.

Teclado y narrador

Narrador es una herramienta de accesibilidad de la interfaz de usuario orientada a los usuarios del teclado (también se admiten otros tipos de entrada). Sin embargo, la funcionalidad de Narrador va más allá de las interacciones de teclado admitidas por las aplicaciones UWP y es necesario prestar especial atención al diseñar las aplicaciones UWP para el Narrador. (La página Conceptos básicos del Narrador le guía a través de la experiencia del usuario del Narrador).

Algunas de las diferencias entre los comportamientos de teclado de UWP y los admitidos por Narrador son:

• Combinaciones de teclas adicionales para la navegación a elementos de la interfaz de usuario que no se exponen a través de la navegación estándar del teclado, como el bloqueo de mayúsculas y las teclas de dirección para leer las etiquetas de control.
• Navegación a elementos deshabilitados. De forma predeterminada, los elementos deshabilitados no se exponen a través de la navegación por teclado estándar.
• Controle las "vistas" para una navegación más rápida en función de la granularidad de la interfaz de usuario. Los usuarios pueden navegar a elementos, caracteres, palabras, líneas, párrafos, vínculos, encabezados, tablas, puntos de referencia y sugerencias. La navegación por teclado estándar expone estos objetos como una lista plana, lo que puede hacer que la navegación sea complicada a menos que proporcione teclas de método abreviado.

Caso práctico: control AutoSuggestBox

El botón de búsqueda para el AutoSuggestBox no es accesible mediante la navegación estándar por teclado usando las teclas de tabulación y flechas porque el usuario puede presionar la tecla Intro para enviar la consulta de búsqueda. Sin embargo, es accesible a través del Narrador cuando el usuario presiona la tecla de mayúsculas + una tecla de flecha.

Con el teclado, los usuarios presionan la tecla Entrarpara enviar la consulta de búsqueda.

Con Narrador, los usuarios presionan la tecla Entrar para enviar la consulta de búsqueda.

Con Narrador, los usuarios también pueden acceder al botón de búsqueda mediante la tecla de flecha mayúsculas y derecha y, a continuación, presionando Tecla espaciadora .

Teclado, panel para juegos y control remoto

Los mandos de juego y los controles remotos soportan muchas funcionalidades y experiencias de teclado de UWP. Sin embargo, debido a la falta de varias opciones de teclas disponibles en un teclado, el panel de juegos y el control remoto carecen de muchas optimizaciones de teclado (el control remoto es incluso más limitado que el panel de juegos).

Consulta Panel de juegos y interacciones de control remoto para obtener más información sobre la compatibilidad con UWP para el panel de juegos y la entrada de control remoto.

A continuación se muestran algunas asignaciones de teclas entre el teclado, el panel para juegos y el control remoto.

Keyboard	Panel de juegos	Control remoto
Espacio	Un botón	Botón Seleccionar
Entrar	Un botón	Botón de selección
Escapar	Botón B	Botón Atrás
Inicio/Fin	N/A	N/A
Subir o bajar página	Botón de desencadenador para el desplazamiento vertical, botón Parachoques para el desplazamiento horizontal	N/A

Algunas diferencias clave que debes tener en cuenta al diseñar tu aplicación para UWP para usarla con el panel de juegos y el uso del control remoto incluyen:

• La entrada de texto requiere que el usuario presione A para activar un control de texto.

• La navegación de foco no se limita a los grupos de control, los usuarios pueden navegar libremente a cualquier elemento de interfaz de usuario que pueda centrarse en la aplicación.

  NOTA El foco puede moverse a cualquier elemento de interfaz de usuario focalizable en la dirección de la tecla presionada, a menos que esté en una interfaz de usuario de superposición o se especifique interacción de enfoque, lo que impide que el foco entre o salga de una región hasta que se active o se desenganche con el botón A. Para obtener más información, consulta la sección de navegación direccional .

• Los botones D-pad y stick izquierdo se usan para mover el foco entre los controles y para la navegación interna.

  NOTA Controlador para juegos y control remoto solo navegan a los elementos que están en el mismo orden visual que la tecla direccional presionada. La navegación está deshabilitada en esa dirección cuando no hay ningún elemento posterior que pueda recibir el foco. En función de la situación, los usuarios del teclado no siempre tienen esa restricción. Consulta la sección Optimización de teclado integrada para obtener más información.

Navegación direccional

La navegación direccional se administra mediante una clase auxiliar del Administrador de foco de UWP, que toma la tecla direccional presionada (tecla de flecha, panel D) e intenta mover el foco en la dirección visual correspondiente.

A diferencia del teclado, cuando una aplicación opta por no participar en el modo mouse, la navegación direccional se aplica en toda la aplicación para el controlador para juegos y el control remoto. Consulta Interacciones de controlador para juegos y control remoto para obtener más información sobre la optimización de navegación direccional.

NOTA La navegación mediante la tecla Tab del teclado no se considera navegación direccional. Para obtener más información, consulta la sección Tabulaciones .

Navegación direccional admitida Con teclas direccionales (flechas de teclado, controlador para juegos y control remoto D-pad), el usuario puede navegar entre diferentes controles.

No se admite la navegación direccionalEl usuario no puede navegar entre distintos controles mediante claves direccionales. Otros métodos de navegación entre controles (tecla de tabulación) no se ven afectados.

Optimización de teclado integrada

Dependiendo del diseño y los controles usados, las aplicaciones para UWP se pueden optimizar específicamente para la entrada del teclado.

En el ejemplo siguiente, se muestra un grupo de elementos de lista, elementos de rejilla y elementos de menú que han sido asignados a una sola tabulación (consulte la sección Tabulaciones). Cuando el grupo tiene el foco, la navegación interna se realiza con las teclas de dirección en el orden visual adecuado (consulte la sección Navegación).

Navegación de teclas de flecha de columna única

Navegación de teclas de flecha de fila única

Navegación con teclas de flechas por varias columnas o filas

Ajustar elementos homogéneos de lista y vista de cuadrícula

La navegación direccional no siempre es la manera más eficaz de navegar por varias filas y columnas de elementos List y GridView.

NOTA Los elementos de menú suelen ser listas de columnas únicas, pero es posible que se apliquen reglas de enfoque especiales en algunos casos (consulte Interfaz de usuario emergente).

Los objetos List y Grid se pueden crear con varias filas y columnas. Normalmente están en orden por filas (donde los elementos rellenan primero toda la fila antes de pasar a la siguiente fila) o en orden por columnas (donde los elementos rellenan primero toda la columna antes de pasar a la siguiente columna). El orden principal de fila o columna depende de la dirección del desplazamiento y debe asegurarse de que el orden de los elementos no entra en conflicto con esta dirección.

En orden de fila principal (donde los elementos se rellenan de izquierda a derecha, arriba abajo), cuando el foco está en el último elemento de una fila y se presiona la tecla de flecha derecha, el foco se mueve al primer elemento de la fila siguiente. Este mismo comportamiento se produce inverso: cuando el foco se establece en el primer elemento de una fila y se presiona la tecla de flecha izquierda, el foco se mueve al último elemento de la fila anterior.

En el orden de columna principal (donde los elementos se rellenan de arriba a abajo, de izquierda a derecha), cuando el foco está en el último elemento de una columna y el usuario presiona la tecla de flecha abajo, el foco se mueve al primer elemento de la columna siguiente. Este mismo comportamiento se produce inverso: cuando el foco se establece en el primer elemento de una columna y se presiona la tecla de flecha arriba, el foco se mueve al último elemento de la columna anterior.

Navegación por teclado en filas principales

Navegación por teclado principal de columna

Interfaz de usuario emergente

Como se mencionó, debe intentar asegurarse de que la navegación direccional corresponde al orden visual de los controles de la interfaz de usuario de la aplicación.

Algunos controles (como el menú contextual, el menú de desbordamiento CommandBar y el menú AutoSuggest) muestran un menú emergente en una ubicación y dirección (hacia abajo de forma predeterminada) en relación con el control principal y el espacio de pantalla disponible. Tenga en cuenta que la dirección de apertura puede verse afectada por una variedad de factores en tiempo de ejecución.

Para estos controles, cuando se abre el menú por primera vez (y el usuario no ha seleccionado ningún elemento), la tecla de flecha abajo siempre establece el foco en el primer elemento mientras que la tecla de flecha arriba siempre establece el foco en el último elemento del menú.

Si el último elemento tiene el foco y se presiona la tecla de flecha abajo, el foco se mueve al primer elemento del menú. Del mismo modo, si el primer elemento tiene el foco y se presiona la tecla de flecha arriba, el foco se mueve al último elemento del menú. Este comportamiento se conoce como ciclismo y es útil para navegar por menús emergentes que pueden abrirse en direcciones impredecibles.

Nota:

Se debe evitar el ciclismo en las interfaces de usuario que no sean emergentes, donde los usuarios pueden llegar a sentirse atrapados en un bucle sin fin.

Se recomienda emular estos mismos comportamientos en los controles personalizados. El ejemplo de código sobre cómo implementar este comportamiento se puede encontrar en la documentación de navegación de foco mediante programación .

Prueba de la aplicación

Pruebe la aplicación con todos los dispositivos de entrada compatibles para asegurarse de que los elementos de la interfaz de usuario se pueden navegar de forma coherente e intuitiva y que ningún elemento inesperado interfiere con el orden de tabulación deseado.

Artículos relacionados

• Eventos de teclado
• Identificación de dispositivos de entrada
• Responder a la presencia del teclado táctil
• ejemplo de elementos visuales de enfoque
• Detalles de teclado del control NavigationView
• Accesibilidad del teclado

Apéndice

Teclado de software

Un teclado de software se muestra en pantalla y se utiliza en lugar del teclado físico para escribir e introducir datos mediante táctil, mouse, lápiz óptico u otro dispositivo señalador. En los dispositivos de juego, las teclas individuales deben seleccionarse moviendo el objeto visual de foco o usando teclas de método abreviado en un mando de juego o un control remoto.

Teclado táctil

Teclado táctil de Windows 11

Dependiendo del dispositivo, el teclado táctil aparece cuando un campo de texto u otro control de texto editable obtiene el foco, o cuando el usuario lo habilita manualmente a través del Centro de notificaciones:

Si la aplicación establece el foco mediante programación en un control de entrada de texto, no se invoca el teclado táctil. Esto elimina comportamientos inesperados no instiados directamente por el usuario. Sin embargo, el teclado se oculta automáticamente cuando el foco se mueve mediante programación a un control de entrada que no es de texto.

El teclado táctil normalmente permanece visible mientras el usuario navega entre los controles de un formulario. Este comportamiento puede variar en función de los otros tipos de control dentro del formulario.

A continuación se muestra una lista de controles que no son de edición que pueden recibir el foco durante una sesión de entrada de texto mediante el teclado táctil sin descartar el teclado. En lugar de cambiar innecesariamente la interfaz de usuario y posiblemente desorientar al usuario, el teclado táctil permanece a la vista porque es probable que el usuario alterne entre estos controles y la entrada de texto con el teclado táctil.

• Casilla
• Cuadro combinado
• Botón de radio
• Barra de desplazamiento
• Tree
• Elemento de árbol
• Menú
• Barra de menús
• Elemento de menú
• Barra de herramientas
• List
• Elemento de lista

Estos son ejemplos de diferentes modos para el teclado táctil. La primera imagen es el diseño predeterminado, el segundo es el diseño expandido (que podría no estar disponible en todos los idiomas).

Teclado táctil en modo de diseño predeterminado

Teclado táctil en modo de diseño expandido

Las interacciones de teclado correctas permiten a los usuarios realizar escenarios básicos de aplicaciones con solo el teclado; es decir, los usuarios pueden llegar a todos los elementos interactivos y activar la funcionalidad predeterminada. Varios factores pueden afectar al grado de éxito, incluida la navegación por teclado, las teclas de acceso para la accesibilidad y las teclas de aceleración (o método abreviado) para los usuarios avanzados.

Teclado en pantalla

Al igual que el teclado táctil, el Teclado en pantalla (OSK) es un teclado visual, de software usado en lugar del teclado físico para escribir y escribir datos mediante la entrada táctil, el mouse, el lápiz o el lápiz óptico u otro dispositivo señalador (no se requiere una pantalla táctil). El OSK se proporciona para sistemas que no tienen un teclado físico o para los usuarios cuyas discapacidades de movilidad les impiden usar dispositivos de entrada físico tradicionales. El OSK emula la mayoría, si no todos, la funcionalidad de un teclado de hardware.

El OSK se puede activar desde la página Teclado en Configuración > Facilidad de acceso.

NOTA El OSK tiene prioridad sobre el teclado táctil, que no se mostrará si el OSK está presente.

Teclado en pantalla

Teclado en pantalla de Xbox One

Para obtener más información, consulte Usar el teclado en pantalla para escribir.