Challenge Adding User Generated Fonts to Expo Project

54 Views Asked by At

I am creating an expo react native app that allows users to scan their handwriting and generate custom fonts that they can then use to type. I have built out an express node.js server which generates the font file using ML, but I am having trouble implementing the file onto the user's device. The core challenge is that it doesn't seem I can save the .ttf file to the asset directory as the app has already been bundled when the user scans their handwriting to create the font.

Possible Solutions:

  1. Ideally, I would send in the base64 representation of the file and load it in as a font using the loadAsync() function.
  2. I also tried writing it to the expo FileSystem and then loading it in using the file URI; I can save the file as a .ttf, but expo does not seem to like the URI.
  3. The last option would be to somehow save the .ttf to an online URL and download the remote font directly from the web, but this would require the user to download the font from the web every time they load up the app.

Any help or advice is appreciated. Thanks!

  1. I tried option 1, but it the Fonts.loadAsync method doesn't seem to take base64 representation or even a binary buffer of the .ttf file. I don't know if this is even possible.

  2. I tried option 2 as well, but expo is giving me the following error: "Error: Unable to download file: Error Domain=NSURLErrorDomain Code=-1002 'unsupported URL'".

  3. I have not tried option 3, but it seems like a last resort as downloading the custom created fonts every time the user loads up the app seems like bad UX.

0

There are 0 best solutions below