loading...

React Native Full Page Width Swipeable Horizontal ScrollView

skptricks profile image skptricks ・1 min read

Source : React Native Full Page Width Swipeable Horizontal ScrollView

This tutorial explains how to create react native full page width swipeable horizontal scrollView layout for android or ios device. In this example we have created simple swipeable horizontal view and when you can perform swipe left and right operation in your android or iOS device using below code, then you will find below observation:

  1. when user swipe left in the device, then it will navigate user to next page or view.
  2. when user swipe right in the device, then it will navigate user to previous page or view.

Basically, react native ScrollView component provides a very special property named as pagingEnabled = { boolean } , in which Boolean can have one of two values either true or false . pagingEnabled allows you to stop at every single view during scrolling.

React Native Full Page Width Swipeable Horizontal ScrollView

Click here to read more

Posted on May 13 '19 by:

skptricks profile

skptricks

@skptricks

Welcome to skptricks, I have written and developed this site so that Learner may learn computer science related technologies and various programming ...

Discussion

markdown guide
 

What if I dont want it to be 100%? I want my app shows 70% of active content, and the 30% is the preview for the next content. I tried using pagingEnabled but the second page is showing 40% of second content and 60% of third content. What if I want to show second page behave like the first page (70% - 30%)