Orden de enfoque y navegación por teclado

Q: ¿React Native admite navegación completa por teclado como la web?

Parcialmente - TextInput y pressables enfocables son los componentes básicos principales. Widgets complejos (cuadrículas, árboles) necesitan accessibilityActions explícitos y gestión de enfoque.

Q: ¿Cómo muevo el enfoque de TalkBack mediante programación?

AccessibilityInfo.setAccessibilityFocus(reactTag) con findNodeHandle(ref.current). Prefiere refs en Text o View con un accessibilityRole="header" claro.

Teclado externo y control de conmutador en tablets. Una guía para orden de enfoque, teclados externos y navegación por conmutador en iPad, tablets Android y dispositivos plegables - donde los diseños táctiles se rompen para usuarios sin toque.

Receta

Tarjeta de referencia rápida - lista para copiar y pegar.

import { useRef } from "react";
import { FlatList, Pressable, Text, TextInput, View, StyleSheet } from "react-native";
 
export function KeyboardFriendlyForm() {
  const emailRef = useRef<TextInput>(null);
  const passwordRef = useRef<TextInput>(null);
 
  return (
    <View style={styles.form}>
      <Text nativeID="emailLabel" style={styles.label}>
        Correo electrónico
      </Text>
      <TextInput
        ref={emailRef}
        accessibilityLabel="Correo electrónico"
        accessibilityLabelledBy="emailLabel"
        returnKeyType="next"
        blurOnSubmit={false}
        onSubmitEditing={() => passwordRef.current?.focus()}
        style={styles.input}
      />
 
      <Text nativeID="passwordLabel" style={styles.label}>
        Contraseña
      </Text>
      <TextInput
        ref={passwordRef}
        accessibilityLabel="Contraseña"
        accessibilityLabelledBy="passwordLabel"
        secureTextEntry
        returnKeyType="done"
        style={styles.input}
      />
 
      <Pressable
        accessibilityRole="button"
        accessibilityLabel="Iniciar sesión"
        focusable
        style={styles.button}
      >
        <Text style={styles.buttonText}>Iniciar sesión</Text>
      </Pressable>
    </View>
  );
}
 
const styles = StyleSheet.create({
  form: { padding: 16, gap: 8 },
  label: { fontWeight: "600" },
  input: { borderWidth: 1, borderColor: "#cbd5e1", borderRadius: 8, padding: 12 },
  button: { minHeight: 44, backgroundColor: "#2563eb", borderRadius: 8, justifyContent: "center", alignItems: "center" },
  buttonText: { color: "#fff", fontWeight: "600" },
});

Cuándo usarlo: diseños de tablet, accesorios de teclado externo, usuarios de Switch Control y cualquier pantalla donde la tecnología de asistencia deba recorrer controles en una secuencia predecible - especialmente flujos maestro-detalle y modales.

Ejemplo funcional

Maestro-detalle en una tablet: seleccionar un elemento de lista mueve el enfoque del lector de pantalla y el enfoque del teclado al encabezado de detalles.

import { useEffect, useRef, useState } from "react";
import {
  AccessibilityInfo,
  FlatList,
  Pressable,
  Text,
  View,
  StyleSheet,
  findNodeHandle,
} from "react-native";
 
type Item = { id: string; title: string; body: string };
 
const DATA: Item[] = [
  { id: "1", title: "Factura #1042", body: "Vence 12 de abril" },
  { id: "2", title: "Factura #1043", body: "Pagado" },
];
 
export function MasterDetail({ width }: { width: number }) {
  const isSplit = width >= 768;
  const [selectedId, setSelectedId] = useState(DATA[0].id);
  const detailTitleRef = useRef<Text>(null);
  const selected = DATA.find((d) => d.id === selectedId)!;
 
  useEffect(() => {
    if (!isSplit) return;
    const node = findNodeHandle(detailTitleRef.current);
    if (node) {
      AccessibilityInfo.setAccessibilityFocus(node);
    }
  }, [selectedId, isSplit]);
 
  return (
    <View style={styles.split}>
      <FlatList
        style={styles.list}
        data={DATA}
        keyExtractor={(item) => item.id}
        renderItem={({ item }) => (
          <Pressable
            accessibilityRole="button"
            accessibilityLabel={item.title}
            accessibilityState={{ selected: item.id === selectedId }}
            focusable
            onPress={() => setSelectedId(item.id)}
            style={[styles.row, item.id === selectedId && styles.rowSelected]}
          >
            <Text>{item.title}</Text>
          </Pressable>
        )}
      />
      {isSplit ? (
        <View style={styles.detail} accessibilityLabel="Detalles de factura">
          <Text
            ref={detailTitleRef}
            accessibilityRole="header"
            style={styles.detailTitle}
          >
            {selected.title}
          </Text>
          <Text>{selected.body}</Text>
        </View>
      ) : null}
    </View>
  );
}
 
