Floating Action Button is used for a special type of sudden actions in android applications. But using react native mobile app development language we can Add Floating Action Button in Both Android iOS Applications. This is round type of Icon button floating above the application UI at the right bottom side of screen. So in […]
The style’s attribute textAlign: ‘center’ is used to Set Hint PlaceHolder Align Center Inside TextInput component and also it can centralize the TextInput inside typed text. So let’s get started 🙂 . Contents in this project Set Hint PlaceHolder Align Center Inside TextInput in React Native : 1. Import StyleSheet, View and TextInput component in […]
In our previous tutorial Simple Picker in React Native we have created Picker using static elements but this tutorial is the advanced part of that tutorial. Because in this tutorial we would going Create Picker Spinner Using Dynamic JSON Data coming from online MySQL database server in Android iOS react native app. All the Picker items […]
Procedure of selecting TextInput component is called as RequestFocus. When Android and iOS application user selects the TextInput for entering some value then it will automatically became high light this is because of RequestFocus. By default when react native app starts then there is no TextInput component will be focus but we can manually-dynamically focus any TextInput present […]
The Array object can be convertible into a single Var object using .toString() method and removes the double quotes( ” “) from array elements. So in this tutorial we would going to Convert Complete Array Object To Single String Variable. Contents in this project Convert Complete Array Object To Single String Variable in React Native : 1. […]
Array is used to store multiple values in a single object in react native. Array can hold infinite values(According to your requirement) in a single variable. So in this tutorial we would going to Create and Show Array Elements in Text component using MAP function. So let’s get started . Topics cover in this tutorial : […]
This tutorial is very important for react native beginners who wish to create calculator application. Because in this tutorial we would going to create a react native application which would find Calculate Square Cube and Square Root Cube Root of a given number inside TextInput on button click and show the result using Alert dialog. […]
React Native Picker also known as Spinner in android and iOS applications is used to show and pick a single value from a Set of Values. The Picker by default shows a single value and when user clicks on it it will pop up a dialog box window with multiple values. So in this tutorial […]
A Trapezoid is a combination of a pair of parallel sides and both angles coming from a parallel side are equal, and the sides that are not parallel are equal in length known as Trapezoid. So in this tutorial we would going to create a react native Android iOS app with Custom Trapezoid Shape View using CSS Style. […]
The isNaN() number function is used to check any given Variable or State for Number value. This is mostly used to set validation on any variable in react native app. So in this tutorial we would going to create a react native android iOS app in which we would get the TextInput value on button click […]
The String function .concat() gives us the functionality to merge two or multiple string into one string. So in this tutorial we would going to create a react native Android iOS app with Two different strings and we would Combine Two Strings into one string using the .concat() String function and show the merged text into […]
Sometimes developer needs to set restriction or limit to TextInput typed text so the user cannot enter more then defined limit text. So in this tutorial we would going to create a react native application that Count TextInput Inside Text Length Automatically and Show count in Text Component at application run time using .length string function. Note : […]
React native support comments, which is used to stop executing any line of code at compiling time in both Android and iOS react native applications. There are 2 types of comment syntax react native supports. 1. // ( Double Forward Slash ) : – Double Forward Slash is used to comment only single line in react native […]
The JavaScript’s inbuilt function Date().getDate() gives us the facility to retrieve Get Current Date With Month And Year in both android and iOS applications on button click. So in this tutorial we would going to get current date using Date().getDate() function, retrieve current month using Date().getMonth() function and current year using Date().getFullYear() function and display inside react native app […]
React Native supports multiple classes format like we used in other programming languages like Java, C++, PHP etc. So in this tutorial we would going to create a react native application with multiple(2) classes and Call Another Class Function From Default Class on button onPress event. Contents in this project Call Another Class Function From Default Class […]
textDecorationLine: ‘underline’ style property of Text component is used to create Underline Text in both Android and iOS react native application. So in this tutorial we would going to create react native app with Underline Text component. Contents in this project Create Underline Text In React Native : 1. Import AppRegistry, StyleSheet, View and Text component in your […]
By default both Android and iOS applications open the normal multi purpose keyboard with Alphabetic Keys, Numeric Keys and Special Symbol Keys. But when developer needs to exclusively get phone number or any other numeric value from user then this is must that only Numeric Keyboard opens on TextInput selection time, So user cannot enter […]
JavaScript and jQuery is the base of almost every web application(Websites) present on internet because of its flexible environment. But infrequently hacker or bad peoples needs to inject some bad code in user’s device using JavaScript, So here this features helps the android and iOS application user to stop executing JavaScript and jQuery on their webpage loaded inside WebView […]
Rendering raw HTML(Hyper Text Markup Language) code in both android and iOS application can be possible through WebView component. Because sometimes developer needs to parse Raw HTML Code come inside JSON into Text component. So in this tutorial we would going to Render Raw HTML Code in React Native App Using WebView component using source={{ html: YourHTMLcode}} prop. […]
Search Bar Filter is a real time filtering technique used in almost all Android and iOS applications to filter the JSON data in FlatList and ListView by typing text in TextInput component. It will filter the ListView according to user typed value and set the newly filter result again in ListView. So in this tutorial […]
TouchableOpacity has its Prop named as disabled={}, which is used to Enable and Disable the TouchableOpacity Button State. disabled={} prop support value in Boolean format . If we would set disabled={true} then it will automatically Disable the TouchableOpacity Button state and the button will no longer in work. If we would set the disabled={false} then it will Enable the TouchableOpacity […]
React Native gives us 2 types of button designing technique, First one is its own Button component, Second is Custom Button using TouchableOpacity. So in this tutorial we would going to Change custom TouchableOpacity Button Upper Title Text programmatically using State. What we are doing in this tutorial : We are creating 2 buttons in our tutorial, […]
The JavaScript inbuilt function Math.floor() and Math.random() function is used in this tutorial. The Math.floor() function is used to round the given number to its downward integer value. The Math.random() function is used to Generate Random Number to any range in Point Float value. So we would use both Math.floor() and Math.random() function together to generate random number between given range. User […]
Blur image effect also known as Gaussian Blur Smoothing Image Effect can create in react native application using blurRadius={} prop. This prop accepts value in Number format and permit us to reduce and change the Image Noise and make the image with blurry effect. So in this tutorial we would going to make a react native app […]
