Implement getNativeScrollRef (#776)

* Implement `getNativeScrollRef`

* Update type

* Update types again

---------

Co-authored-by: ananyachandra14 <[email protected]>

src/core/RecyclerListView.tsx

@@ -41,7 +41,7 @@ import { ComponentCompat } from "../utils/ComponentCompat";
 import ScrollComponent from "../platform/reactnative/scrollcomponent/ScrollComponent";
 import ViewRenderer from "../platform/reactnative/viewrenderer/ViewRenderer";
 import { DefaultJSItemAnimator as DefaultItemAnimator } from "../platform/reactnative/itemanimators/defaultjsanimator/DefaultJSItemAnimator";
-import { Platform } from "react-native";
+import { Platform, ScrollView } from "react-native";
 const IS_WEB = !Platform || Platform.OS === "web";
 //#endif
 
@@ -54,6 +54,7 @@ const IS_WEB = !Platform || Platform.OS === "web";
 //import ViewRenderer from "../platform/web/viewrenderer/ViewRenderer";
 //import { DefaultWebItemAnimator as DefaultItemAnimator } from "../platform/web/itemanimators/DefaultWebItemAnimator";
 //const IS_WEB = true;
+//type ScrollView = unknown;
 //#endif
 
 /***
@@ -394,6 +395,13 @@ export default class RecyclerListView<P extends RecyclerListViewProps, S extends
         return null;
     }
 
+    public getNativeScrollRef(): ScrollView | null {
+        if (this._scrollComponent && this._scrollComponent.getNativeScrollRef) {
+          return this._scrollComponent.getNativeScrollRef();
+        }
+        return null;
+    }
+
     public renderCompat(): JSX.Element {
         //TODO:Talha
         // const {

src/core/scrollcomponent/BaseScrollComponent.tsx

@@ -1,4 +1,5 @@
 import * as React from "react";
+import { ScrollView } from "react-native";
 import { Dimension } from "../dependencies/LayoutProvider";
 import BaseScrollView, { ScrollEvent, ScrollViewDefaultProps } from "./BaseScrollView";
 
@@ -25,4 +26,9 @@ export default abstract class BaseScrollComponent extends React.Component<Scroll
     public getScrollableNode(): number | null {
         return null;
     }
+
+    //Override and return ref to your custom scrollview. Useful if you need to use Animated Events on the new architecture.
+    public getNativeScrollRef(): ScrollView | null {
+        return null;
+    }
 }

src/platform/reactnative/scrollcomponent/ScrollComponent.tsx

@@ -50,6 +50,10 @@ export default class ScrollComponent extends BaseScrollComponent {
         return null;
     }
 
+    public getNativeScrollRef(): ScrollView | null {
+        return this._scrollViewRef;
+    }
+
     public render(): JSX.Element {
         const Scroller = TSCast.cast<ScrollView>(this.props.externalScrollView); //TSI
         const renderContentContainer = this.props.renderContentContainer ? this.props.renderContentContainer : this._defaultContainer;