const styles = StyleSheet.create({
  split: { flex: 1, flexDirection: "row" },
  list: { flex: 1, maxWidth: 320 },
  row: { padding: 16, minHeight: 48 },
  rowSelected: { backgroundColor: "#e0f2fe" },
  detail: { flex: 2, padding: 24, gap: 8 },
  detailTitle: { fontSize: 22, fontWeight: "700" },
});

Lo que esto demuestra:

focusable en filas de lista para recorrido de teclado externo
accessibilityState.selected expone la selección de lista a TalkBack
AccessibilityInfo.setAccessibilityFocus mueve VoiceOver al encabezado de detalles cuando cambia la selección
Diseño dividido solo en pantallas anchas - navegación de pila de teléfono sin cambios

Patrones de la guía

Patrón 1: El orden de lectura coincide con el orden visual

React Native no es compatible con reordenación de enfoque de estilo CSS order. Estructura JSX para que el árbol nativo coincida con la secuencia prevista.

// Preferido - título antes de acciones en JSX
<View>
  <Text accessibilityRole="header">Cuenta</Text>
  <Pressable accessibilityRole="button" accessibilityLabel="Editar perfil" />
  <Pressable accessibilityRole="button" accessibilityLabel="Cerrar sesión" />
</View>
 
// Evitar - acciones posicionadas visualmente por encima del título con diseño absoluto
// Los lectores de pantalla todavía leen en orden JSX a menos que ocultes/reestructures

Técnica	Cuándo usarla
Reordenar JSX	Por defecto - la más barata y confiable
`importantForAccessibility="no-hide-descendants"`	Omitir columnas decorativas
`setAccessibilityFocus`	Después de cambios de navegación o selección
Fusionar con `accessible` en padre	Un punto único para filas tocables complejas

Patrón 2: Teclado externo en tablets

Tecla / acción	Comportamiento esperado	Soporte RN
Tab / Shift+Tab	Moverse entre controles enfocables	Android + iPad teclado externo (depende de plataforma)
Intro / Espacio	Activar botón enfocado	`Pressable` con `focusable`
Teclas de flecha en listas	A menudo se asigna a desplazamiento, no enfoque de elemento	Complementar con semántica de lista explícita
Escape	Cerrar modal	Conecta `BackHandler` + restauración de enfoque

<Pressable
  focusable
  accessibilityRole="button"
  accessibilityLabel="Cerrar"
  onPress={onClose}
/>

TextInput es enfocable por defecto - encadena campos con returnKeyType="next" y refs
Prueba iPad Magic Keyboard y Samsung DeX si tu aplicación se destina a tablets de productividad

Patrón 3: Switch Control y navegación secuencial

Switch Control (iOS) y Switch Access (Android) escanean elementos enfocables. Reduce paradas:

<Pressable
  accessibilityRole="button"
  accessibilityLabel={`${productName}, ${price}, agregar al carrito`}
  onPress={addToCart}
  style={styles.row}
>
  <View importantForAccessibility="no-hide-descendants" accessibilityElementsHidden>
    {/* diseño visual */}
  </View>
</Pressable>

Menos paradas de enfoque = escaneo más rápido para usuarios de conmutador
Proporciona accessibilityActions en controles ajustables - ver accessibilityLabel y accessibilityRole
Evita carruseles con avance automático sin pausa - los usuarios de conmutador no pueden interceptar temporizadores rápidos

import { Modal, Pressable, Text, View, StyleSheet } from "react-native";
 
export function ConfirmModal({ visible, onConfirm, onCancel }: {
  visible: boolean;
  onConfirm: () => void;
  onCancel: () => void;
}) {
  return (
    <Modal visible={visible} animationType="fade" transparent>
      <View style={styles.backdrop}>
        <View
          style={styles.sheet}
          accessibilityViewIsModal
          accessibilityLabel="Confirmar eliminación"
        >
          <Text accessibilityRole="header">¿Eliminar elemento?</Text>
          <Pressable
            focusable
            accessibilityRole="button"
            accessibilityLabel="Confirmar eliminación"
            onPress={onConfirm}
          >
            <Text>Eliminar</Text>
          </Pressable>
          <Pressable
            focusable
            accessibilityRole="button"
            accessibilityLabel="Cancelar"
            onPress={onCancel}
          >
            <Text>Cancelar</Text>
          </Pressable>
        </View>
      </View>
    </Modal>
  );
}
 
