React-native: TextInput custom FontFamily doesn't work in Android

[michaelsyap]

Hello everyone!

I am reporting an issue concerning TextInput in Android where fontFamily changes the style of the placeholder but doesn't change style of the font when you type text. However in iOS all these things work. I've attached a screenshot at the bottom for your reference.

Note: In Android, fontFamily works in other components like <Text></Text>. Please see the screenshot below for proof.

Environment

OS: macOS Sierra 10.12.6
Node: 6.10.0
Yarn: 1.5.1
npm: 3.10.10
Watchman: 4.7.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 3.0 AI-171.4443003

Packages: (wanted => installed)
react: ^16.3.0-alpha.1 => 16.3.0-alpha.2
react-native: 0.54.2 => 0.54.2

Steps to Reproduce

I made a very simple example on how to reproduce this issue.

1. Create a <TextInput />
2. Create this style below:

const styles = StyleSheet.create({
    inputStyle: {
        ...Platform.select({
            ios: {
                fontFamily: 'Nunito',
                fontWeight: '600',
                fontStyle: 'normal'
            },
            android: {
                fontFamily: 'Nunito-SemiBold',
            }
        })
    }
});

Note: The font specified above is the font that we're using on the project.

1. Assign the styles.inputStyle to the style attribute of <TextInput />

<TextInput style={styles.inputStyle}/>

Expected Behavior

iOS & Android:

Setting the fontFamily in the style attribute of <TextInput /> should change the font family of the text when you type into the <TextInput>

...Platform.select({
      ios: {
        fontFamily: 'Nunito', 
        fontWeight: '600',
        fontStyle: 'normal'
      },
      android: {
        fontFamily: 'Nunito-SemiBold',
      }
    })

Actual Behavior

Thank you very much!

[react-native-bot]

Thanks for posting this! It looks like your issue may refer to an older version of React Native. Can you reproduce the issue on the latest release, v0.55?

Thank you for your contributions.

[react-native-bot]

I am closing this issue because it does not appear to have been verified on the latest release, and there has been no followup in a while.

If you found this thread after encountering the same issue in the latest release, please feel free to create a new issue with up-to-date information by clicking here.

[danaee123]

in "react-native": "^0.55.4",
fontFamily dosent Work in

[iamchathu]

It's doesn't work in "~0.55.2" too

[tommynordli]

I'm also experiencing issues with custom fontFamily on Android, especially related to calculating new line when using multiline

[rahulpunchh]

removing keyboardtype fixed for me.

[WilliamIPark]

@michaelsyap I am experiencing the same issue. Did you ever get this fixed?

[Adokiye]

Has anybody been able to find a solution to this, fontFamily doesn't work for text input for some particular fonts

[spbond]

This bug is affecting me as well, in react-native 0.59.3

[lucasbento]

For some reason I started getting this on 0.59.3 only in Android and I fixed it by specifying fontWeight: 'normal'.

[Adokiye]

@lucasbento Thanks, fontWeight: 'normal' worked for me too

[WilliamIPark]

@lucasbento Thank you! This fixed the longest outstanding bug in my app.