Merge pull request #670 from shoutem/release/4.7.0

Release/4.7.0

components/ScrollView/ScrollDriverProvider.js

@@ -22,6 +22,11 @@ export class ScrollDriverProvider extends PureComponent {
   static propTypes = {
     children: PropTypes.node,
     driver: DriverShape,
+    // Used to propagate animation driver changes to components who aren't
+    // children of ScrollDriver, recieves driver as argument.
+    // TODO: Rewrite for new context API.
+    onAnimationDriverChange: PropTypes.func,
+    onScroll: PropTypes.func,
   };
 
   constructor(props, context) {
@@ -42,19 +47,34 @@ export class ScrollDriverProvider extends PureComponent {
   }
 
   setupAnimationDriver(props, context) {
+    const { onAnimationDriverChange } = this.props;
+
     if (props.driver) {
       this.animationDriver = props.driver;
     } else if (context.driverProvider) {
       this.animationDriver = context.animationDriver;
     } else if (!this.animationDriver) {
-      this.animationDriver = new ScrollDriver({ useNativeDriver: true });
+      this.animationDriver = new ScrollDriver(
+        { useNativeDriver: true, nativeScrollEventThrottle: 20 },
+        props.onScroll,
+      );
+    }
+
+    if (onAnimationDriverChange) {
+      onAnimationDriverChange(this.animationDriver);
     }
   }
 
   setAnimationDriver(driver, primaryScrollView) {
     if (driver || !this.animationDriver || primaryScrollView) {
-      _.assign(this.animationDriver, driver);
+      const { onAnimationDriverChange } = this.props;
       const { driverProvider } = this.context;
+
+      _.assign(this.animationDriver, driver);
+      if (onAnimationDriverChange) {
+        onAnimationDriverChange(driver);
+      }
+
       if (driverProvider) {
         driverProvider.setAnimationDriver(driver, primaryScrollView);
       }

components/ScrollView/ScrollView.js

@@ -14,6 +14,7 @@ const IPHONE_X_HOME_INDICATOR_PADDING = isTabBarOnScreen ? 0 : 34;
 class ScrollView extends PureComponent {
   static propTypes = {
     ...Animated.ScrollView.propTypes,
+    primary: PropTypes.bool,
   };
 
   static contextTypes = {
@@ -33,7 +34,11 @@ class ScrollView extends PureComponent {
     autoBindReact(this);
 
     this.animationDriver =
-      props.driver || new ScrollDriver({ useNativeDriver: true });
+      props.driver ||
+      new ScrollDriver(
+        { useNativeDriver: true, nativeScrollEventThrottle: 20 },
+        props.onScroll,
+      );
   }
 
   getChildContext() {
@@ -53,12 +58,9 @@ class ScrollView extends PureComponent {
 
   componentDidUpdate() {
     const { driver } = this.props;
-    const { animationDriver } = this.context;
 
     if (driver && this.animationDriver !== driver) {
       this.animationDriver = driver;
-    } else if (animationDriver && this.animationDriver !== animationDriver) {
-      this.animationDriver = animationDriver;
     }
   }
 
@@ -92,7 +94,7 @@ class ScrollView extends PureComponent {
         ref={this.setWrappedInstance}
         contentContainerStyle={this.addIphoneXPadding(contentContainerStyle)}
         {...animationDriver.scrollViewProps}
-        {...props}
+        {..._.omit(props, 'onScroll')}
       />
     );
   }

helpers/device-selector.js

@@ -1,4 +1,5 @@
 import { Platform, Dimensions } from 'react-native';
+import { hasNotch } from 'react-native-device-info';
 import _ from 'lodash';
 import {
   IPHONE_X_LONG_SIDE,
@@ -30,6 +31,8 @@ const isIphoneXR =
   !isTVOS &&
   (xrDimensionsMatch || twelveDimensionsMatch || twelveMaxDimensionsMatch);
 
+const isNotchedAndroid = OS === 'android' && hasNotch();
+
 /**
  * Receives settings for different devices
  * If the device is recognized, it returns only settings for that device
@@ -48,11 +51,16 @@ function select(settings) {
     return settings.iPhoneXR;
   }
 
+  if (settings.notchedAndroid && isNotchedAndroid) {
+    return settings.notchedAndroid;
+  }
+
   return _.get(settings, 'default');
 }
 
 export const Device = {
   isIphoneX,
   isIphoneXR,
+  isNotchedAndroid,
   select,
 };

helpers/keyboard.js

@@ -1,5 +1,4 @@
-import { Platform } from 'react-native';
-import { getStatusBarHeight } from 'react-native-status-bar-height';
+import { Platform, StatusBar } from 'react-native';
 import { NAVIGATION_BAR_HEIGHT } from '../theme';
 
 export function calculateKeyboardOffset(extraOffset = 0) {
@@ -9,7 +8,7 @@ export function calculateKeyboardOffset(extraOffset = 0) {
     return resolvedOffset;
   }
 
-  return getStatusBarHeight() + resolvedOffset;
+  return StatusBar.currentHeight + resolvedOffset;
 }
 
 export default { calculateKeyboardOffset };