const styles = StyleSheet.create({
  backdrop: { flex: 1, backgroundColor: "rgba(0,0,0,0.5)", justifyContent: "center", padding: 24 },
  sheet: { backgroundColor: "#fff", borderRadius: 12, padding: 20, gap: 12 },
});

accessibilityViewIsModal evita que VoiceOver acceda al contenido bajo la hoja
Al descartar, setAccessibilityFocus regresa al control que lo desencadenó
El primero enfocable en el modal debe ser el título o acción principal - documenta en scripts de QA

Patrón 5: Android nextFocusForward (Opcional)

Para saltos de enfoque de hardware deterministas en Android TV o teclados personalizados:

<Pressable
  nativeID="filterButton"
  focusable
  nextFocusDown="resultsList"
/>

Los ID deben coincidir con nativeID en la vista de destino
Úsalo con moderación - prefiere el orden de árbol natural cuando sea posible

Patrón 6: Vista dividida de tablet con Expo Router

Patrones de diseño de enlace cruzado:

// Ancho: lista + detalle lado a lado - el enfoque se mueve a detalles al seleccionar
// Estrecho: push de pila a ruta de detalle - el enfoque llega al encabezado de detalles al montar

Ver Vista dividida y diseños de tablet para estructura de enrutamiento; esta página cubre comportamiento de enfoque después de divisiones de diseño.

Inmersión profunda

Cómo difiere el enfoque de la web

Sin tabIndex - usa focusable y jerarquía nativa.
Radix-style roving tabindex no existe - simula con selección con estado y setAccessibilityFocus.
ScrollViews no mueven automáticamente el enfoque a hijos fuera de pantalla - anuncia cambios de ruta en su lugar.

Matriz de prueba

Configuración	Qué verificar
VoiceOver + teclado iPad	Tabulación a través del formulario; Intro activa botones
TalkBack + teclado Bluetooth	Orden de enfoque en maestro-detalle
Switch Control (iOS)	El escaneo golpea cada fila procesable una vez
Controles de lectura de TalkBack	Encabezados navegables a través de equivalente de rotor

Lista de verificación de restauración de enfoque

El usuario abre modal - enfoque dentro del título modal
El usuario cierra modal - el enfoque regresa al disparador
El usuario elimina elemento de lista - el enfoque se mueve a la siguiente fila o estado vacío
El usuario envía formulario con errores - enfoque en el primer campo no válido - Accesibilidad en formularios

Errores comunes

Reorden de FlatList - cambios de datos dinámicos pueden mover nodos; vuelve a probar enfoque después de ordenar/filtrar.
Superposiciones de gestos - pueden interceptar teclas si no se emparejan con Pressable accesible.
Pestañas ocultas fuera de pantalla - montar todas las pestañas y ocultar con display: 'none' atrapa enfoque; desmonta rutas inactivas u oculta descendientes.
AutoFocus en cada pantalla - desorientación a usuarios de lector de pantalla; enfoca el primer campo solo en formularios vacíos.
Inserciones de WebView - bucle de enfoque separado; proporciona escape nativo.

Preguntas frecuentes

¿React Native admite navegación completa por teclado como la web?

Parcialmente - TextInput y pressables enfocables son los componentes básicos principales.
Widgets complejos (cuadrículas, árboles) necesitan accessibilityActions explícitos y gestión de enfoque.

¿Cómo muevo el enfoque de TalkBack mediante programación?

AccessibilityInfo.setAccessibilityFocus(reactTag) con findNodeHandle(ref.current).
Prefiere refs en Text o View con un accessibilityRole="header" claro.

¿Deberían ser enfocables los elementos de lista en teléfono?

Sí cuando la fila es la unidad procesable - usuarios de conmutador y teclado se benefician incluso sin tablets.
Asegura que cada fila tenga una etiqueta combinada concisa.

Relacionado

