Linking and Using Third Party Libraries
The third party Library provides the native app features which are not available in React Native features. If we refer to React Native documentation, there are lots of features that are not available (such as maps). Due to this, we need to add third party libraries in our project. In this tutorial, we would learn how to add the third parties libraries in our app (adding third party icons). There are different sets of bundled Icon available. Some of them are listed below:
There are different ways and commands to install the libraries depending upon the development OS and target OS. In this tutorial, we install the Ionicons libraries. To install the Ionicons libraries on Windows, run the command: $ npm install react-native-vector-icons --save.
In your command prompt, run D:\ReactNative\navigationApp>npm install --save react-native-vector-icons
Linking Libraries on Android
Open your android/settings.gradle file and add the below code. Here, we are adding only Ionicons library. If you want to add others libraries, just add them in include tag and mention their path and library in android folder at project as below.
Now, add the following dependency in android/app/build.gradle:
Earlier, upto 2018 the compile term is used in place of implementation.
To add more libraries, simply separate them with comma and add libraries packages. The above procedures are the common to add native libraries in the Android.Now, in android/app/build.gradle add the following dependency:
React Native Linking Third Party Library Example
In this example, we will add the trash icon of the Ionicons library. Open your project, and add the import Icon from 'react-native-vector-icons/Ionicons' package. Search for icon at ionicons.com that you want to add (in my case ios-trash).
In the npm doc, you will find the Icon Component and its properties.