React-native: Unable to add custom font

[wamry]

• [x] I have reviewed the documentation
• [x] I have searched existing issues
• [x] I am using the latest React Native version

I have searched existing issues, and they're all either closed with no solution or flagged "more information needed", so i'm making a new issue, hopefully this will contain all the info needed.

I'm trying to add a custom font, but no matter the font I try to add, I can't use it in the project,

Environment:

OS: Windows 10
Node: 9.5.0
Yarn: 1.5.1
npm: 5.6.0
Watchman: Not Found
Xcode: N/A
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.1 => 0.55.1

Steps to Reproduce

i'm using Android KitKat 4.4.2(real device)
The font i'm trying to use is Vinc Hand, the file name is "vinchand.ttf", put it in "./src/assets/fonts"

Inside package.json

  "rnpm": {
    "assets": [
      "./src/assets/fonts"
    ]
  },

Checked if the file vinchand.ttf is in "android\appsrc\main\assets\fonts" after running command "react-native link", and it is.

code to render text:
<Text style={{ fontFamily: "vinchand", fontSize: 20, color: "#000"}}>constantinople</Text>

Expected Behavior

To see "constantinople" using Vinc Hand font.

Actual Behavior

"constantinople" shows on screen, but not using Vinc Hand font.

[kelset]

Duplicate of https://github.com/facebook/react-native/issues/18269

[wamry]

no, it's not duplicate, the guy is using a different environment, different device, using ios not android.
and his issue is completely different, he gets unrecognized font, i don't get that error. and several other differences in his issue including the poor issue reporting of #18269 .

[SpQuyt]

Maybe you can do this:
Right click your font -> Properties -> go to "Detail" tab -> then change your font's name into whatever it is in "Title" of "Detail" tab.
Then you use that font in react-native.

Hope this help.