How to Open external URL in Web Browser in React Native

Sometimes, you may want to open a url in the web browser of the device. You can use Linking api from react native which is used for managing the interaction with incoming and outgoing links. With Linking API, you can open a url through the default browser of the device. You just need to invoke … Read more

How to Limit Maximum Number of Characters in React Native TextInput

Sometimes you don’t want the user to input many characters through React Native TextInput component. Fortunately, react native TextInput has a prop to limit the characters the user enter. The maxLength prop of TextInput limits the number of characters that can be entered. You can use it as given in the code given below: As … Read more

How to do API calls in React Native with Axios

You can consume APIs in react native using Axios library. You can use either Axios or Fetch api to fetch data from third party APIs. In this example, I am using Axios to call APIs. In the example below, I am using free coindesk API which gives Bitcoin price in different currencies. The API link … Read more

How to Reload Android Emulator for React Native Development

While developing react native apps for Android platform, you always want to use Android emulator. In order to reload the Android simulator just press R twice ad you can see the app reload instantly. If you want to see developer options of react native in Android emulator then you just need to press ctrl + … Read more

How to Take Screenshot from Android Emulator without Opening Android Studio

Yes, you can take a screenshot from Android emulator even without opening Android Studio. First of all, run your Android emulator. If you want to know how to run Android emulator without opening Android Studio then check out this blogpost. In order to take screenshot, you just need to press ctrl + s together and … Read more

How to Launch Android Emulator from Command Line

Opening Android Studio every time you want to launch emulator is not an easy task in case of having a slow PC. Android Studio consumes RAM and opening Android Studio might make your PC slow. I assume you have already created virtual device with AVD using Android Studio. Then in order to launch Android emulator, … Read more

config.h file not found React Native Issue Fix

While running my React Native project with react-native run-ios, I faced a new react native error. In the terminal it was showing: An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=2): Failed to install the requested application An application bundle was not found at the provided path. Provide a valid path to the desired application … Read more

How to add Line Break in React Native Text Component

In Html, you can easily put a line break with tag <br> but the thing is different for React Native. In React Native you have to use \n in between your text to get a line break. As react native uses JSX, you have to ensure that \n is wrapped with brace brackets, like {“\n”}. … Read more

How to Check undefined Property in React Native

Sometimes, you may want to check if a value is undefined or not in react native. The usual scenario you face undefined property is while iterating through a JavaScript object with invalid keys. This blog post helps you to check if a JavaScript object property is undefined or not. In JavaScript you can make use … Read more

How to Add Apostrophe ‘ in Text in React Native

Having apostrophe or literals such as ‘, “, or > in your Text component value could break your code. Thus when you need to add such characters replace them as given in the list below: > can be replaced with &gt; ” can be replaced with &quot;, &ldquo;, &#34; or &rdquo; ‘ can be replaced with &apos;, &lsquo;, &#39; or &rsquo; } can be replaced with &#125; For example, if you … Read more

How to Solve Name Conflict While Importing Two Modules with Same Name in React Native

The name conflict may occur in react native when you import components from react native as well as from any other third party libraries with same name. Just have a look at the snippet given below: As you notice, we have imported two Text components, one from react native and other from react native svg. … Read more

How to Make White StatusBar with Content Shown in React Native

React Native provides StatusBar component to control your app status bar. You can easily create a white color StatusBar with the following snippet: Yes, there’s a problem with the above snippet, the whole status bar turns to white and you can’t see the content such as signal, battery etc. In such cases, you can use … Read more

How to Make a Round Image in React Native [iOS and Android]

Sometimes you may want to show an image in round shape your React Native app. Usually, we show images such as profile images in round shape. Making round images in Android and iOS are bit different. In Android, you just need to style your image by giving same value to height, width and borderRadius. In … Read more