Download Fonts at runtime in React Native

Question

I want to download fonts at runtime and apply all across the app. There is one approach which where we can carry ttf files in font folder. But that will increase the size of the bundle.

Answer 1

I have used react-native-dynamic-fonts library, which makes this very easy. You just call loadFont function. The only caveat is that you need the font parsed as base64. We have implemented this functionality on our backend but you can use fs library like this.

const fontAsBase64 = fs.readFileSync('/path/to/font.ttf', {encoding: 'base64'});

loadFont('nameOfTheFont', fontAsBase64, 'ttf').then((name: string) => {
      console.log('Loaded font successfully. Font name is: ', name);
    });