Метод setAccessibilityFocus

Метод setAccessibilityFocus класса AccessibilityInfo принимает номер узла reactTag. Номер берут через findNodeHandle и ссылку ref на компонент. После вызова чтение с экрана озвучит выбранный элемент.

Синтаксис

import { findNodeHandle } from 'react-native';

const tag = findNodeHandle(ref.current);
AccessibilityInfo.setAccessibilityFocus(tag);

Параметры

Параметр	Описание
`reactTag`	Номер узла из `findNodeHandle` для элемента с `ref`.

Пример

Давайте перенесём фокус на второй текст после ошибки:

import { useRef } from 'react';
import {
	View,
	Text,
	Button,
	findNodeHandle,
	AccessibilityInfo,
} from 'react-native';

export default function App() {
	const targetRef = useRef(null);

	const onPress = () => {
		const tag = findNodeHandle(targetRef.current);
		if (tag != null) {
			AccessibilityInfo.setAccessibilityFocus(tag);
		}
	};

	return (
		<View>
			<Text>abcde</Text>
			<Text ref={targetRef} accessibilityRole="text">
				12345
			</Text>
			<Button title="abcde" onPress={onPress} />
		</View>
	);
}

На экране два текста и кнопка. После нажатия чтение с экрана перейдёт к строке '12345'.

Пример

Давайте сфокусируем скрытое поле после проверки формы:

import { useRef } from 'react';
import {
	View,
	TextInput,
	Button,
	findNodeHandle,
	AccessibilityInfo,
} from 'react-native';

export default function App() {
	const inputRef = useRef(null);

	const onValidate = () => {
		const tag = findNodeHandle(inputRef.current);
		if (tag != null) {
			AccessibilityInfo.setAccessibilityFocus(tag);
		}
	};

	return (
		<View>
			<TextInput ref={inputRef} accessibilityLabel="abcde" />
			<Button title="12345" onPress={onValidate} />
		</View>
	);
}

На экране поле и кнопка. После нажатия фокус чтения окажется на поле с подписью 'abcde'.

Смотрите также

метод announceForAccessibility,
который произносит фразу без смены фокуса
метод isScreenReaderEnabled,
который проверяет, включено ли чтение
компонент TextInput,
к которому часто переносят фокус после ошибки
класс AccessibilityInfo,
который содержит метод setAccessibilityFocus