shyaniv7 / react-native-fontawesome-pro Goto Github PK
View Code? Open in Web Editor NEWEasily use your FontAwesome Pro icons in React-Native
License: MIT License
Easily use your FontAwesome Pro icons in React-Native
License: MIT License
I was updating v1 -> v2 and found out @fortawesome/fontawesome-svg-core is missing in your
installation steps. After installing it manually, everything worked fine.
Or might be I missed something :)
Cheers, Miro
react-native-fontawesome-pro
version are you using?react-native
version are you using?The <TouchableOpacity>
's activeOpacity
determines what the opacity of the wrapped view should be when touch is active. It defaults to 0.2 and in some cases, this is far too opaque.
I was thinking of creating a merge request that allows for this prop to be passed on to the <Icon>
's wrapping <TouchableOpacity>
but this could mean that people want other props (such as hitSlop
or onLongPress
for example) to be added too.
One could always just skip the onPress
prop and wrap the <Icon>
in a <TouchableOpacity>
themselves in order to have full control.
Thoughts?
I've described my issue on the font awesome board here but it doesn't seem like they are experiencing this issue.
Wondering if you guys knew the reason behind why the icon would look like this?
react-native-fontawesome-pro
version are you using? "react-native-fontawesome-pro": "^1.0.12",react-native
version are you using? react-native-cli: 2.0.1Hello,
react-native-fontawesome-pro
versionreact-native
version are you using?Maybe this may help also:
import Icon from "react-native-fontawesome-pro";
Could not find a declaration file for module 'react-native-fontawesome-pro'. 'c:/My-app/node_modules/react-native-fontawesome-pro/index.js' implicitly has an 'any' type.
Try npm install @types/react-native-fontawesome-pro
if it exists or add a new declaration (.d.ts) file containing `declare module 'react-native-fontawesome-pro';
Any plans to support the new duo tone fonts?
Hello,
Thanks for great library!
I trying to implement typescript definitions but i can't. I wrote this code:
declare module 'react-native-fontawesome-pro' {
import {Component} from "react";
type PrefixType = 'regular' | 'light' | 'solid' | 'brands';
function configureFontAwesomePro(prefixType: PrefixType): void;
interface IconProps {
name: string,
color?: string,
size?: number,
type?: 'regular' | 'solid' | 'brands' | 'light',
iconStyle?: object,
containerStyle?: object,
onPress?: null | Function
}
export class Icon extends Component<IconProps> {}
}
but it returns TS2604: JSX element type 'Icon' does not have any construct or call signatures.
Can you help me?
Thank you very much :)
Have a great day!
Instructions give out of date guidance on how to setup .npmrc, sources:
From this:
@fortawesome:registry=https://npm.fontawesome.com/<TOKEN>
to this:
@fortawesome:registry=https://npm.fontawesome.com/
//npm.fontawesome.com/:_authToken=<TOKEN>
I was wondering if this needs repo's instructions need to be updated to reflect this change from FontAwesome?
When trying to render Icon it gives "TypeError: Cannot read property 'icon' of undefined
" error. When looked up in detail, the method findIconDefinition() from "@fortawesome/fontawesome-svg-core" doesn't return an icon instead returns undefined.
This wasn't the case one week back.
react-native-fontawesome-pro version : 2.0.1
react-native: 0.57.7
Please describe your problem in detail including how to replicate this problem
Attempting to use this package with a project that utilizes typescript, compilation errors are thrown when I attempt to use both configureFontAwesomePro() and Icon in the project. Tried to solve by making my own declaration file, successful at removing error for configureFontAwesomePro() but not for Icon. HOWEVER, the icon still loads if I just run the app without running "tsc" in the project directory.
How I am using Icon...
<Text
style={styles.navigationRowButtonText}
>
<Icon
name={`${this.props.icon}`}
size={32}
/>
</Text>
The error I get is as follows...
JSX element type 'Icon' does not have any construct or call signatures.
The declaration file is as follows...
/// <reference types="node" />
declare module 'react-native-fontawesome-pro' {
export function Icon (
prop: { name: string, size: number, color: string, type: string, containerStyle: any, iconStyle: any, onPress: any, activeOpacity: number }
): any;
export function configureFontAwesomePro(): void;
};
react-native-fontawesome-pro
version are you using?react-native
version are you using?typescript
version are you using?Is there a way to add a shadow to the icon? I have tried using the standard react native way using shadow...
props but to no effect?
Thanks
What react-native-fontawesome-pro
version are you using?
1.0.12
What react-native
version are you using?
0.52.2
Does the issue occur on IOS, Android or Both?
Both
I followed the install instructions. I have both the app.js and the component imports and config.
When I try to add an Icon via the example, I get the following error in my component:
Invariant Violation: Native component for "RNSVGPath" does not exist"
Does anyone know what causes this issue?
react-native-fontawesome-pro
version are you using?1.0.12 (latest version I'm assuming)
react-native
version are you using?react-native-cli: 2.0.1
react-native: 0.54.3
Only checking on iOS
I know that you can do fa-spin
on icons to make them spin. Is this possible here?
Unable to enter token when using yarn install
Firstly, thanks for this great package!
I have noticed that there is a substantial size difference with the icons from this package and the ones used in react-native-vector-icons
.
Both are set to size={24}
Is this a bug?
react-native-fontawesome-pro
version are you using? 2.0.1react-native
version are you using? 0.51.0Using configureFontAwesomePro
as described in the documentation does not work - it has no effect.
Can I get source path of the icon like getImageSource in https://github.com/oblador/react-native-vector-icons to use in TabBar/NavigatorIOS?
V1 worked perfect, after upgrading to V2 this error occurred.
react-native-fontawesome-pro
version are you using?react-native
version are you using?"@fortawesome/free-brands-svg-icons": "^5.7.2",
"@fortawesome/pro-light-svg-icons": "^5.7.2",
"@fortawesome/pro-regular-svg-icons": "^5.7.2",
"@fortawesome/pro-solid-svg-icons": "^5.7.2",
Get prompted for FA token on every NPM install
Comparing the FontAwesome icon set which ships with Expo to this project, we lose all typing on the name
property for the icon component. It would be particularly helpful during development to ensure the names are correct without having to look them up.
From what I can tell, it could be as simple as the following change, but I'd to confirm before making a PR:
diff --git a/index.d.ts b/index.d.ts
index 7bb654d..7a3b969 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -1,8 +1,9 @@
+import { IconName } from "@fortawesome/fontawesome-svg-core";
import { ViewStyle, ViewProps } from "react-native";
import { SvgProps } from "react-native-svg";
export interface IconProps extends ViewProps {
- name?: string;
+ name?: IconName;
size?: number;
color?: string;
type?: "regular" | "light" | "solid" | "brands";
react-native-fontawesome-pro
version are you using? Latestreact-native
version are you using? N/AA declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.