有没有办法在 React Native 中全局设置字体？

Question

我需要创建一个适用Text于整个应用程序中每个组件的自定义字体。

有没有办法在 React Native 中全局设置字体？

Answer 1

一种方法是为 RN 创建一个包装器，Text比如 MyTextCustomFont：

const MyTextCustomFont = (props) => {
   return (
        <Text style={{fontFamily:'myFont'}} {...props} >{props.children}</Text>
   )
}

导入它MyTextCustomFont并在任何地方使用。

另一种方法是定义一个样式对象并在您想要的任何地方使用它。

Answer 2

为此，我们必须实现一个方法，在该方法中我们将覆盖TextReact Native 中的组件创建。在这里，我们将设置默认字体系列或大小或我们想要默认设置的任何属性。

// typography.js

import React from 'react'
import { Text, Platform, StyleSheet } from 'react-native'

export const typography = () => {
  const oldTextRender = Text.render
  Text.render = function(...args) {
    const origin = oldTextRender.call(this, ...args)
    return React.cloneElement(origin, {
      style: [styles.defaultText, origin.props.style],
    })
  }
}

const styles = StyleSheet.create({
  defaultText: {
    fontFamily: 'NunitoSans-Regular',//Default font family
  }
}); 

然后在index.js中你必须这样做：

import { typography } from './src/utils/typography'

typography()

详细答案在这里： https ://ospfolio.com/two-way-to-change-default-font-family-in-react-native/

Answer 3

是的

应用程序.js

import styles from './styles';
{...}
 <Text style={styles.text}>hello World </Text>
{...}

样式.js

import {StyleSheet} from 'react-native';

const styles = StyleSheet.create({
 text: {
    // define your font or size or whatever you want to style here
  },

对每个文本使用样式，所有更改都会影响所有文本组件