/Javascript/React/Google font in react native

Google font in react native

// 1) Install two package from expo 
// 1.1) visit https://directory.vercel.app/ and select font you want
// expo install @expo-google-fonts/FONT_FAMILY_NAME 
  //For example, if you choose to use lato we would install:
   //====== expo install @expo-google-fonts/lato     =======
//1.2) =====expo install expo-app-loading   ===========
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { AppLoading } from "expo-app-loading";
import {
  useFonts,
  Roboto_400Regular,
  Roboto_400Regular_Italic
} from "@expo-google-fonts/roboto";

export default function App() {
  let [fontsLoaded] = useFonts({
    Roboto_400Regular,
    Roboto_400Regular_Italic
  });

  if (!fontsLoaded) {
    return <AppLoading />;
  } else {
    return (
      <View style={{flex: 1, alignItems: "center", justifyContent: "center" }}>
        <Text style={{ fontFamily: "Roboto_400Regular", fontSize: 28 }}>
          Nice! Support for Google Fonts!
        </Text>
      </View>
    );
  }
}

Similar codes

0 vote193 views1 answer
React chat sheet
Javascript React
18 votes191 views6 answers
Import svg as react component
Javascript React
55 votes175 views6 answers
Useref in react
Javascript React
19 votes197 views6 answers
React.js
Javascript React
0 vote180 views1 answer
Usenavigate react router dom v6
Javascript React
0 vote158 views1 answer
Undefined is not a function (near '...(0, _reactNative.createStackNavigator)...')
Javascript React
1 vote211 views2 answers
React native open link in browser
Javascript React
-2 votes218 views1 answer
Setting up a React Environment
Javascript React
0 vote196 views1 answer
React router dom default params
Javascript React
6 votes189 views1 answer
'useHistory' is not exported from 'react-router-dom'.
Javascript React