Conceptos básicos de accesibilidad - fundamentos VoiceOver/TalkBack
accessibilityLabel y accessibilityRole - roles y agrupación para filas
Vista dividida y diseños de tablet - enrutamiento maestro-detalle
Accesibilidad en formularios - envío de enfoque y enfoque de error
Rutas modales y de presentación - patrones de presentación de hoja
Mejores prácticas de accesibilidad - resumen de sección

Versiones de pila: Esta página fue escrita para React 19.2.3, React Native 0.86.0 y Expo SDK 57 (expo ~57.0.4).

Receta

Tarjeta de referencia rápida - lista para copiar y pegar.

import { useRef } from "react";
import { FlatList, Pressable, Text, TextInput, View, StyleSheet } from "react-native";
 
export function KeyboardFriendlyForm() {
  const emailRef = useRef<TextInput>(null);
  const passwordRef = useRef<TextInput>(null);
 
  return (
    <View style={styles.form}>
      <Text nativeID="emailLabel" style={styles.label}>
        Correo electrónico
      </Text>
      <TextInput
        ref={emailRef}
        accessibilityLabel="Correo electrónico"
        accessibilityLabelledBy="emailLabel"
        returnKeyType="next"
        blurOnSubmit={false}
        onSubmitEditing={() => passwordRef.current?.focus()}
        style={styles.input}
      />
 
      <Text nativeID="passwordLabel" style={styles.label}>
        Contraseña
      </Text>
      <TextInput
        ref={passwordRef}
        accessibilityLabel="Contraseña"
        accessibilityLabelledBy="passwordLabel"
        secureTextEntry
        returnKeyType="done"
        style={styles.input}
      />
 
      <Pressable
        accessibilityRole="button"
        accessibilityLabel="Iniciar sesión"
        focusable
        style={styles.button}
      >
        <Text style={styles.buttonText}>Iniciar sesión</Text>
      </Pressable>
    </View>
  );
}
 
const styles = StyleSheet.create({
  form: { padding: 16, gap: 8 },
  label: { fontWeight: "600" },
  input: { borderWidth: 1, borderColor: "#cbd5e1", borderRadius: 8, padding: 12 },
  button: { minHeight: 44, backgroundColor: "#2563eb", borderRadius: 8, justifyContent: "center", alignItems: "center" },
  buttonText: { color: "#fff", fontWeight: "600" },
});

Ejemplo funcional

Maestro-detalle en una tablet: seleccionar un elemento de lista mueve el enfoque del lector de pantalla y el enfoque del teclado al encabezado de detalles.

import { useEffect, useRef, useState } from "react";
import {
  AccessibilityInfo,
  FlatList,
  Pressable,
  Text,
  View,
  StyleSheet,
  findNodeHandle,
} from "react-native";
 
type Item = { id: string; title: string; body: string };
 
const DATA: Item[] = [
  { id: "1", title: "Factura #1042", body: "Vence 12 de abril" },
  { id: "2", title: "Factura #1043", body: "Pagado" },
];
 
export function MasterDetail({ width }: { width: number }) {
  const isSplit = width >= 768;
  const [selectedId, setSelectedId] = useState(DATA[0].id);
  const detailTitleRef = useRef<Text>(null);
  const selected = DATA.find((d) => d.id === selectedId)!;
 
  useEffect(() => {
    if (!isSplit) return;
    const node = findNodeHandle(detailTitleRef.current);
    if (node) {
      AccessibilityInfo.setAccessibilityFocus(node);
    }
  }, [selectedId, isSplit]);
 
  return (
    <View style={styles.split}>
      <FlatList
        style={styles.list}
        data={DATA}
        keyExtractor={(item) => item.id}
        renderItem={({ item }) => (
          <Pressable
            accessibilityRole="button"
            accessibilityLabel={item.title}
            accessibilityState={{ selected: item.id === selectedId }}
            focusable
            onPress={() => setSelectedId(item.id)}
            style={[styles.row, item.id === selectedId && styles.rowSelected]}
          >
            <Text>{item.title}</Text>
          </Pressable>
        )}
      />
      {isSplit ? (
        <View style={styles.detail} accessibilityLabel="Detalles de factura">
          <Text
            ref={detailTitleRef}
            accessibilityRole="header"
            style={styles.detailTitle}
          >
            {selected.title}
          </Text>
          <Text>{selected.body}</Text>
        </View>
      ) : null}
    </View>
  );
}
 
