简体   繁体   中英

React native FONT loading without expo

with expo-font we can render fonts asynchronously when the app loads here is the example. Like wise how we can render fonts without expo.

 import {AppLoading} from 'expo' import * as Font from 'expo-font' import React from 'react'; state = { isFontLoaded:false } async componentDidMount() { await Font.loadAsync({ "Bold":require('./src/fonts/Montserrat-ExtraBold.otf'), "Medium":require('./src/fonts/Montserrat-Medium.otf'), "Regular":require('./src/fonts/Montserrat-Regular.otf'), }) this.setState({isFontLoaded:true}) }

1 - create a folder called "assets", inside it create "fonts" folder and put all your ttf files inside it.

2 - create a file in the root called: react-native.config.js and put insdie it:

        module.exports = {
                project: {
                        ios: {},
                        android: {}
                },
                assets: ['./assets/fonts']
        };

3 - run this command: npx react-native link 4- usage: in stylesheet use fontFamily:"font name", and also fontweight:''

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM