Компонент React native paper не извлекает правильный шрифт

#reactjs #react-native #react-native-paper

#reactjs #react-native #react-native-paper

Вопрос:

Мой react-native-paper компонент textInput не извлекает шрифты, которые я установил.

           <View style={styles.inputCon}>
            <TextInput
              multiline={true}
              label="Ime aktivnosti"
              mode="outlined"
              value={ime}
              onChangeText={(value) => {
                setIme(value);
              }}
            />
          </View>
  

Я следовал официальной документации о том, как изменить шрифты для компонентов RN Paperhttps://callstack.github.io/react-native-paper/fonts.html

 const fontConfig = {
  default: {
    regular:{
    fontFamily: "Poppins_400Regular",
    fontWeight:'normal'
  },
  medium: {
    fontFamily: "Poppins_500Medium",
    fontWeight:'normal'
  },
  light: {
    fontFamily: "Poppins_300Light",
    fontWeight:'normal'
  },
  thin: {
    fontFamily: "Poppins_200ExtraLight",
    fontWeight:'normal'
  },
  bold: {
    fontFamily: "Poppins_700Bold",
    fontWeight:'normal'
  }
  },
};

const theme = {
  ...DefaultTheme,
  fonts: configureFonts(fontConfig),
};
  

Другой компонент, также из react native paper , извлекает шрифт должным образом

       <Searchbar
        placeholder="Type here..."
        onChangeText={text => this.searchItems(text)}
        value={this.state.value}
      />
  

Ответ №1:

 import { configureFonts, DefaultTheme, Provider as PaperProvider } from 'react-native-paper';

const theme = {
  ...DefaultTheme,
  fontFamily: {...DefaultTheme.fonts.regular.fontFamily = 'fontName'} 
};

export default class App extends Component {
  
  render() {
    const RootStack = createStackNavigator();
    return (
      <PaperProvider theme={theme}>
        <SafeAreaProvider>
        </SafeAreaProvider>
      </PaperProvider>
    );
  }
  

react-native-cli: 2.0.1
react-native: 0.63.4