accomodating content insets and content container padding in visible …

src/core/RecyclerListView.tsx

@@ -121,6 +121,7 @@ export default class RecyclerListView extends React.Component<RecyclerListViewPr
         initialRenderIndex: 0,
         isHorizontal: false,
         onEndReachedThreshold: 0,
+        distanceFromWindow: 0,
         renderAheadOffset: IS_WEB ? 1000 : 250,
     };
 
@@ -276,6 +277,10 @@ export default class RecyclerListView extends React.Component<RecyclerListViewPr
 
     public scrollToOffset(x: number, y: number, animate: boolean = false): void {
         if (this._scrollComponent) {
+            if (IS_WEB && this.props.useWindowScroll) {
+                x += this.props.distanceFromWindow!;
+                y += this.props.distanceFromWindow!;
+            }
             if (this.props.isHorizontal) {
                 y = 0;
             } else {
@@ -512,7 +517,9 @@ export default class RecyclerListView extends React.Component<RecyclerListViewPr
     }
 
     private _onScroll(offsetX: number, offsetY: number, rawEvent: ScrollEvent): void {
-        this._virtualRenderer.updateOffset(offsetX, offsetY);
+        //Adjusting offsets using distanceFromWindow
+        this._virtualRenderer.updateOffset(offsetX - this.props.distanceFromWindow!, offsetY - this.props.distanceFromWindow!);
+
         if (this.props.onScroll) {
             this.props.onScroll(rawEvent, offsetX, offsetY);
         }
@@ -594,7 +601,10 @@ RecyclerListView.propTypes = {
     //Specify if size can change, listview will automatically relayout items. For web, works only with useWindowScroll = true
     canChangeSize: PropTypes.bool,
 
-    //Web only. Specify how far away the first list item is from window top. This is an adjustment for better optimization.
+    //Specify how far away the first list item is from start of the RecyclerListView. e.g, if you have content padding on top or left.
+    //This is an adjustment for optimization and to make sure onVisibileIndexesChanged callback is correct.
+    //Ideally try to avoid setting large padding values on RLV content. If you have to please correct offsets reported, handle
+    //them in a custom ScrollView and pass it as an externalScrollView.
     distanceFromWindow: PropTypes.number,
 
     //Web only. Layout elements in window instead of a scrollable div.

src/core/scrollcomponent/BaseScrollComponent.tsx

@@ -12,7 +12,6 @@ export interface ScrollComponentProps {
     isHorizontal?: boolean;
     renderFooter?: () => JSX.Element | JSX.Element[] | null;
     scrollThrottle?: number;
-    distanceFromWindow?: number;
     useWindowScroll?: boolean;
     onLayout?: any;
 }

src/core/scrollcomponent/BaseScrollView.tsx

@@ -8,7 +8,6 @@ export interface ScrollViewDefaultProps {
     horizontal: boolean;
     canChangeSize: boolean;
     style?: CSSProperties | null;
-    distanceFromWindow: number;
     useWindowScroll: boolean;
 }
 export interface ScrollEvent {

src/platform/reactnative/scrollcomponent/ScrollComponent.tsx

@@ -54,7 +54,6 @@ export default class ScrollComponent extends BaseScrollComponent {
         //     contentWidth,
         //     externalScrollView,
         //     canChangeSize,
-        //     distanceFromWindow,
         //     renderFooter,
         //     isHorizontal,
         //     scrollThrottle,

src/platform/web/scrollcomponent/ScrollEventNormalizer.ts

@@ -3,7 +3,7 @@ import { ScrollEvent } from "../../../core/scrollcomponent/BaseScrollView";
 export class ScrollEventNormalizer {
     public divEvent: ScrollEvent;
     public windowEvent: ScrollEvent;
-    constructor(target: HTMLDivElement, distanceFromWindow: number) {
+    constructor(target: HTMLDivElement) {
         this.divEvent = {
             nativeEvent: {
                 contentOffset: {
@@ -36,10 +36,10 @@ export class ScrollEventNormalizer {
             nativeEvent: {
                 contentOffset: {
                     get x(): number {
-                        return window.scrollX - distanceFromWindow;
+                        return window.scrollX;
                     },
                     get y(): number {
-                        return window.scrollY - distanceFromWindow;
+                        return window.scrollY;
                     },
                 },
                 contentSize: {

src/platform/web/scrollcomponent/ScrollViewer.tsx

@@ -13,7 +13,6 @@ const scrollEndEventSimulator = debounce((executable: () => void) => {
 export default class ScrollViewer extends BaseScrollView {
     public static defaultProps = {
         canChangeSize: false,
-        distanceFromWindow: 0,
         horizontal: false,
         style: null,
         useWindowScroll: false,
@@ -46,14 +45,6 @@ export default class ScrollViewer extends BaseScrollView {
         }
     }
 
-    public componentWillReceiveProps(nextProps: ScrollViewDefaultProps): void {
-        if (this.props.distanceFromWindow !== nextProps.distanceFromWindow) {
-            if (this._mainDivRef) {
-                this._scrollEventNormalizer = new ScrollEventNormalizer(this._mainDivRef, nextProps.distanceFromWindow);
-            }
-        }
-    }
-
     public componentWillUnmount(): void {
         window.removeEventListener("scroll", this._windowOnScroll);
         if (this._mainDivRef) {
@@ -97,7 +88,7 @@ export default class ScrollViewer extends BaseScrollView {
     private _setDivRef(div: HTMLDivElement | null): void {
         this._mainDivRef = div;
         if (div) {
-            this._scrollEventNormalizer = new ScrollEventNormalizer(div, this.props.distanceFromWindow);
+            this._scrollEventNormalizer = new ScrollEventNormalizer(div);
         } else {
             this._scrollEventNormalizer = null;
         }
@@ -133,9 +124,9 @@ export default class ScrollViewer extends BaseScrollView {
             }
         } else {
             if (this.props.horizontal) {
-                window.scrollTo(offset + this.props.distanceFromWindow, 0);
+                window.scrollTo(offset, 0);
             } else {
-                window.scrollTo(0, offset + this.props.distanceFromWindow);
+                window.scrollTo(0, offset);
             }
         }
     }