react-native-cross-platform-text
Crossplatform Text shim, consolidating iOS and Android font weight and font family APIs.
Installation
yarn add react-native-crossplatform-text
or
npm install --save react-native-crossplatform-text
Usage
react-native-cross-platform-text exports wrapped React Native Text components and will transform fontWeight
and fontFamily
styles so they are compatible with Android's API:
;; const styles = StyleSheet; const example = <View> <Text style=stylestext>Crossplatform text component!</Text> <TextInput style=stylestextInput /> <AnimatedText style=stylesanimatedText>Crossplatform animated text component!</AnimatedText> </View>;
On iOS, styles stay the same, on Android they become:
text: fontFamily: 'OpenSans-Bold' fontWeight: undefinedtextInput: fontFamily: 'TittiliumWeb-Black' fontWeight: undefinedanimatedText: fontFamily: 'Montessart-Regular' fontWeight: undefined
To get the most out of this library, please ensure your custom font files are correctly imported and that they follow these naming conventions, i.e.:
MyFont-Regular.ttf
MyFont-Bold.ttf
MyFont-Thin.ttf
MyFont-ExtraLight.ttf
MyFont-Medium.ttf
MyFont-SemiBold.ttf
MyFont-Bold.ttf
MyFont-ExtraBold.ttf
MyFont-Black.ttf
as this is how the library will map font weights.