Image icon in activity action bar is used to mostly display user image while creating a social chatting application in react native. We are using many social apps like Whats’App and Hike and all of them usages this feature. When we open our friends profile then it will show us his picture at the top […]
The Realm mobile database specially build for React Native applications is launched on Feb 2016 and since its been upgraded to version 2.2.0 at current date of March 2, 2018 . Realm supports object persistence and full query capabilities, It is faster then SQLite and used by most of Android and iOS react native applications. […]
Both android and iOS devices has 2 different orientation mode means the application area can be changeable in 2 different shapes. The Portrait mode is default mode in mobile phone and the Landscape mode is the 2nd mode in which screen will rotate 90°. By default we can manage both orientations from mobile phone setting […]
Every mobile phone device in the world has its unique ID(Identify Signature) which makes with the combination of Alphabetic and Numeric characters. Unique device ID is used in Push Notification, identify a device uniquely at login app and most of money making app’s usages this to prevent multiple app installation in same device. Both android […]
ListView supports advanced features which included both Header and Footer. Header is shows just above the first item of ListView, it is a type of View block area used to show a message like ListView title. Footer display below the ListView or call on when ListView data items reached to its end, its also a […]
Image Gallery also known as Photo Album is used to show multiple images on user’s screen with Tap to open feature. Image Gallery is a layout on your application where you can see all the application images at a single place and you can open them by tapping. We are using the FlatList in this […]
StackNavigator’s default Title Text Color is chilled black but some times user required to change it according to its need. Using the headerTintColor: ‘ ‘ style’s property of navigationOptions we can set the ActionBar’s inside Text color. So in this tutorial we would going to set Change Activity Action Bar Title Text Color in StackNavigator in react native […]
In our previous tutorial we have discussed about showing Place Holder text inside TextInput, Now this tutorial is the extend part of Place Holder tutorial. PlaceHolder Text Color can be modified using placeholderTextColor = “” prop, This prop would allow us to set Change TextInput PlaceHolder Text Color for both Android and iOS react native applications. […]
There are basically 3 types of looping technologies present in JavaScript to execute a code multiple times with some changes the the loop is best way. In react native we use map() looping function instead of For loop, while loop and do while loop. Map is a JavaScript function used for looping control statements. So in […]
The PlaceHolder prop is used to show some user define default text inside TextInput component. This text can be anything with a specific message which tells the application user regarding to that particular TextInput. Using the PlaceHolder user knows what type of value(information) he needs to fill inside Text Input component. So in this tutorial we would […]
Horizontal progress bar is used to show progress within a fix block with auto filled functionality. Horizontal ProgressBar is mostly used to show downloading progress and uploading progress in react native applications. In react native Both android and iOS devices supports different type of components to display Horizontal ProgressBar. ProgressBarAndroid is used in android devices to […]
Every activity in react native has its own static navigationOptions method used to style the header of Title Bar. This method has many sub properties and one of them is headerStyle{} used to set background color of Action Bar header. The headerStyle{} has a property named as backgroundColor used to Change Activity Actionbar Header Background Color in Android iOS Example […]
The default image also known as Image PlaceHolder is used to Show Default Image Before loading Real Image from server using HTTP URL. This image is like a default image thumbnail with some normal image so user will know the image is still in loading process. So in this tutorial we would going to Display Default […]
Tinder is one of the most famous locally people search application used to find partners near by you. Tinder has its unique set of CardViews structure used with Swipe Left and Swipe Right used to Send and Reject partner profiles. So in this tutorial we would going to Create Swipeable CardView like Tinder in iOS Android […]
Soft keypad is basic input medium in both android and iOS devices, because without its we cannot submit any input in android and iOS devices. The Soft keyboard will automatically show when user selects the TextInput component and hide after pressing the enter button on Keypad. But sometimes developer needs to Manually Hide Soft Keyboard on […]
React Native gives us pre build Alert dialog box to show alert messages on application screen but that Alert is old fashioned and dose not come with any modifications like adding images and customized layout. We can make our own Alert Dialog Box using Modal component, So in this tutorial we would going to Create Material […]
Views are the base of every react native application and without them we cannot make certain type of shapes and designs. View can be created programmatically at application run time on a certain event like button click. So in this tutorial we would going to Dynamically Add Render View Component on Button Click in Android […]
Card View is a View format consist with proper rounded edges with drop shadow effect known as Elevation in android application, but since react native came we can make card views in both android and iOS devices using react native. CardView is used to show information in a Card format with nice layout, it is […]
Pinch to zoom effect is one of the most popular image effect available in react native, Using this effect we can zoom the currently opened image in both android and iOS devices. There are many ways to do this type of functionality in react native by using Pan Responder and Gesture detector but they both […]
Flipping is a technique used to rotate a image horizontally without changing its shape and pixels, its like mirror effect in react native. Flipping is used in mostly photo editing applications which gives us the functionality to flip the image horizontally and vertically. You have seen in many mobile cameras when we capture the image […]
In our previous tutorial we have implement sticky header on FlatList but in this tutorial we would going Add Sticky Header to ListView for both android and iOS devices. ListView is the oldest component present in react native since its been developed so most of the peoples used ListView and faced a problem to place Sticky header […]
Round shape image component is mainly used in social chatting applications like Whats’app, Hike and Facebook in both Android and iOS applications. The rounded image can be achieve easily using Style’s borderRadius. We need to divide by 2 the total amount of width and height in borderRadius. So in this tutorial we would going to Create Round Shape […]
React Native comes with React and react has its own Application Life Cycle Methods which is used in React Native. The life cycle methods is the inbuilt function created by react native, These function will execute according to user requirement and execute at a particular steps of application. There are basically 4 types of methods available […]
The Infinite List is a type of ListView – FlatList used to show only fixed number of data on application startup time and user can himself Load More Data if required on Button Click event. The Infinite List can show hundreds of records without lagging and application hanging process because of its quick way process method. It […]
