feat: add gestureVelocityImpact as a prop for stack (#123)

react-navigation · Oct 5, 2019 · 8294efc · 8294efc
1 parent a27ade8
commit 8294efc
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 3 deletions.
diff --git a/packages/stack/src/views/Stack/Card.tsx b/packages/stack/src/views/Stack/Card.tsx
@@ -55,6 +55,7 @@ type Props = ViewProps & {
     close: TransitionSpec;
   };
   styleInterpolator: StackCardStyleInterpolator;
+  gestureVelocityImpact: number;
   containerStyle?: StyleProp<ViewStyle>;
   contentStyle?: StyleProp<ViewStyle>;
 };
@@ -88,7 +89,7 @@ const MINUS_ONE_NODE = UNSET_NODE;
 const DIRECTION_VERTICAL = -1;
 const DIRECTION_HORIZONTAL = 1;
 
-const SWIPE_VELOCITY_IMPACT = 0.3;
+const GESTURE_VELOCITY_IMPACT = 0.3;
 
 /**
  * The distance of touch start from the edge of the screen where the gesture will be recognized
@@ -230,10 +231,16 @@ export default class Card extends React.Component<Props> {
     overlayEnabled: Platform.OS !== 'ios',
     shadowEnabled: true,
     gestureEnabled: true,
+    gestureVelocityImpact: GESTURE_VELOCITY_IMPACT,
   };
 
   componentDidUpdate(prevProps: Props) {
-    const { layout, gestureDirection, closing } = this.props;
+    const {
+      layout,
+      gestureDirection,
+      closing,
+      gestureVelocityImpact,
+    } = this.props;
     const { width, height } = layout;
 
     if (width !== prevProps.layout.width) {
@@ -244,6 +251,10 @@ export default class Card extends React.Component<Props> {
       this.layout.height.setValue(height);
     }
 
+    if (gestureVelocityImpact !== prevProps.gestureVelocityImpact) {
+      this.gestureVelocityImpact.setValue(gestureVelocityImpact);
+    }
+
     if (gestureDirection !== prevProps.gestureDirection) {
       this.direction.setValue(
         gestureDirection === 'vertical'
@@ -279,6 +290,9 @@ export default class Card extends React.Component<Props> {
   }
 
   private isVisible = new Value<Binary>(TRUE);
+  private gestureVelocityImpact = new Value<number>(
+    this.props.gestureVelocityImpact
+  );
   private isVisibleValue: Binary = TRUE;
   private nextIsVisible = new Value<Binary | -1>(UNSET);
 
@@ -474,7 +488,7 @@ export default class Card extends React.Component<Props> {
 
   private extrapolatedPosition = add(
     this.gesture,
-    multiply(this.velocity, SWIPE_VELOCITY_IMPACT)
+    multiply(this.velocity, this.gestureVelocityImpact)
   );
 
   private exec = [

diff --git a/packages/stack/src/views/Stack/StackItem.tsx b/packages/stack/src/views/Stack/StackItem.tsx
@@ -55,6 +55,7 @@ type Props = TransitionPreset & {
   headerTransparent?: boolean;
   floatingHeaderHeight: number;
   hasCustomHeader: boolean;
+  gestureVelocityImpact?: number;
 };
 
 export default class StackItem extends React.PureComponent<Props> {
@@ -122,6 +123,7 @@ export default class StackItem extends React.PureComponent<Props> {
       transitionSpec,
       cardStyleInterpolator,
       headerStyleInterpolator,
+      gestureVelocityImpact,
     } = this.props;
 
     return (
@@ -156,6 +158,7 @@ export default class StackItem extends React.PureComponent<Props> {
         }
         contentStyle={cardStyle}
         style={StyleSheet.absoluteFill}
+        gestureVelocityImpact={gestureVelocityImpact}
       >
         <View style={styles.container}>
           <View style={styles.scene}>