I have just installed React Native vector icons with this comand:
npm install react-native-vector-icons
But if I use it in the index.androi
Here is full UPDATED answer, just follow these steps :-
npm install react-native-vector-icons --save
react-native link
react-native link react-native-vector-icons
import Icon
using one of these ( as per your requirement )
MaterialCommunityIcons
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
Ionicons
import Icon from 'react-native-vector-icons/Ionicons';
FontAwesome5
import Icon from 'react-native-vector-icons/FontAwesome5';
Uses (JSX)
<Icon size={24} color="white" name="movie" />
Maybe you are not importing correctly the library, you must specify a family of icons you wanna use.
I think the name of the icon you are using not correspond with the icon you are searching.
For example, if you will use material icons, the import will be:
import Icon from 'react-native-vector-icons/MaterialIcons';
And change the name to name={add}
Try look for other icons family if you don want use material icons.
I think this may help, at least this is what I have to do every time. In the Project/android/app/build.gradle
, add this line:
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
First, make sure you're saving the dependency in your project by doing:
npm install react-native-vector-icons --save
. Including the --save
is necessary, otherwise react-native link
won't be able to locate the module.
Before you can use them in your iOS or Android project, you also have to link the native modules. The quick way to do this is by using the following command:
react-native link react-native-vector-icons
If for any reason you have problems using react-native link
to link the native modules, the react-native-vector-icons
README also provides detailed instructions for linking them manually on Android and iOS, and integrating the library on the web as well.
Step 1: Install react-native-element:
npm install react-native-elements --save
Steps 2: Install react-native-vector-icons Install from npm
npm install react-native-vector-icons --save
Link it
react-native link react-native-vector-icons
After that you can use it in your page by: Step 1:
import { Icon } from 'react-native-elements';
Step 2:
<Icon name="md-beer" type="ionicon" color="#887700" />
You can use :
icon = {"<"Icon name='lock'/>}
Or :
icon = {{ type:'font-awesome',name:'lock'}}
in any React native componant property.