React-native: [0.60.5] fontWeight Has No Affect on Android When Using Numerical Values

[AlexK777]

fontWeight properties on Text components are not having an affect on Android styles on React Native Version 0.60.5. If I use the bold value, the Text component picks up the bold style, but any other value 200 up through 800 all display the same appearance as normal or 100. I performed the same change on RN Version 0.59.10 and the Text component is styled correctly.

React Native version:

    OS: macOS High Sierra 10.13.6
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Memory: 13.78 GB / 32.00 GB
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 10.16.3 - ~/.nvm/versions/node/v10.16.3/bin/node
    Yarn: 1.17.3 - ~/Developer/Projects/hy-vee-grocery/node_modules/.bin/yarn
    npm: 6.9.0 - ~/.nvm/versions/node/v10.16.3/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
    Android SDK:
      API Levels: 23, 25, 26, 27, 28
      Build Tools: 27.0.3, 28.0.3, 29.0.2
      System Images: android-23 | Google APIs Intel x86 Atom, android-24 | Google APIs Intel x86 Atom, android-25 | Google APIs Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-26 | Google Play Intel x86 Atom
  IDEs:
    Android Studio: 3.4 AI-183.6156.11.34.5692245
    Xcode: 10.1/10B61 - /usr/bin/xcodebuild
  npmPackages:
    react: 16.8.6 => 16.8.6
    react-native: 0.60.5 => 0.60.5

Steps To Reproduce

1. Change the fontWeight of a Text component from 100 to 600 on Android.

Describe what you expected to happen:
Text component should be styled with new fontWeight, but the style does not change.

Snack, code example, screenshot, or link to a repository:
RN 0.60.5

RN 0.59.10

I just used react-native init projects at RN 0.59.10 and 0.60.5 to reproduce this behavior.

[dulmandakh]

It's known issue due to Android limitations. Only way to use custom font weights is to create a custom font.

Android added support changing font weights programmatically, but won't work on older versions.

[hweister]

@dulmandakh why old version of react native works?

[jonnyberanek]

It's known issue due to Android limitations. Only way to use custom font weights is to create a custom font.

So... How would you go about doing that?

[chgsilva]

I am facing the same issue, any tips?

[cdunkel]

I have the exact same question as @hweister. If this were a pure Android limitation then why does it work in 0.58.6 on the same Android device / emulator?

[greg7gkb]

PR was here: https://github.com/facebook/react-native/pull/25341
Workarounds here: https://github.com/facebook/react-native/issues/25696

[aelesia]

I wrote a npm package to handle mapping of custom fonts (eg. Roboto-Light, Roboto-Heavy) to font weights. Heavily modified from jacobcabantomski-ct's code above.

react-native-font-weight (alpha)

[ARDcode]

thanks @aelesia and @jacobcabantomski-ct for idea and code
its temporary solution before 0.62 release for Expo and RN: react-native-text-weight

[leolusoli]

Has it been fixed in RN 0.62.0?

[samufort]

Has it been fixed in RN 0.62.0?

No

[dacevedo12]

This issue should be reopened

[knoxgon]

Only 'bold' seems to be working... Badly need the numerical values.

[Saurabh-stack]

I am too facing same issue.
I am using expo client and Android mobile device. I tried installing custom font, still only bold (700 on android) and regular is working.
Issue should be reopen

[fabriziobertoglio1987]

@Saurabh-stack https://github.com/facebook/react-native/pull/29117 fixes this. This issue will be closed once https://github.com/facebook/react-native/pull/29117 is merged

[zhigang1992]

It seems like roboto doesn't have 600 weight

https://fonts.google.com/specimen/Roboto#standard-styles

[AzadKshitij]

I still have the same issue can anyone tell me about how to solve it!!
react-native-cli: 2.0.1
react-native: 0.63.2