2
votes

Problème lors du rendu de la police Open-sans dans React Native V 60+

Je veux ajouter la police 'Open-sans' à mon application mais j'ai un problème et cela se produit uniquement sur le simulateur IOS

voici mes étapes:

a) J'ai créé un dossier dans l'application racine comme: assets puis fonts fonts folder in assets et mettez Open-sans.ttf

b) J'ai créé un fichier en racine avec le nom react-native-config.js et ajoutez:

<Text style={{fontFamily: 'OpenSans-Bold', fontWeight: 'bold'}}>
  This is my first App
</Text>

c) lien react-native

d) In the App.js

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

Mon problème est qu'il ne cesse de me dire "Famille de polices non reconnue" chaque fois que je fais des modifications dans App.js

mais lorsque j'ouvre react-native-config.js et que je ne fais rien d'autre que d'enregistrer uniquement le rechargement à chaud déclenché et la police fonctionne

comme je l'ai mentionné, c'est parfait sur Android mais l'erreur apparaît sur IOS lors de l'enregistrement après toute modification sur le fichier App.js

react-native fonts react-native-ios

0 commentaires

4 Réponses :

0
votes

J'étais avec la même erreur, c'est ce que j'ai fait: 1 - Renommez react-native-config.js en react-native.config.js et mettez ce script dans le fichier:

rnpm": {
    "ios": {},
    "android": {},
    "assets": [
      "./src/assets/font"// this is my path
    ]
  },

2 - placez-le sur mon package.json:

module.exports = {
  assets: ['./src/assets/fonts'], // this is my path
};

et Après avoir exécuté le lien react-native && yarn react-native link.

Vérifiez si votre info-plist et vos actifs Android sont modifiés

0 commentaires

1
votes

Pour IOS, la valeur de la famille de polices est le nom complet et pour Android son nom de fichier. Essayez:

<Text style={{fontFamily: 'Open Sans Bold'}}>

Ceci est ma première application

pour Android, changez le nom du fichier 'OpenSans-Bold.ttf' en 'Open Sans Bold.ttf

0 commentaires

1
votes

Assez simple ...

Pour intégrer une police, copiez le code dans le de votre html:

font-family: 'Open Sans', sans-serif;

Règles CSS pour spécifier les familles

XXX

0 commentaires

0
votes

Selon votre description, vous n'avez mis Open-sans.ttf que dans le dossier des ressources. Mais vous essayez d'accéder à OpenSans-Bold qui n'est pas ajouté à votre dossier d'actifs. Pour accéder à une police particulière, vous devez ajouter celle-ci au dossier d'actifs. Voici un exemple pour votre référence ...

vous pouvez vérifier ceci aussi pour une meilleure compréhension

0 commentaires