React-native-web: Add support for Text adjustsFontSizeToFit

Created on 10 Apr 2018 · 9Comments · Source: necolas/react-native-web

Do you want to request a feature or report a bug?

Feature. See: https://facebook.github.io/react-native/docs/text.html#adjustsfontsizetofit

What is the current behavior?

The prop is not implemented. See: https://github.com/necolas/react-native-web/blob/23fa663a6e6b69c76cb6499d0a8656ff938cca02/packages/react-native-web/src/exports/Text/index.js#L44-L45

What is the expected behavior?

The prop to be supported :)

Environment (include versions). Did this work in previous versions?

OS: all
Device: all
Browser: all
React Native for Web (version): all
React (version): all

low

Source

tanx

Most helpful comment

Ok cool. We'll give it a try and post a PR if we find a clean way to do this. Otherwise I'm sure we can work around the issue as well.

Anyway, this goes without saying but thanks a lot for your work on 'react-native-web'. It's allowing us to build our desktop UI in Electron with shared components for mobile :)

tanx on 11 Apr 2018

👍4

All 9 comments

No plans to support this. It's iOS-only in React Native and depends on native functionality that's not available on the web.

necolas on 10 Apr 2018

@necolas gotcha, thanks for the reply. So if we provided a PR to polyfill for the web you wouldn’t accept it either?

tanx on 10 Apr 2018

I'd take a look at a PR that adds this functionality in a reliable and performant way :)

necolas on 10 Apr 2018

Ok cool. We'll give it a try and post a PR if we find a clean way to do this. Otherwise I'm sure we can work around the issue as well.

Anyway, this goes without saying but thanks a lot for your work on 'react-native-web'. It's allowing us to build our desktop UI in Electron with shared components for mobile :)

tanx on 11 Apr 2018

👍4

Closing for now as the prop is iOS-only and there's no direct equivalent on web that I know of. Still open to a PR

necolas on 22 May 2018

I wrote something that requires worst case log(n) dom operations might be able to adapt, worth trying to port Nicolas?

https://codesandbox.io/s/nrpqopp18p

magus on 17 Oct 2018

👍2

Android adjustFontSizeToFit is merged but not released yet, see: https://github.com/facebook/react-native/pull/26389
For the time being for android i am using "onTextLayout" prop of Text component (and calculating font size manually), if onTextLayout is added into Web Text component, that would work too.