Comments (16)
@eathentica check your font files names and see if they are matching this patterns:
fa_brands_400.ttf
fa_regular_400.ttf
fa_solid_900.ttf
If not, change them to match exactly as that, because a few versions behind, the font files in fontawesome, had the names separated with underlines, but now, the font files are separated with dashes. I already open a PR to change the Icon.js to match dashes instead underlines, but the PR wasn't merged yet as you can see here: #52
from react-native-fontawesome.
Hi,
I have almost the same problem. My icons are not question marks but some kind of cross marks.
Here is my build.gradle
buildscript {
ext {
buildToolsVersion = "27.0.3"
minSdkVersion = 16
compileSdkVersion = 27
targetSdkVersion = 26
supportLibVersion = "27.1.1"
googlePlayServicesVersion = "16.0.0"
androidMapsUtilsVersion = "0.5+"
}
repositories {
google()
jcenter()
}
dependencies {
classpath 'com.android.tools.build:gradle:3.1.4'
classpath 'com.google.gms:google-services:4.0.1'
}
}
allprojects {
repositories {
mavenLocal()
google()
jcenter()
maven {
url "$rootDir/../node_modules/react-native/android"
}
maven {
url "https://maven.google.com"
}
}
}
task wrapper(type: Wrapper) {
gradleVersion = '4.4'
distributionUrl = distributionUrl.replace("bin", "all")
}
I have to go back to 0.57.4 to get it works.
Did I miss out something?
Thanks in advanced!
from react-native-fontawesome.
@eathentica Just change the file name, Android considers the file name and not the font family. You can remove the FontAwesome.ttf file too and let just the other three files, brands, regular and solid.
from react-native-fontawesome.
I created a PR that solves this issue with hyphens: #61
from react-native-fontawesome.
Did you check if you are using the correct IconTypes enum such as IconType.FAR, IconType.FAS or IconType.FAB ?
from react-native-fontawesome.
Hi,
I have almost the same problem. My icons are not question marks but some kind of cross marks.Here is my build.gradle
buildscript {
ext {
buildToolsVersion = "27.0.3"
minSdkVersion = 16
compileSdkVersion = 27
targetSdkVersion = 26
supportLibVersion = "27.1.1"
googlePlayServicesVersion = "16.0.0"
androidMapsUtilsVersion = "0.5+"
}
repositories {
google()
jcenter()
}
dependencies {
classpath 'com.android.tools.build:gradle:3.1.4'
classpath 'com.google.gms:google-services:4.0.1'
}
}allprojects {
repositories {
mavenLocal()
google()
jcenter()
maven {
url "$rootDir/../node_modules/react-native/android"
}
maven {
url "https://maven.google.com"
}
}
}task wrapper(type: Wrapper) {
gradleVersion = '4.4'
distributionUrl = distributionUrl.replace("bin", "all")
}I have to go back to 0.57.4 to get it works.
Did I miss out something?Thanks in advanced!
Hi! Can you provide the code part where you are setting the icon?
from react-native-fontawesome.
I use FontAwesome everywhere in my code.
In Version 0.57.4, for example:
{Icons.chevronLeft}
And it will appear as followed:
In Version 6.0.1
{Icons.chevronLeft}
And here is how it looks like:
The action buttons on right bottom display correctly, because I use "react-native-vector-icons" there.
I have delete the build folder, clean, rebuild. It did not help. The use of IconType.FAR also does not work.
iOS has no problems!
Best regards,
Eathentica
from react-native-fontawesome.
Hi, I have a look at the assets. There are the following files:
FontAwesome.ttf
FontAwesome5_Brands.ttf
FontAwesome5_Regular.ttf
FontAwesome5_Solid.ttf
How do I change their names?
Best regards,
Eathentica
www.eathentica.com
from react-native-fontawesome.
Sorry, but I still do not understand what you meant.
FontAwesome.ttf ---> ?
FontAwesome5_Brands.ttf ---> fa_brands_400.ttf
FontAwesome5_Regular.ttf ---> fa_regular_400.ttf
FontAwesome5_Solid.ttf ---> fa_solid_900.ttf
Or do I miss something here?
from react-native-fontawesome.
FontAwesome.ttf ---> ?
FontAwesome5_Brands.ttf ---> fa_brands_400.ttf
FontAwesome5_Regular.ttf ---> fa_regular_400.ttf
FontAwesome5_Solid.ttf ---> fa_solid_900.ttf
Exactly, delete the FontAwesome.ttf file and change the other file names like this:
FontAwesome5_Brands.ttf ---> fa_brands_400.ttf
FontAwesome5_Regular.ttf ---> fa_regular_400.ttf
FontAwesome5_Solid.ttf ---> fa_solid_900.ttf
from react-native-fontawesome.
const IconTypes = {
FAR: Platform.OS === 'ios' ? 'FontAwesome5FreeRegular' : 'fa_regular_400.ttf',
FAS: Platform.OS === 'ios' ? 'FontAwesome5FreeSolid' : 'fa_solid_900.ttf',
FAB: Platform.OS === 'ios' ? 'FontAwesome5BrandsRegular' : 'fa_brands_400.ttf'
}
did not work for me either...
what you must do is download the FA files for desktop and include them within your android package in android/app/src/main/assets/fonts and rename them as advised above (i used .otf like fa_regular_400.ttf)
from react-native-fontawesome.
@eathentica check your font files names and see if they are matching this patterns:
fa_brands_400.ttf
fa_regular_400.ttf
fa_solid_900.ttfIf not, change them to match exactly as that, because a few versions behind, the font files in fontawesome, had the names separated with underlines, but now, the font files are separated with dashes. I already open a PR to change the Icon.js to match dashes instead underlines, but the PR wasn't merged yet as you can see here: #52
This worked for me. Please update your repo's readme with proper files. This link gives files with dashes instead of underscores: https://github.com/FortAwesome/Font-Awesome/releases/download/5.4.1/fontawesome-free-5.4.1-web.zip
from react-native-fontawesome.
Same for me...hyphen->underscore substitution is necessary.
Please update readme or review the PR.
from react-native-fontawesome.
I would suggest just using react-native-elements or native base as it has better support for FA FA5 and many other icon libraries in one dep.
from react-native-fontawesome.
I agreed with @rgordon95 about using other alternatives than this repo, because I think that any maintainer is looking for this anymore since FontAwesome/react-native-fontawesome, that I'm using for new projects by the way. I just created this PR because I have some legacy projects that I'm using entria/react-native-fontawesome and I just couldn't change the package right now.
from react-native-fontawesome.
Switching to FontAwesome/react-native-fontawesome solved my issue
from react-native-fontawesome.
Related Issues (20)
- IconTypes aren't actually available HOT 3
- Move NPM package from my person npm account to Entria Org
- Missing index.d.ts in npm repo HOT 1
- iOS Font names are incorrect in 6.0.0 package HOT 2
- Please release a new version HOT 1
- 6.0.1 Icons with matching names do not show regular font HOT 17
- Icons not visible in build android and iphone HOT 7
- Not working on Android HOT 7
- Library searching for fonts with underscores in name, rather than default dashes. HOT 7
- Pro rather than free? HOT 6
- Fonts not working, showing box with cross or Chinese characters HOT 7
- Can't resolve symbol `IconTypes` HOT 2
- New version of NPM Package HOT 6
- Update RN Version in Sample Project HOT 2
- Font Family Issue HOT 7
- Add Support for Duotone HOT 1
- Display Question marks in Ios 14 HOT 5
- Wrong TS types.
- Why does /rturk/react-native-fontawesome redirect here and version 6.0.0 vs 7.0.0
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-fontawesome.