I used the custom font on react-native expo project.
It works well on the expo platform with an android emulator.
But After I built my project as APK file, it does not show all the text as my custom font.
I followed the tutorial like this (https://docs.expo.io/versions/latest/guides/using-custom-fonts/
) but it doesn't work.
Is there any solution to work on android?
I tried to use the custom font like this.
class App extends Component {
state = {
fontLoaded: false
};
async componentDidMount() {
await Font.loadAsync({
"Antonio": require("./assets/fonts/Antonio-Light.ttf"),
"Antonio-Bold": require("./assets/fonts/Antonio-Bold.ttf")
});
this.setState({ fontLoaded: true });
}
render() {
const { fontLoaded } = this.state;
if (!fontLoaded)
return (
<Text>Loading.....</Text>
);
...........
This is my package.json file.
...
"dependencies": {
"@expo/vector-icons": "^9.0.0",
"angle-normals": "^1.0.0",
"art": "^0.10.1",
"bunny": "^1.0.1",
"expo": "^34.0.3",
"expo-asset": "latest",
"expo-asset-utils": "^1.1.1",
"expo-font": "^6.0.1",
"expo-gl": "~5.0.1",
"expo-pixi": "^1.2.0",
"expokit": "^32.0.3",
"gl-mat4": "^1.1.4",
"gl-react": "^3.13.0",
"gl-react-expo": "^3.16.3",
"lodash": "^4.17.11",
"matter-js": "^0.13.0",
"native-base": "^2.10.0",
"prop-types": "^15.6.2",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-motion": "^0.5.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
"react-native-animatable": "^1.2.2",
"react-native-donkey-kong": "^0.5.1",
"react-native-extended-stylesheet": "git+https://github.com/bberak/react-native-extended-stylesheet.git",
"react-native-game-engine": "^0.10.1",
"react-native-gesture-handler": "~1.2.1",
"react-native-paper": "2.1.3",
"react-native-responsive-screen": "^1.3.0",
"react-native-svg": "^9.11.1",
"react-native-web": "^0.11.2",
"react-navigation": "^3.2.1",
"react-navigation-redux-helpers": "^2.0.9",
"react-redux": "^6.0.0",
"react-style-proptype": "^3.2.2",
"redux": "^4.0.1",
"redux-thunk": "^2.3.0",
"regl": "^1.3.0"
},
...
This is my app.json file.
{
"expo": {
"name": "Zenduja",
"slug": "Zenduja-Pro",
"privacy": "unlisted",
"sdkVersion": "33.0.0",
"platforms": [
"ios",
"android"
],
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/images/icon.png",
"splash": {
"image": "./assets/images/splash.png",
"resizeMode": "cover",
"backgroundColor": "#222222"
},
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"assets/fonts/*"
],
"ios": {
"supportsTablet": true
},
"android": {
"package": "com.aaa.aaa"
},
"packagerOpts": {
"assetExts": [
"ttf",
"mp4",
"otf",
"xml"
]
},
}
}
Please help me. Thanks.
Updated question.
This is my expo snack loading font project.