Get Device Orientation and Set Preferred Orientation in React Native

Hello guys, This is an Example to Get Device Orientation and Set Preferred Orientation in React Native. In this example we will see how can you control screen orientation and how can you get the rotation of the screen. Sometimes it becomes very much important to manage the orientation of the screen and if it … Read moreGet Device Orientation and Set Preferred Orientation in React Native

Load Local HTML File or URL in React Native using react-native-webview

Load Local HTML File or URL in React Native using react-native-webview is the updated and combined post of our last 2 posts Open any Website in React Native WebView and React Native Load Local HTML File in WebView. In this example, we will use the WebView component from react-native-webview. We will make a single page where we will have … Read moreLoad Local HTML File or URL in React Native using react-native-webview

Example of Expandable List View in React Native

This is an Example of Expandable List View in React Native. To make an Expandable List View we will create an Expandable Component with the help of stylesheet. Expandable list view is like a sectioned list view but with hidden section content. The heading of the list will always be visible and after clicking the heading you … Read moreExample of Expandable List View in React Native

Multi-Line Text / Break Text in React Native

In this Example of Multi-Line Text / Break Text in React Native, we will see how can you break the text of a Text Component in multiline using a new line character. So let’s get started. To Break the Text

Open App.js in any code editor and replace the code with the following code. App.js

This … Read moreMulti-Line Text / Break Text in React Native

React Navigation Header Customization in RN using Navigation Options

This is an example of React Navigation Header Customization in React Native using Navigation Options. In this example, we will see how to customize the Navigation Bar/ Navigation header. React Native does not provide any header by default, it comes when we add React Navigation to switch the activity. Sometimes we have to customize the … Read moreReact Navigation Header Customization in RN using Navigation Options

React Native Popup Menu – Over Flow Menu

React Native Popup Menu – Over Flow Menu is the most common thing that we can see in the Android applications. In the initial stage popup menu can be seen in the header only, but after the introduction of the material design popup menu can be seen in many places. You can use the popup … Read moreReact Native Popup Menu – Over Flow Menu

React Native Bottom Action Menu

This is an Example to make React Native Bottom Action Menu. To make Bottom Action Menu, we are going to use ActionSheet component from react-native-actionsheet library. This can be mostly seen by the IOS developers as it looks like default select option in IOS. With the help of Bottom Action Menu, you can provide the facility … Read moreReact Native Bottom Action Menu

Example of Animated Splash Screen in React Native

This is an Example of an Animated Splash Screen in React Native.  The splash screen is the first screen which appears in front of the user when they interact with your application so to make an impactful the impression you can create animated Splash Screen. This example contains the simple splash screen with some animation … Read moreExample of Animated Splash Screen in React Native

React Native Get Clicked Location of Touchscreen Using PanResponder

To get the clicked location of touchscreen React Native provides an easy to use the component called PanResponder. it is used to recognize the touch on both Android and iOS mobile phone screens. This example is for those who want to start the gaming applications development in React Native. To Import PanResponder in Code

Use … Read moreReact Native Get Clicked Location of Touchscreen Using PanResponder

Image Icon Inside the React Native Button

We always want to make our buttons as good as possible to provide the best UI experience. Everybody knows that the button is the most important thing in the mobile application as we require buttons on mostly each screen. So to start showing Image Icon Inside the React Native Button we are expecting you understand the Button … Read moreImage Icon Inside the React Native Button