React Native: игнорировать динамическое масштабирование на iOS

Установите defaultProps глобально, чтобы определить размер шрифта и параметры специальных возможностей.

У Apple есть функция, с помощью которой люди, использующие очки для чтения или иным образом слабовидящие, могут регулировать размер текста на своих устройствах. Я видел, что это называется динамическим масштабированием или просто масштабированием шрифта, и это отличная функция, которая действительно важна для людей, чтобы они могли правильно использовать свои устройства.

При этом я не смог найти краткого и точного объяснения того, как работать с этой функцией в React Native. В частности, я хочу временно отключить динамическое масштабирование, так как я получаю отчеты об ошибках, в которых текст вытекает за пределы экрана и нажимает кнопки туда, где они также исчезают.

Самое быстрое решение на данный момент — отключить его по умолчанию во всем приложении, чтобы люди действительно могли использовать его, как ожидалось, пока я работаю над тем, как поддерживать его более изящным способом, чем просто заставлять Apple делать весь текст в приложение ГИГАНТ.

Параметры размера текста на iPhone можно найти в разделе «Настройки» > «Универсальный доступ» > «Дисплей и размер текста» > «Увеличенный текст» (если вы хотите проверить это сами)

Итак, если вы хотите отключить/игнорировать динамическое масштабирование текста на iOS в React Native, вот как это сделать. В корневом компоненте вашего приложения (в моем случае это App.js, расположенный в корневом каталоге) включите в конструктор следующий код:

// You'll probably have other things imported as well, but make sure Text is one of them
import { Text } from 'react-native';
...
constructor() {
    super();
    Text.defaultProps = Text.defaultProps || {};
    // Ignore dynamic type scaling on iOS
    Text.defaultProps.allowFontScaling = false; 
 }

Обратите внимание, что нам нужно вручную настроить defaultProps для объекта Text. Все, что мы делаем, это говорим: «Если уже есть defaultProps, круто, мы их сохраним. Если нет, мы установим его на пустой объект». Судя по ответам на форумах, которые я видел, кажется, что это причуда более поздних обновлений React Native, поэтому пока мы будем иметь с этим дело. С этой настройкой каждый раз, когда вы используете текст в своем приложении, по умолчанию будут использоваться эти настройки.

Это довольно простое решение, для понимания которого потребовалось немного погуглить, поэтому я надеюсь, что оно поможет вам собрать его в одном месте.

Как я упоминал выше, я определенно предлагаю всем нам выяснить, как более изящно работать с этой функцией, чтобы поддерживать доступность по всем направлениям, но если она вызывает проблемы и вам нужно отключить ее по умолчанию, пожалуйста.