React-Native Button 中的自定义字体

Question

How can I use a custom FontFamily for a ReactNative Button? This is the button:

 <Button
      title="ACCEDI"
      color={"#008800"}
      marginVertial={10}
      fontFamily={Fonts.Montserrat}
 />

but this is not working, the fontFamily is not changing. How can i change it?

Answer 1

Try to put it in the style property, please:

textStyle={{fontFamily: Fonts.Montserrat}}

OR

titleStyle={{fontFamily: Fonts.Montserrat}}

Here are the useful links:

https://medium.com/react-native-training/react-native-custom-fonts-ccc9aacf9e5e

https://github.com/react-native-training/react-native-elements/issues/977

Answer 2

Try using this link as a reference custom fonts in react native

Edit the font folder src in package.json and try this link.

Answer 3

I don't think you can set font-family. Look at the source code for button. ( https://github.com/facebook/react-native/blob/master/Libraries/Components/Button.js ). They havent exposed any prop for text style.

 const {
      accessibilityLabel,
      color,
      onPress,
      touchSoundDisabled,
      title,
      hasTVPreferredFocus,
      nextFocusDown,
      nextFocusForward,
      nextFocusLeft,
      nextFocusRight,
      nextFocusUp,
      disabled,
      testID,
    } = this.props;

You can however create a TouchableWithNativeFeedback and add a Text component and give the styles you like.

Answer 4

in font family you simple put the font name

fontfamily:'your-font-family'