A react-native component for android that mimics the react-native iOS ScrollView.

• android: ZOOM and SCROLL content easily (isn't supported by the react-native ScrollView).
• iOS: exports the react-native ScrollView (does nothing!)

Refer to the react-native ScrollView documentation.

npm install --save @shaman123/react-native-scroll-view

OR

yarn add @shaman123/react-native-scroll-view

edit your project's tsconfig.json:

{
    //...
    
    "paths": {
      //...
      "@shaman123/react-native-scroll-view": [ "node_modules/@shaman123/react-native-scroll-view/index.d.ts" ]
    }
}

import ScrollView from '@shaman123/react-native-scroll-view';

<ScrollView
  ref={ref => this.ref = ref}
  minimumZoomScale={0.75}
  maximumZoomScale={3}
  zoomScale={1.5}
>
  {...contentToRender}
</ScrollView>

zoomToRect() {
  this.ref.getScrollResponder().scrollResponderZoomTo({ x: 0, y: 0, width: 100, height: 100});
}

setOverScroll() {
  this.ref.getScrollResponder()
    .scrollResponderScrollNativeHandleToKeyboard(React.findNodeHandle(this.ref), 100);
}

Use these events to track touches: onTouchStart, onTouchMove, onTouchEnd.

IMPORTANT: When using [ScrollEvent: onMomentumScrollBegin, onMomentumScrollEnd, onScroll, onScrollBeginDrag, onScrollEndDrag](e) => void the property e.nativeEvent.velocity is not yet available, defaulting to { x: 0, y: 0 }

Use onStartShouldSetResponder, onStartShouldSetResponderCapture, onMoveShouldSetResponder, onMoveShouldSetResponderCapture to customize the ScrollView's behavior.

Gesture Responder System documentation