Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Text] Auto adjust font size to fit Text node width.

See original GitHub issue

Hi! I’m looking for how I can achieve behavior similar to UILabel’s adjustsFontSizeToFitWidth=true, but haven’t been able to find anything.

Is this possible on a Text node?

Issue Analytics

State:
Created 8 years ago
Reactions:14
Comments:35 (11 by maintainers)

Top GitHub Comments

9reactions

Viral-Inccommented, Dec 20, 2017

how complicated is it to have adjustsFontSizeToFit work for Android too?

9reactions

wmoneckecommented, Sep 7, 2017

I managed to overcome this by doing the following.

Pick the font size you like for the current view you have (Make sure it looks good for the current device you are using in the simulator).
import { Dimensions } from 'react-native' and define the width outside of the component like so: let width = Dimensions.get('window').width;
Now console.log(width) and write it down. If your good looking font size is 15 and your width is 360 for example, then take 360 and divide by 15 ( = 24). This is going to be the important value that is going to adjust to different sizes.
Use this number in your styles object like so:

textFontSize: { fontSize = width / 24 },...