Не удается изменить семейство шрифтов (React-Native)

Question

Я довольно новичок в реакции на нативность и не очень разбираюсь в CSS. Я просто пытаюсь изменить семейство шрифтов на helvetica. Я пробовал несколько раз, и ничего не меняется

Это мой css код:

import {StyleSheet} from "react-native";

export default StyleSheet.create({

  header: {
    backgroundColor:'#004D4D',
    height: 35,
  },

  headerT: {
    color: '#FFFFFF',
    fontSize: 20,
    fontFamily: 'Helvetica',
    textAlign: 'center',
    justifyContent: 'center',
  },

  body: {
    backgroundColor:'#E6FFFF',
    flex:1,
  },

})

Это страница, которую я пытаюсь изменить

import React, { Component } from 'react';
import { Text, View, Button } from 'react-native';
import styles from "../style/css";

class HomeScreen extends Component{
  render(){
    return(
      <View style={styles.body}>


        <View style={styles.header}>
          <Text style={styles.headerT}>Home Screen</Text>
        </View>


      </View>

    );
  }
}

export default HomeScreen;

Это мой каталог

Answer 1

Сначала вам нужно добавить шрифты в папку активов, загрузив любой шрифт, который вы хотите, например, Вы хотите ** Helvetica **, затем вам нужно будет загрузить файл Helvetica.ttf для него.

После этого в вашем package.json вам нужно добавить следующие строки: -

"rnpm": {
    "assets": [
    "./assets/fonts/"
    ]
},

Затем мы говорим реагировать на нативный язык, чтобы связать эти файлы шрифтов для нас.

На Android, если вы заглянете в путь к файлу android/app/src/main/assets/fonts/ вы должны увидеть, что ваши шрифты были скопированы.

При IOS он добавлен в Info.plist file.

Теперь просто добавьте свойство fontFamily со своим именем шрифта .

Answer 2

Список доступных реактивных шрифтов: https://github.com/react-native-training/react-native-fonts

Если вы используете Android, Helvetica не будет работать напрямую, вам нужно использовать собственный шрифт.

Вот статья для Пользовательские шрифты в React Native для iOS & Android Сборки