const styles = StyleSheet.create({
  split: { flex: 1, flexDirection: "row" },
  list: { flex: 1, maxWidth: 320 },
  row: { padding: 16, minHeight: 48 },
  rowSelected: { backgroundColor: "#e0f2fe" },
  detail: { flex: 2, padding: 24, gap: 8 },
  detailTitle: { fontSize: 22, fontWeight: "700" },
});

Lo que esto demuestra:

focusable en filas de lista para recorrido de teclado externo
accessibilityState.selected expone la selección de lista a TalkBack
AccessibilityInfo.setAccessibilityFocus mueve VoiceOver al encabezado de detalles cuando cambia la selección
Diseño dividido solo en pantallas anchas - navegación de pila de teléfono sin cambios

Patrones de la guía

Patrón 1: El orden de lectura coincide con el orden visual

React Native no es compatible con reordenación de enfoque de estilo CSS order. Estructura JSX para que el árbol nativo coincida con la secuencia prevista.

// Preferido - título antes de acciones en JSX
<View>
  <Text accessibilityRole="header">Cuenta</Text>
  <Pressable accessibilityRole="button" accessibilityLabel="Editar perfil" />
  <Pressable accessibilityRole="button" accessibilityLabel="Cerrar sesión" />
</View>
 
// Evitar - acciones posicionadas visualmente por encima del título con diseño absoluto
// Los lectores de pantalla todavía leen en orden JSX a menos que ocultes/reestructures

Técnica	Cuándo usarla
Reordenar JSX	Por defecto - la más barata y confiable
`importantForAccessibility="no-hide-descendants"`	Omitir columnas decorativas
`setAccessibilityFocus`	Después de cambios de navegación o selección
Fusionar con `accessible` en padre	Un punto único para filas tocables complejas

Patrón 2: Teclado externo en tablets

Tecla / acción	Comportamiento esperado	Soporte RN
Tab / Shift+Tab	Moverse entre controles enfocables	Android + iPad teclado externo (depende de plataforma)
Intro / Espacio	Activar botón enfocado	`Pressable` con `focusable`
Teclas de flecha en listas	A menudo se asigna a desplazamiento, no enfoque de elemento	Complementar con semántica de lista explícita
Escape	Cerrar modal	Conecta `BackHandler` + restauración de enfoque

<Pressable
  focusable
  accessibilityRole="button"
  accessibilityLabel="Cerrar"
  onPress={onClose}
/>

TextInput es enfocable por defecto - encadena campos con returnKeyType="next" y refs
Prueba iPad Magic Keyboard y Samsung DeX si tu aplicación se destina a tablets de productividad

Patrón 3: Switch Control y navegación secuencial

Switch Control (iOS) y Switch Access (Android) escanean elementos enfocables. Reduce paradas:

<Pressable
  accessibilityRole="button"
  accessibilityLabel={`${productName}, ${price}, agregar al carrito`}
  onPress={addToCart}
  style={styles.row}
>
  <View importantForAccessibility="no-hide-descendants" accessibilityElementsHidden>
    {/* diseño visual */}
  </View>
</Pressable>

Menos paradas de enfoque = escaneo más rápido para usuarios de conmutador
Proporciona accessibilityActions en controles ajustables - ver accessibilityLabel y accessibilityRole
Evita carruseles con avance automático sin pausa - los usuarios de conmutador no pueden interceptar temporizadores rápidos

import { Modal, Pressable, Text, View, StyleSheet } from "react-native";
 
export function ConfirmModal({ visible, onConfirm, onCancel }: {
  visible: boolean;
  onConfirm: () => void;
  onCancel: () => void;
}) {
  return (
    <Modal visible={visible} animationType="fade" transparent>
      <View style={styles.backdrop}>
        <View
          style={styles.sheet}
          accessibilityViewIsModal
          accessibilityLabel="Confirmar eliminación"
        >
          <Text accessibilityRole="header">¿Eliminar elemento?</Text>
          <Pressable
            focusable
            accessibilityRole="button"
            accessibilityLabel="Confirmar eliminación"
            onPress={onConfirm}
          >
            <Text>Eliminar</Text>
          </Pressable>
          <Pressable
            focusable
            accessibilityRole="button"
            accessibilityLabel="Cancelar"
            onPress={onCancel}
          >
            <Text>Cancelar</Text>
          </Pressable>
        </View>
      </View>
    </Modal>
  );
}
 
