如何更改 react-native 中的默认 fontFamily

Posted

技术标签:

【中文标题】如何更改 react-native 中的默认 fontFamily【英文标题】:How to change the default fontFamily in react-native 【发布时间】:2016-05-17 09:05:02 【问题描述】:

我可以在我的应用(iosandroid)中设置默认 fontFamily 吗?

我不想在每个屏幕中都设置它。

有什么想法吗?

【问题讨论】:

【参考方案1】:

做到这一点的唯一方法是从事物的本机方面。见这里:

Set a default font for whole iOS app?

Is it possible to set a custom font for entire of application?

虽然,如果您使用库 Cairn(免责声明:我写的),这很简单。只需定义您的全局文本样式并在任何地方扩展即可。 Cairn 使所有全局内容都可重用,同时不会破坏特定于组件的覆盖和扩展。

// styles.js
import  createStylesheet  from 'react-native';
import cairn from 'cairn';

export default cairn(
    text: 
        fontFamily: '...'
    
, (styles) => createStylesheet(styles));

然后在您的组件中扩展这些全局样式并应用到您的文本元素:

// components/MyComponent.js

import styleContext from '../styles';

const style = styleContext.extend(
    'text.header': 
        fontSize: 30
    
);

export default const MyComponent = () => (
    // Spreads style=[styleContext.text, style['text.header']]
    <Text ...style('text.header')>Header!</Text>
);

【讨论】:

以上是关于如何更改 react-native 中的默认 fontFamily的主要内容,如果未能解决你的问题,请参考以下文章

如何在 react-native 项目中保存 info.plist 中的更改

如何将更改的状态发送到 react-native 中的组件?

更改 Perl 中的默认正则表达式行为?

React-Native 更改 iOS 和 Android 文件夹的默认位置

如何在 react-native for android 中更改应用程序图标背景颜色

在不使用 xcode react-native 的情况下更改设备