react-native-fontify v1.2.0

react-native-fontify

Dynamically load fonts in React Native! Elevate your UI with on-the-fly typography.

Installation

npm install react-native-fontify

iOS

npx pod-install ios

Methods

import { hasFont, registerFontFromFile } from 'react-native-fontify';

hasFont()

Check if a font exists in the system.

const result = await hasFont('Poppins'); // Check if the Poppins font exists in the system.

registerFontFromFile()

Register a font file in the system.

import RNFS from 'react-native-fs'; // Use the `react-native-fs` library to download and access the system's cache directory.

const [updated, setUpdated] = useState(false);

// iOS
const postScriptName = await registerFontFromFile(
  RNFS.CachesDirectoryPath + '/Poppins.ttf'
); // Load the Poppins font from the cache directory. This returns the postscript name of the font.

// Android
const postScriptName = await registerFontFromFile(
  RNFS.CachesDirectoryPath + '/Poppins.ttf',
  'Poppins', //Specify family name to be registered
); // Load the Poppins font from the cache directory. This returns the postscript name of the font.

const result = await hasFont(postScriptName); // True
setUpdated(true); // Make sure to update the state after registration.

If the font has already been registered, it returns the postScriptName.

Don't forget to update all <Text /> or <TextInput /> components to apply the new font.

Error Code

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

Made with create-react-native-library