React Native: 3 best libraries for navigation and routing

March 31, 2021 A Goodman

3 great libraries for navigation and routing in your React Native mobile apps. React Navigation React Navigation is widely used, well documented and I personally like this one the most. It delivers out-of-the-box, pre-styling navigators such…

How to create circle images in React Native

October 23, 2020 A Goodman

To create perfectly round images in React Native, just give the borderRadius property a very high value. Example The code: Perform the snippet above and see the result on your machine 😉 😉

React Native: How to add shadow effects on Android

September 30, 2021 A Goodman

To add shadow effects on Android, you need to use the elevation property: Example This example shows you how to create drop shadows on both iOS and Android. Screenshot: The complete code: Unfortunately, at this time,…

How to create round buttons in React Native

May 3, 2021 A Goodman

The example below will show you how to create round buttons in React Native. We will use TouchableOpacity instead of the basic built-in Button component. The Code Replace the default code in App.js with the following:…

React Navigation 5: useRoute hook example

June 6, 2020 A Goodman

React Navigation provides a hook which helps you access to the route object. It is the useRoute hook. Example Create a new React Native project, delete all the default code in App.js and add this (don’t…

React Navigation 5: Hiding bottom tab on a specific screen

July 14, 2021 A Goodman

React Navigation is a great library for React Native to navigate. If you’re using createBottomTabNavigator and want to hide the bottom tab bar on a specific screen, just use the tabBarVisible option: For more clarity, check…

Using Font Awesome Icons in React Native

June 3, 2020 A Goodman

This tutorial will show you how to use Font Awesome icons in a React Native app. Adding Font Awesome to your React Native project Install the required packages: Link your native dependencies by running: Usage Import…

React Navigation 5: Header background and header title color

June 3, 2020 A Goodman

When using React Navigation 5 to route and navigate your React Native apps, the header bar background color and the header title color is totally up to you. To set the header background color, use this…

React Navigation 5: Center the header title on Android

June 3, 2020 A Goodman

By default, the header title of a React Native app that using React Navigation 5 is on the left side. To center it, just add this option: Full example: Screenshot: Happy coding 🙂

React Native: Please accept all necessary Android SDK licenses…

August 24, 2021 A Goodman

This short article shows you how to fix an error that often happens when working with React Native. The Problem When trying to run a React Native app on a virtual Android device with the following:…

React Navigation 5: Dynamic header title (with hooks)

March 19, 2021 A Goodman

This article shows you how to dynamically update the header title of a screen in a React Native app. We will use React Native latest version, the useState hook, the useEffect hook, and the React Navigation…

Null is not an object (evaluating ‘_RNGestureHandlerModule…

March 19, 2021 A Goodman

When developing a new React Native project on my Mac, I fall into a problem when running npm run ios. I’m using React Navigation 5 and React Native 0.62.2 (you can check out my dependencies below)….

1 2 3