How to normalize font sizes between resolutions?

Hi all,

I’m currently in the process of making sure my UI looks good on devices of various sizes, and one obstacle that I’m running into is the appearance of font sizes changes drastically between different screen resolutions. For example, here’s a login screen I was working on earlier on an iPhone XR versus an older Android OnePlus 3:

Is there any way within Draftbit to fix or adjust for this kind of UI scaling? If necessary, any way outside of Draftbit?

Would like to ensure my designs look good on all devices regardless of their age or pixel density.

For anyone encountering this problem in the future: You can write your own simple scaling function based on the device width and scale things in your StyleSheet, or use the react-native-size-matters library for a nice prebuilt solution. Unfortunately neither of these options are doable in Draftbit AFAIK, so it’ll need to be something you do after exporting the app.

2 Likes