font scale: setMaxContentSizeMultiplier doesn't work for RN.Text and RN.TextInput

[ohyeslk]

Hey,
In function setMaxContentSizeMultiplier(maxContentSizeMultiplier: number): void { },
it shouldn't use UIManager.setMaxContentSizeMultiplier, we should use AccessibilityManager.setAccessibilityContentSizeMultipliers in React Native.

Something like RN.NativeModules.AccessibilityManager.setAccessibilityContentSizeMultipliers(maxContentSizeMultiplier);

But the maxContentSizeMultiplier should be a dictionary like:
const fontSizeMultipliers = {
extraSmall: 0.823,
small: 0.882,
medium: 0.941,
large: 1.0,
extraLarge: 1.118,
extraExtraLarge: 1.235,
extraExtraExtraLarge: 1.353,
accessibilityMedium: 1.786,
accessibilityLarge: 2.143,
accessibilityExtraLarge: 2.643,
accessibilityExtraExtraLarge: 3.143,
accessibilityExtraExtraExtraLarge: 3.571,
};
Here's the reference:
https://snack.expo.io/ryOh1Migb

[erictraut]

This feature (a maximum size multiplier) doesn't currently exist in React Native. It's a feature that the Skype team implemented in our own private fork of RN. We've been working on getting the change integrated into React Native proper. I'm not sure of the latest status of that effort.

[ohyeslk]

I tried this function(max size multiplier) but it doesn't work. I thought it was exposed as accessibility large text, isn't it?

[erictraut]

Font size multiplier is exposed, but there's currently no way to cap it to a maximum value.

[ohyeslk]

I see. I want to limit the fontSizeMultipliers for thresholds. For example, make the ExtraExtraExtraLarge(3.571) to Large(2.143). Currently, it doesn't support it, right? But i feel like setMaxContentSizeMultiplier is build for it. It doesn't really work thought.

Something like this:
facebook/react-native#15433

[erictraut]

Oh, interesting. I missed your reference before. It looks like FB added this support to RN.IOS at some point. It wasn't added to the documentation for AccessibilityManager, but I see it in the code. Unfortunately, I don't see any similar support exposed on RN.Android.

@rigdern, have you had any further conversations with FB on this topic?

[ohyeslk]

On Android, there're not that much range of multipliers. I think this is only exposed for iOS to solve the accessibility's large text mode

[rigdern]

For Skype, we had a problem where text could get too big as the user increased their system font scale setting. We considered using setAccessibilityContentSizeMultipliers but ultimately decided that building setMaxContentSizeMultiplier was a better solution for Skype. You can read more about setMaxContentSizeMultiplier in the ReactXP docs.

As Eric mentioned, setMaxContentSizeMultiplier isn't yet part of the official React Native GitHub project. We have custom React Native patches that add support for setMaxContentSizeMultiplier on iOS and Android. We're currently preparing to contribute this feature back to Facebook.

Adam Comella
Microsoft Corp.

[fbartho]

I know it's been a while, but @rigdern do you think it would be possible to update the status of this ticket? -- I'm hoping that this is actually fixed now in react-native and we just need some PR for ReactXP.

My question above also goes for you @ohyeslk -- I'd love to figure out where we're at here!

[fbartho]

I think this is partially implemented in or related to #1200 … does that sound right?

[rigdern]

@fbartho Yes, maxFontSizeMultiplier is implemented in React Native (iOS, Android) and #1200 appears to expose it in ReactXP.