Fixed marudy#21

examples/responsive-screen-orientation-change/App.js

@@ -10,11 +10,14 @@ import {
 
 export default class App extends React.Component {
   componentWillMount() {
-    listenOrientationChange(this);
+   // `listenOrientationChange` returns the handler method,
+   // consider store it to be pushed back when removing the listener.
+   this.orientationChangeHandler = listenOrientationChange(this);
   }
 
   componentWillUnMount() {
-    removeOrientationListener();
+    // Optionally path the original handler to be removed.
+    removeOrientationListener(this.orientationChangeHandler);
   }
 
   render() {

examples/responsive-screen-orientation-change/package.json

@@ -22,6 +22,6 @@
     "expo": "^27.0.1",
     "react": "16.3.1",
     "react-native": "~0.55.2",
-    "react-native-responsive-screen": "^1.1.2"
+    "react-native-responsive-screen": "file:./local-package/react-native-responsive-screen-1.3.0-preview.tgz"
   }
 }

index.d.ts

@@ -3,6 +3,6 @@ declare module 'react-native-responsive-screen' {
 
   export function widthPercentageToDP(widthPercent: string | number): number;
   export function heightPercentageToDP(widthPercent: string | number): number;
-  export function listenOrientationChange(screenClassComponent: Component<any, any>): void;
-  export function removeOrientationListener(): void;
+  export function listenOrientationChange(screenClassComponent: Component<any, any>): (newDimensions: any) => void;
+  export function removeOrientationListener(orientationChangeHandler?: any): void;
 }

index.js

@@ -47,16 +47,21 @@ const heightPercentageToDP = heightPercent => {
  *                      invoke setState method and trigger screen rerender (this.setState()).
  */
 const listenOrientationChange = that => {
-  Dimensions.addEventListener('change', newDimensions => {
+  const orientationChangeHandler = newDimensions => {
     // Retrieve and save new dimensions
     screenWidth = newDimensions.window.width;
     screenHeight = newDimensions.window.height;
-
+  
     // Trigger screen's rerender with a state update of the orientation variable
     that.setState({
       orientation: screenWidth < screenHeight ? 'portrait' : 'landscape'
     });
-  });
+  }
+
+  Dimensions.addEventListener('change', orientationChangeHandler);
+
+  // Save this somewhere to path it back when removing the listener.
+  return orientationChangeHandler;
 };
 
 /**
@@ -65,7 +70,11 @@ const listenOrientationChange = that => {
  * listenOrientationChange function has been invoked. This should be done in order to
  * avoid adding new listeners every time the same component is re-mounted.
  */
-const removeOrientationListener = () => {
+const removeOrientationListener = orientationChangeHandler => {
+  // Remove the original handler if possible, otherwise path an empty function.
+  if (orientationChangeHandler) {
+    return Dimensions.removeEventListener('change', orientationChangeHandler);
+  }
   Dimensions.removeEventListener('change', () => {});
 };