React Native – how to set fixed width to individual characters (number, letter, etc)

The system font in iOS is San Francisco, which has proportional numbers by default but contains an option for fixed-width (monospaced) numbers. With react-native, you have to use the fontVariant property on your Text component’s style:

<Text style={{fontVariant: ['tabular-nums']}}>
  1,234,567,890.12
</Text>

I had a hard time finding it because the name isn’t explicit and not what is typically used. Here’s a link to the the Text props on the RN doc: https://reactnative.dev/docs/text-style-props#fontvariant

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)