react-native-vector-icons
react-native-vector-icons copied to clipboard
Adding Font Awesome 5 Pro icons to ios results in the display of question marks instead of the intended icons with "IconExplorer" example
I am encounting a problem with Font Awesome 5 Pro icons in ios, where the icons are being displayed as question marks. to reproduce the issue follow these steps.
- clone the vector icons project "https://github.com/oblador/react-native-vector-icons.git" repository using the provided example "iconExplorer"
- inside Xcode, create a new folder named "Fonts" under the "iconExplorer" target and place Font Awesome 5 Pro TTF files within this folder. this action will result in the files being added to the "Copy bundle resources" in the "Build Phases".
- Added the fonts name into info.plist.
- Rebuild the Pod in the IOS folder by executing "pod install" and then launch the project in Xcode.
Result: All vector icons provided as default are working correctly - and Font Awesome Pro Icons are not displaying Properly. The icons
Working perfectly on Android default icons and Font awesome 5 pro.
@meixiaoLi Downgrading to 9.2.0 worked for me.
@meixiaoLi Downgrading to 9.2.0 worked for me.
Thanks for your response mate :).
I managed to get it to work by modifying the 'create-icon-set-from-fontawesome5.js' file (node_modules/react-native-vector-icons/lib/create-icon-set-from-fontawesome5.js)
Since I'm only using the Pro version, I made a change to line 42. Specifically, I changed the line from:
Original: FontFamily: ${family}-${styleName}
To: New: FontFamily: ${family}${styleName}
This adjustment was necessary because the postScriptName of these TTF files (from FontawesomePro) doesn't include a hyphen (-). (I discovered the postscript name by drop my TTF file to fontdrop.info)
Please note that I made these changes within the 'node_modules' directory. This means that the next time I perform a 'yarn install' or 'npm install' , these modifications will be overwritten. For me, this is just a temporary solution.
Reproducing this as well
Reproducing this as well
Hello mate,
I upgraded from FontAwesome 5 Pro to FontAwesome 6 Pro and changed the required icon names I used to the V6 names. everything works fine in V6