Month: April 2019

How to make iOS Simulator Keyboard shown when Running Apps

By default, you use keyboard hardware of your mac in your iOS simulator. But you may need to test the behaviour of iOS device keyboard when using your react native app. It is also known that React Native some keyboard related issues. Switching from hardware keyboard to simulator keyboard is easy. Open your Simulator > …

How to make iOS Simulator Keyboard shown when Running Apps Read More »

OnPress Function Fires only after Tapping Twice when Keyboard Present React Native Issue Fix

This is a common react native issue especially when you use TextInput with ScrollView / FlatList as parent. In such cases, the other components like button respond only when you click or tap outside of the TextInput twice. To solve this React Native issue, you have to use keyboardShouldPersistTaps prop with ScrollView or FlatList. Then …

OnPress Function Fires only after Tapping Twice when Keyboard Present React Native Issue Fix Read More »

Requiring unknown Module “571” React Native Error Fix

I was trying to run a React Native project on iPhone simulator with react-native run-ios and came across this react native error:Error: Requiring unknown module “571”.If you are sure the module is there, try restarting Metro Bundler. You may also want to run yarn, or `npm install` (depending on your environment).It was the first time …

Requiring unknown Module “571” React Native Error Fix Read More »

How to Add Activity Indicator in React Native Webview to Show Progress

WebView is an integral component in React Native. You can use it as a mobile browser inside your React Native app. As we know, web pages take some time to load. It’s better to show an ActivityIndicator when the web pages load every time. For showing ActivityIndicator while loading I use two props of WebView- …

How to Add Activity Indicator in React Native Webview to Show Progress Read More »

How to Make an Image Rotate with Animation in React Native

Last Updated on December 13, 2020. In this React Native tutorial, I show you how to rotate an image continuously in React Native. For Animation, we have to use Animated library from React Native. In the componentDidMount lifecycle Animated.loop is used to continue the animation as a loop. We also set Animated.Value as 0 in …

How to Make an Image Rotate with Animation in React Native Read More »

How to Add an Icon inside TextInput in React Native

Last Updated on December 10, 2020. Sometimes, you may want to show icon inside your TextInput, specifically saying- an icon aligned to the left of the TextInput. React Native TextInput has inlineImageLeft prop to add icon inside it. Unfortunately inlineImageLeft supports only Android platform. There’s also another prop named inlineImagePadding to adjust the padding of …

How to Add an Icon inside TextInput in React Native Read More »