Как добавить пользовательский шрифт в реакцию родной андроид

Question

Я учусь react-native, пытаясь создать некоторые демонстрационные приложения только для обучения. Я хочу установить fontFamily в roboto, тонкий из моего заголовка панели инструментов.

Я добавил roboto thin ttf в папку assets/fonts моего проекта Android, однако кажется, что это создает проблемы во время работы приложения. Я получаю эту проблему во время работы

Реагировать родной Запустить

ERROR EPERM: operation not permitted, lstat 'E:\Myntra\android\app\build\gener 
ated\source\r\debug\android\support\v7\appcompat' 
{"errno":-4048,"code":"EPERM","syscall":"lstat","path":"E:\\Myntra\\android\\app 
\\build\\generated\\source\\r\\debug\\android\\support\\v7\\appcompat"} 
Error: EPERM: operation not permitted, lstat 'E:\Myntra\android\app\build\genera 
ted\source\r\debug\android\support\v7\appcompat' 
    at Error (native) 

Когда я удаления шрифта, то он работает нормально. Я не могу решить эту проблему, может ли кто-нибудь помочь мне, что может быть причиной этого.

Заранее спасибо.

Answer 1

Добавить файл шрифтов в

• Project папку/Android/приложение/SRC/главная/активы/шрифты/font_name.ttf
• Помните перекомпилировать, что является "реагировать родной вводного андроид"
• И тогда вы можете использовать FontFamily: 'font_name' в вашем стиле

посмотреть здесь font

Answer 2

Положите все ваши шрифты вы реагируете-Native каталог проекта

./assets/fonts/ 

Добавьте следующую строку в package.json

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

, наконец, запустить в терминале из каталога проекта

$ react-native link 

, чтобы использовать это декларирование таким образом в ваших стилях

fontFamily: 'your-font-name without extension' 

Если шрифт Raleway-Bold.ttf тогда

fontFamily: 'Raleway-Bold' 

Answer 3

Если вы используете Реагировать Native шансы, что вы используете Expo, а также. Если это так, то вы можете загрузить пользовательские шрифты с использованием методаExpo.

Шаги:

1. Поместите загруженный шрифт в каталоге ./assets/fonts (если каталог не существует, создайте его)

2. Из целевого компонента (например: App.js) Font Загрузочный модуль Экспо :

   import { Font } from 'expo' 
   

3. Загрузите пользовательский шрифт с помощью componentDidMount:

   componentDidMount() { 
       Font.loadAsync({ 
       'Roboto': require('../assets/fonts/Roboto-Regular.ttf'), 
       }) 
   } 
   

4. Наконец, используйте атрибут style применить нужный шрифт на <Text> компонента:

   <Text style={{fontFamily: 'Roboto', fontSize: 38}}>Wow Such Title</Text>