React Native

How to set/use vector icons in react native

Posted On
Posted By Neha Dwivedi

How to set/use vector icons in react-native: In today’s era icon is a basic need of all apps, it gives a much better look to your app so today we going to talk about icons, for icon npm provide a great plugin named vector-icon for implementing vector icon please follow these steps.

Step1: install the npm plugin for vector icons.

npm install react-native-vector-icons.

Step2: link the plugin(only for those whoʼs versions is below 0.61).

react-native link react-native-vector-icons

Step3: Now we are going to import the vector icons where itʼs required. import Icon from ‘react-native-vector-icons/dist/FontAwesome’;

Step4: Now we are going to implement the vector icons.

Way1: Declare a constant variable and store the icon in this, such as import Icon from ‘react-native-vector-icons/dist/FontAwesome‘; //setting vector icon dynmically.

const myIcon = <Icon n4me=”comments” size={30} color=”#900″ solid />; class Home extends Component {

constructor(props) {

super(props); //define/declare state here..

this.state = { } } render() { return( {myIcon} )}}

Related Post

leave a Comment

Latest Post

React Native

How to set a dynamic/responsive square grid in react native

Read More
Posted On
React Native

How to generate the release build in react native android

Read More
Posted On
React Native

How to set AppIcon in react native Using CLI

Read More
Posted On
React Native

How to setup crashlytics in react native

Read More
Posted On