In this blog post I will walk you through how to create a navigation drawer with custom content component in react native using navigation library react navigation. First of all add react navigation library to your react native project using the following command: npm install react-navigation Now, install react native gesture handler in your project…
I came across this react native error when I tried to run my react native project with react-native run-android command after adding a third party library which made native changes. Here’s the error which caused the failure of the app build:java.lang.RuntimeException: java.lang.RuntimeException: com.android.builder.dexing.DexArchiveMergerException: Error while merg ing dex archives: The number of method references in…
Performance of Android apps built with react native is a bit lower when compared to the performance of iOS apps. So how to increase the performance of Android apps built with react native? The answer is by enabling Hermes. Hermes is an open source JavaScript engine optimized for running react native Android apps. It helps…
When we create a new react native project we prefer the latest version of react native. But in some situations, we might need to create a new project using a specific react native version. This usually happens when the latest version of react native has many breaking changes and is unstable. react-native init ProjectName is…
Update: This tutorial is outdated. I suggest you check out the authentication flow from the official documentation. While creating an authentication flow we usually don’t want the screens to navigate back. In such situations, we want a navigator which resets the navigation history while navigating. In this blog post, I will show you how to…
By default, the behavior of the FlatList component of react native is to scroll. But, in some unusual situations, you may want to disable scrolling in react native FlatList. This blog post goes through how to disable scrolling in FlatList. As you know, FlatList inherits the props of the ScrollView component. Hence you can use…
I created a new react native (v60.0) project and tried running by using command react-native run-android but faced Error: spawn vscode ENOENT error in the terminal as shown in the screenshot given below. I was running commands through the terminal of my IDE Visual Studio Code. In order to solve this react native issue, I…
Yesterday, I created a new react native project with the latest react native version 0.60 and tried to open it in my Android Studio but I got a response saying you can’t open the project with the current version of Android Studio. So, I decided to update my Android Studio to the latest version –…
In this blog post, I will show you how to add an icon button in Flutter. Before proceeding you should know what an icon button is. An Icon button is an icon that reacts to touches by filling the color. It is included in the Material widget. Using the IconButton widget you can create a…
Some famous apps out there such as Instagram are restricted to portrait orientation. You may also want your react native app to support portrait orientation only. By default, react native works on both orientations- portrait and landscape. Let’s check how to restrict the app to portrait in react native. To make the app portrait only…
The Floating Action Button, fab, is an important component of the material design user interface. It is a circular button that usually floats above the right bottom of the screen. A fab is used for triggering primary actions such as create, edit, etc. In this blog post, let’s learn how to create a floating action…
There are tons of mobile devices including smartphones and tablets with different dimensions and resolutions. Hence, sometimes it is important for developers to identify the device. In this blog post, I will tell you how to detect whether a device is a tablet or not in React Native. I prefer to use react native device…