亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React-Native-Paper 主題不會使用自定義字體

React-Native-Paper 主題不會使用自定義字體

海綿寶寶撒 2023-06-09 10:51:23
我正在開發一個用于react-native-paper處理主題和 UI 的 RN 應用程序。我有主題來格式化我的組件,但是當我嘗試合并自定義字體時,它對組件沒有任何影響react-native-paper。我已經關注了,[font guide][1]但它并沒有改變這個問題。我遵循如何使用 加載字體的 expo 示例loadFontAsync(),當我使用 style 道具將這些字體傳遞到我自己的組件時,fontFamily: 'Rubik-Regular字體可以正常工作,所以我知道這不是字體不存在的問題。由于我是新手react-native-paper,我認為我的問題出在我的fontConfigor上configureFonts()。任何幫助或指導將不勝感激。import React from 'react';import { Provider as ReduxProvider } from 'react-redux'import configureStore from './store']import { configureFonts, DefaultTheme, Provider as PaperProvider } from 'react-native-paper'import { AppLoading } from 'expo';import * as Font from 'expo-font';import AppNavigator from './components/AppNavigator'const store = configureStore();const fontConfig = {    default: {        regular: {            fontFamily: 'Rubik-Regular',            fontWeight: 'normal',        },        medium: {            fontFamily: 'Rubik-Black',            fontWeight: 'normal',        },        light: {            fontFamily: 'Rubik-Light',            fontWeight: 'normal',        },        thin: {            fontFamily: 'Rubik-LightItalic',            fontWeight: 'normal',        },    },};let customFonts = {    'Rubik-Regular': require('./assets/fonts/Rubik-Regular.ttf'),    'Rubik-Black': require('./assets/fonts/Rubik-Black.ttf'),    'Rubik-Light': require('./assets/fonts/Rubik-Light.ttf'),    'Rubik-LightItalic': require('./assets/fonts/Rubik-LightItalic.ttf'),}const theme = {    ...DefaultTheme,    roundness: 30,    fonts: configureFonts(fontConfig),    colors: {        ...DefaultTheme.colors,        primary: '#0d80d6',        accent: '#E68FAE',        background: '#C6E1F2',    },}export default class App extends React.Component {    constructor(props) {        super(props);        this.state = {            fontsLoaded: false,        };    }我正在使用react-native 0.63.3和Expo。
查看完整描述

1 回答

?
嚕嚕噠

TA貢獻1784條經驗 獲得超7個贊

解決方案是您必須指定fontConfig.ios并可能fontConfig.android使其工作,而不僅僅是擁有fontConfig.default.

對于您的情況,您可能可以適應類似

const _fontConfig = {

? ? ? ? regular: {

? ? ? ? ? ? fontFamily: 'Rubik-Regular',

? ? ? ? ? ? fontWeight: 'normal',

? ? ? ? },

? ? ? ? medium: {

? ? ? ? ? ? fontFamily: 'Rubik-Black',

? ? ? ? ? ? fontWeight: 'normal',

? ? ? ? },

? ? ? ? light: {

? ? ? ? ? ? fontFamily: 'Rubik-Light',

? ? ? ? ? ? fontWeight: 'normal',

? ? ? ? },

? ? ? ? thin: {

? ? ? ? ? ? fontFamily: 'Rubik-LightItalic',

? ? ? ? ? ? fontWeight: 'normal',

? ? ? ? },

};


const fontConfig = {

? ? ios: _fontConfig,

? ? android: _fontConfig,

};


查看完整回答
反對 回復 2023-06-09
  • 1 回答
  • 0 關注
  • 230 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號