Skip to content

Commit 68213b8

Browse files
committed
Make thresholds configurable through props
1 parent 2306eea commit 68213b8

File tree

2 files changed

+11
-4
lines changed

2 files changed

+11
-4
lines changed

README.md

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,8 +36,9 @@ var ViewPager = require('react-native-viewpager');
3636
* **`isLoop`**: `true` to run in infinite scroll mode,
3737
* **`locked`**: `true` to disable touch scroll,
3838
* **`onChangePage`**: page change callback,
39-
* **`renderPageIndicator`**: render custom ViewPager indicator.
40-
* **`initialPage`**: show initially some other page than first page.
39+
* **`renderPageIndicator`**: render custom ViewPager indicator,
40+
* **`distanceThreshold`**: the relative screen distance at which a transition is triggered (from 0 to 1),
41+
* **`velocityThreshold`**: the velocity at which a transition is triggered (see [gestureState.vx](https://facebook.github.io/react-native/docs/panresponder.html)).
4142

4243
## Page Transition Animation Controls
4344

ViewPager.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,8 @@ var ViewPager = React.createClass({
4242
autoPlay: PropTypes.bool,
4343
animation: PropTypes.func,
4444
initialPage: PropTypes.number,
45+
distanceThreshold: PropTypes.number,
46+
velocityThreshold: PropTypes.number,
4547
},
4648

4749
fling: false,
@@ -50,6 +52,8 @@ var ViewPager = React.createClass({
5052
return {
5153
isLoop: false,
5254
locked: false,
55+
distanceThreshold: 0.5,
56+
velocityThreshold: 1e-6,
5357
animation: function(animate, toValue, gs) {
5458
return Animated.spring(animate,
5559
{
@@ -78,9 +82,11 @@ var ViewPager = React.createClass({
7882
vx = gestureState.vx;
7983

8084
var step = 0;
81-
if (relativeGestureDistance < -0.5 || (relativeGestureDistance < 0 && vx <= -1e-6)) {
85+
if (relativeGestureDistance < -this.props.distanceThreshold
86+
|| (relativeGestureDistance < 0 && vx <= -this.props.velocityThreshold)) {
8287
step = 1;
83-
} else if (relativeGestureDistance > 0.5 || (relativeGestureDistance > 0 && vx >= 1e-6)) {
88+
} else if (relativeGestureDistance > this.props.distanceThreshold
89+
|| (relativeGestureDistance > 0 && vx >= this.props.velocityThreshold)) {
8490
step = -1;
8591
}
8692

0 commit comments

Comments
 (0)