Расширение размера шрифта устройства иногда прерывается (Styling wise).
Как отключить масштабирование шрифтов в React Native для приложения IOS?
Ответ 1
Для React native 0. 58+
Желательно сохранить масштабирование шрифта, но вы можете ограничить его, используя Text new prop maxFontSizeMultiplier
Для React native 0. 56+ используйте ответ Леви
Text.defaultProps = Text.defaultProps || {};
Text.defaultProps.allowFontScaling = false;
Для Реакта родного 0,55 и ниже
Добавьте Text.defaultProps.allowFontScaling=false
в начале приложения (например, main.js или app.js и т.д.), Чтобы применить эту опору ко всем компонентам Text во всем приложении.
Ответ 2
Отключение масштабирования шрифтов может ухудшить доступность вашего приложения, в идеале, если вы хотите ограничить масштабирование для приложений, использующих React native 0.58.0 и выше; используйте maxFontSizeMultiplier
prop для определенных компонентов Text
.
Однако, если вы абсолютно хотите отключить масштабирование шрифтов во всем приложении, вы можете сделать это глобально, установив allowFontScaling
prop в defaultProps
в Text
.
Для React Native 0.56. 0+
Text.defaultProps = Text.defaultProps || {};
Text.defaultProps.allowFontScaling = false;
Для более ранних версий React Native вам нужна только вторая строка, но наличие обеих не повредит. Первая строка просто защищает от компонента Text
, не имеющего defaultProps
, как в случае с React Native 0.56.0 и выше.
Добавьте вышеуказанные строки в файл точки входа вашего приложения React Native (обычно index.js
, app.js
или main.js
), чтобы применить эту опору ко всем компонентам Text
в вашем приложении.
Эта реквизит влияет только на компоненты Text
, и вы можете применить те же изменения к TextInput
, что можно сделать с помощью аналогичного фрагмента:
TextInput.defaultProps = TextInput.defaultProps || {};
TextInput.defaultProps.allowFontScaling = false;
Также обратите внимание, что некоторые компоненты не подчиняются настройкам масштабирования шрифта, например: Alert
, PickerIOS
, DatePickerIOS
, TabBarIOS
, SegmentedControlIOS
, поскольку все они изначально прорисованы и не зависят от Text
компонент.
Ответ 3
Создайте компонент <AppText>
и используйте его со своими предустановками вместо исходных, с вашими собственными настройками по умолчанию, включая масштабирование шрифта false. Это лучше, потому что вы можете обогатить его своим собственным API.
Например, мой AppText разрешает делать такие вещи, как:
<AppText id="some.translation.key" color="primary" size="l" underline italic bold/>
Ответ 4
if (Text.defaultProps == null) {
Text.defaultProps = {};
Text.defaultProps.allowFontScaling = false;
}
Я сохранил этот кусок кода внутри конструктора index.js
Он действительно работал хорошо. К тому же я использую реагирующую версию 0.59.9
FYI.