add onScrollOffsetChange prop

Author: computerjazz

README.md

@@ -33,6 +33,7 @@ All props are spread onto underlying [FlatList](https://facebook.github.io/react
 | `animationConfig`       | `Partial<Animated.SpringConfig>`                                                          | Configure list animations. See [reanimated spring config](https://github.com/software-mansion/react-native-reanimated/blob/master/react-native-reanimated.d.ts#L112-L120)          |
 | `activationDistance`    | `number`                                                                                  | Distance a finger must travel before the gesture handler activates. Useful when using a draggable list within a TabNavigator so that the list does not capture navigator gestures. |
 | `layoutInvalidationKey` | `string`                                                                                  | Changing this value forces a remeasure of all item layouts. Useful if item size/ordering updates after initial mount.                                                              |
+| `onScrollOffsetChange`  | `(offset: number) => void`                                                                | Called with scroll offset. Stand-in for `onScroll`.                                                                                                                                |
 
 ## Example
 

src/index.tsx

@@ -108,6 +108,7 @@ type Props<T> = Modify<
     activationDistance?: number;
     debug?: boolean;
     layoutInvalidationKey?: string;
+    onScrollOffsetChange?: (scrollOffset: number) => void;
   } & Partial<DefaultProps>
 >;
 
@@ -859,7 +860,13 @@ class DraggableFlatList<T> extends React.Component<Props<T>, State> {
   };
 
   render() {
-    const { scrollEnabled, debug, horizontal, activationDistance } = this.props;
+    const {
+      scrollEnabled,
+      debug,
+      horizontal,
+      activationDistance,
+      onScrollOffsetChange
+    } = this.props;
     const { hoverComponent } = this.state;
     let dynamicProps = {};
     if (activationDistance) {
@@ -894,7 +901,6 @@ class DraggableFlatList<T> extends React.Component<Props<T>, State> {
             scrollEventThrottle={1}
           />
           {!!hoverComponent && this.renderHoverComponent()}
-          {debug && this.renderDebug()}
           <Animated.Code>
             {() =>
               block([
@@ -919,6 +925,19 @@ class DraggableFlatList<T> extends React.Component<Props<T>, State> {
               ])
             }
           </Animated.Code>
+          {onScrollOffsetChange && (
+            <Animated.Code>
+              {() =>
+                onChange(
+                  this.scrollOffset,
+                  call([this.scrollOffset], ([offset]) =>
+                    onScrollOffsetChange(offset)
+                  )
+                )
+              }
+            </Animated.Code>
+          )}
+          {debug && this.renderDebug()}
         </Animated.View>
       </PanGestureHandler>
     );