const styles = StyleSheet.create({
  backdrop: { flex: 1, backgroundColor: "rgba(0,0,0,0.5)", justifyContent: "center", padding: 24 },
  sheet: { backgroundColor: "#fff", borderRadius: 12, padding: 20, gap: 12 },
});

accessibilityViewIsModal evita que VoiceOver acceda al contenido bajo la hoja
Al descartar, setAccessibilityFocus regresa al control que lo desencadenó
El primero enfocable en el modal debe ser el título o acción principal - documenta en scripts de QA

Patrón 5: Android nextFocusForward (Opcional)

Para saltos de enfoque de hardware deterministas en Android TV o teclados personalizados:

<Pressable
  nativeID="filterButton"
  focusable
  nextFocusDown="resultsList"
/>

Los ID deben coincidir con nativeID en la vista de destino
Úsalo con moderación - prefiere el orden de árbol natural cuando sea posible

Patrón 6: Vista dividida de tablet con Expo Router

Patrones de diseño de enlace cruzado:

// Ancho: lista + detalle lado a lado - el enfoque se mueve a detalles al seleccionar
// Estrecho: push de pila a ruta de detalle - el enfoque llega al encabezado de detalles al montar

Ver Vista dividida y diseños de tablet para estructura de enrutamiento; esta página cubre comportamiento de enfoque después de divisiones de diseño.

Inmersión profunda

Cómo difiere el enfoque de la web

Sin tabIndex - usa focusable y jerarquía nativa.
Radix-style roving tabindex no existe - simula con selección con estado y setAccessibilityFocus.
ScrollViews no mueven automáticamente el enfoque a hijos fuera de pantalla - anuncia cambios de ruta en su lugar.

Matriz de prueba

Configuración	Qué verificar
VoiceOver + teclado iPad	Tabulación a través del formulario; Intro activa botones
TalkBack + teclado Bluetooth	Orden de enfoque en maestro-detalle
Switch Control (iOS)	El escaneo golpea cada fila procesable una vez
Controles de lectura de TalkBack	Encabezados navegables a través de equivalente de rotor

Lista de verificación de restauración de enfoque

El usuario abre modal - enfoque dentro del título modal
El usuario cierra modal - el enfoque regresa al disparador
El usuario elimina elemento de lista - el enfoque se mueve a la siguiente fila o estado vacío
El usuario envía formulario con errores - enfoque en el primer campo no válido - Accesibilidad en formularios

Errores comunes

Reorden de FlatList - cambios de datos dinámicos pueden mover nodos; vuelve a probar enfoque después de ordenar/filtrar.
Superposiciones de gestos - pueden interceptar teclas si no se emparejan con Pressable accesible.
Pestañas ocultas fuera de pantalla - montar todas las pestañas y ocultar con display: 'none' atrapa enfoque; desmonta rutas inactivas u oculta descendientes.
AutoFocus en cada pantalla - desorientación a usuarios de lector de pantalla; enfoca el primer campo solo en formularios vacíos.
Inserciones de WebView - bucle de enfoque separado; proporciona escape nativo.

Preguntas frecuentes

¿React Native admite navegación completa por teclado como la web?

Parcialmente - TextInput y pressables enfocables son los componentes básicos principales.
Widgets complejos (cuadrículas, árboles) necesitan accessibilityActions explícitos y gestión de enfoque.

¿Cómo muevo el enfoque de TalkBack mediante programación?

AccessibilityInfo.setAccessibilityFocus(reactTag) con findNodeHandle(ref.current).
Prefiere refs en Text o View con un accessibilityRole="header" claro.

¿Deberían ser enfocables los elementos de lista en teléfono?

Sí cuando la fila es la unidad procesable - usuarios de conmutador y teclado se benefician incluso sin tablets.
Asegura que cada fila tenga una etiqueta combinada concisa.

Relacionado

Conceptos básicos de accesibilidad - fundamentos VoiceOver/TalkBack
accessibilityLabel y accessibilityRole - roles y agrupación para filas
Vista dividida y diseños de tablet - enrutamiento maestro-detalle
Accesibilidad en formularios - envío de enfoque y enfoque de error
Rutas modales y de presentación - patrones de presentación de hoja
Mejores prácticas de accesibilidad - resumen de sección

Versiones de pila: Esta página fue escrita para React 19.2.3, React Native 0.86.0 y Expo SDK 57 (expo ~57.0.4).

Orden de enfoque y navegación por teclado

Buscar en la documentación

Orden de enfoque y navegación por teclado