Android: Add a maxFontSizeMultiplier prop to <Text> and <TextInput> #23069
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Equivalent of this iOS PR: facebook#20915 Motivation: ---------- Whenever a user changes the system font size to its maximum allowable setting, React Native apps that allow font scaling can become unusable because the text gets too big. Experimenting with a native app like iMessage on iOS, the font size used for non-body text (e.g. header, navigational elements) is capped while the body text (e.g. text in the message bubbles) is allowed to grow. This PR introduces a new prop on `<Text>` and `<TextInput>` called `maxFontSizeMultiplier`. This enables devs to set the maximum allowed text scale factor on a Text/TextInput. The default is 0 which means no limit. Test Plan: ---------- I created a test app which utilizes all categories of values of `maxFontSizeMultiplier`: - `undefined`: inherit from parent - `0`: no limit - `1`, `1.2`: fixed limits I tried this with `Text`, `TextInput` with value, and `TextInput` with children. For `Text`, I also verified that nesting works properly (if a child `Text` doesn't specify `maxFontSizeMultiplier`, it inherits it from its parent). Lastly, we've been using a version of this in Skype for several months. Changelog: ---------- [Android] [Added] - Added maxFontSizeMultiplier prop to prevent some text from getting unusably large as user increases OS's font scale setting
facebook-github-bot
added
the
CLA Signed
react-native-bot
added
🔶Components
Component: TextInput
There was a problem hiding this comment.
@mdvacca has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.
facebook-github-bot
added
the
Import Started
matthargett
approved these changes
Jan 23, 2019
hramos
removed
Import Started
matt-oakes
pushed a commit
to matt-oakes/react-native
that referenced
this pull request
Feb 7, 2019
…acebook#23069) Summary: Equivalent of this iOS PR: facebook#20915 Motivation: ---------- Whenever a user changes the system font size to its maximum allowable setting, React Native apps that allow font scaling can become unusable because the text gets too big. Experimenting with a native app like iMessage on iOS, the font size used for non-body text (e.g. header, navigational elements) is capped while the body text (e.g. text in the message bubbles) is allowed to grow. This PR introduces a new prop on `<Text>` and `<TextInput>` called `maxFontSizeMultiplier`. This enables devs to set the maximum allowed text scale factor on a Text/TextInput. The default is 0 which means no limit. Pull Request resolved: facebook#23069 Differential Revision: D13748513 Pulled By: mdvacca fbshipit-source-id: 8dd5d6d97bf79387d9a2236fa2e586ccb01afde9
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Equivalent of this iOS PR: #20915
Motivation:
Whenever a user changes the system font size to its maximum allowable setting, React Native apps that allow font scaling can become unusable because the text gets too big. Experimenting with a native app like iMessage on iOS, the font size used for non-body text (e.g. header, navigational elements) is capped while the body text (e.g. text in the message bubbles) is allowed to grow.
This PR introduces a new prop on
<Text>and<TextInput>calledmaxFontSizeMultiplier. This enables devs to set the maximum allowed text scale factor on a Text/TextInput. The default is 0 which means no limit.Test Plan:
I created a test app which utilizes all categories of values of
maxFontSizeMultiplier:undefined: inherit from parent0: no limit1,1.2: fixed limitsI tried this with
Text,TextInputwith value, andTextInputwith children. ForText, I also verified that nesting works properly (if a childTextdoesn't specifymaxFontSizeMultiplier, it inherits it from its parent).Lastly, we've been using a version of this in Skype for several months.
Changelog:
[Android] [Added] - Added maxFontSizeMultiplier prop to prevent some text from getting unusably large as user increases OS's font scale setting
Adam Comella
Microsoft Corp.