So fügen Sie benutzerdefinierte Schriftart in reagieren native Android

Ich lerne react-native, versuchen, einige Demo-Apps nur zum Lernen zu erstellen. Ich möchte fontFamily auf roboto Thin meiner Symbolleiste Titel festlegen.So fügen Sie benutzerdefinierte Schriftart in reagieren native Android

Ich habe Roboto dünne TTF in assets/fonts Ordner meines Android-Projekts hinzugefügt, aber es scheint, dass es Probleme beim Ausführen von App erstellt. Ich bin dieses Problem zu bekommen, während

reagieren-native Start

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)

laufen Wenn ich die Schriftart dann bin Entfernen es funktioniert gut. Ich kann dieses Problem nicht beheben, kann mir jemand helfen, was der Grund dafür sein kann.

Vielen Dank im Voraus.

Quelle

2017-01-24 N Sharma

Fügen Sie Ihre Schriften in

Datei

Projektordner/android/app/src/main/assets/fonts/font_name.ttf
Denken Sie daran, neu kompilieren das heißt "reagieren-native Lauf android"
Und dann können Sie verwenden family: 'font_name' in Ihrem Stil

hier font

Quelle

2017-01-24 11:57:22 Sport

Legen Sie alle Ihre Schriften in Sie React-indiaProjektVerzeichnis

./assets/fonts/

Fügen Sie die folgende Zeile in Ihrer package.json

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

schließlich im Terminal aus Ihrem Projektverzeichnis laufen

$ react-native link

um es zu verwenden, deklarieren Sie diese Art in Ihren Stilen

fontFamily: 'your-font-name without extension'

Wenn Ihre Schrift Raleway-Bold.ttf dann ist,

fontFamily: 'Raleway-Bold'

Quelle

2017-06-13 10:19:34

Diese Antwort ist besser als das akzeptiert man, es ist sauberer und funktioniert auch für ios. –

Für mich funktioniert es überhaupt nicht auf Android. Die Schriftarten sind in den 'app/src/assets/fonts' enthalten. Versucht mit Dateiname ohne Erweiterung und auch mit Schriftfamiliennamen, der auf iOS funktioniert. – parohy

Wenn Sie Einheimische Chancen reagieren mit sind, dass Sie Expo auch verwenden. Wenn das der Fall ist, können Sie benutzerdefinierte Schriftarten mit der Methode Font.loadAsync von Expo laden.

Schritte:

Setzen Sie die heruntergeladene Schrift im ./assets/fonts Verzeichnis (wenn das Verzeichnis nicht existiert, erstellen Sie es)
Von der Zielkomponente (zum Beispiel: App.js) Font der Last Expo-Modul :
```
import { Font } from 'expo' 
```

Legen Sie die benutzerdefinierte Schriftart componentDidMount mit:

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

Schließlich verwenden die style Attribut die gewünschte Schriftart auf einer <Text> Komponente anzuwenden:
```
<Text style={{fontFamily: 'Roboto', fontSize: 38}}>Wow Such Title</Text> 
```

Quelle

2017-12-01 17:03:47 jmmarco

Aufgrund der Einschränkung der Expo, nicht in der Lage zu sein, * vollständig offline laufen zu können, halte ich Ihre Eröffnungsrede für etwas irreführend. Ich benutze sowohl Expo als auch Reactive-native, Expo ist großartig, hat aber einfach nicht die Features für viele häufige Anwendungsfälle. Schöne Antwort –

So fügen Sie benutzerdefinierte Schriftart in reagieren native Android

Antwort

Verwandte Themen