React Native SafeAreaView for Safe Area Boundaries

In this post, you will see the React Native SafeAreaView for Safe Area Boundaries. According to the definition, a SafeAreaView renders nested content and automatically applies paddings to reflect the portion of the view that is not covered by navigation bars, tab bars, toolbars, and other ancestor views. For those who have no idea about … Read moreReact Native SafeAreaView for Safe Area Boundaries

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

Load Different Style Sheet Dynamically on the Component in React Native

This is an Example to Load Different Style Sheet Dynamically on the Component in React Native. To do this we will use a conditional operator and state. When we change the state view will re-render itself and after checking the state we will change the style of the component. In this example, we are using Text … Read moreLoad Different Style Sheet Dynamically on the Component in React Native

Example to Convert Text to Upper or Lower Case in React Native

This is an Example to Convert Text to Upper or Lower Case in React Native. To do this we will use the string property toUpperCase() and toLowerCase() which will convert your text to Upper case and lower case respectively. Convert Text to Upper Case Using

Convert Text to Lower Case Using

Let’s get started with … Read moreExample to Convert Text to Upper or Lower Case in React Native

React Native Underline Text

In this Example of React Native Underline Text, we will see how can you underline the Text using the Stylesheet property textDecorationLine. To Underline the Text use

In this example, we will use a style element textDecorationLine: ‘Underline’ and will apply to the Text so that we can underline the Text. So let’s get started. Open App.js … Read moreReact Native Underline Text

React Native Strikethrough Text

In this Example of React Native Strikethrough Text, we will see how can you strick through the Text using the Stylesheet property textDecorationLine. To Strike Through the Text use

In this example, we will use a style element textDecorationLine: ‘line-through’ and will apply to the Text so that we can get a Strike Through Text. So let’s … Read moreReact Native Strikethrough Text

React Native Blinking Animation

This is an Example of React Native Blinking Animation. Example contains : Making a CustomBlinkingTxt with blinking animation. Use CustomBlinkingTxt in our App Class. Pass the text using props. Open App.js in any code editor and replace the code with the following code. App.js

IOS       Android       That was the React … Read moreReact Native Blinking Animation

React Native Show SuperScript and SubScript

React Native SuperScript SubScript is a React Native Version of tags available in HTML known as <sup> superscript and <sub> subscript. Superscript tag sets the half of character above on the text writing line like (10am) and same as but in a different manner the Subscript tag is opposite of superscript, In subscript tag, the next character would be half down to … Read moreReact Native Show SuperScript and SubScript

React Native NetInfo

Here is an example of React Native NetInfo. React Native NetInfo exposes information about online/offline status. NetInfo notifies continuously about the network state whether it is online or offline. Information about the net connection is very helpful when you are making an application which only works in online mode. The best example that you have … Read moreReact Native NetInfo

AsyncStorage in React Native to Store Data in Session

This is an Example to Store Data in Session Using AsyncStorage in React Native. React Native AsyncStorage can be used to manage sessions. If you want the user to log in once and don’t want to log in again when the user opens the app after some time then, you have to store any variable in … Read moreAsyncStorage in React Native to Store Data in Session