Merge pull request #405 from teslamotors/feature/orientation-ios

Added onOrientationChange callback

README.md

@@ -146,6 +146,7 @@ import { Camera, CameraType } from 'react-native-camera-kit';
 | `resetFocusWhenMotionDetected` | Boolean                 | iOS only. Dismiss tap to focus when focus area content changes. Native iOS feature, see documentation: https://developer.apple.com/documentation/avfoundation/avcapturedevice/1624644-subjectareachangemonitoringenabl?language=objc). Default `true`.                                                                                        |
 | `saveToCameraRoll`             | Boolean                 | Using the camera roll is slower than using regular files stored in your app. On an iPhone X in debug mode, on a real phone, we measured around 100-150ms processing time to save to the camera roll. _<span style="color: red">**Note:**</span> This only work on real devices. It will hang indefinitly on simulators._                      |
 | `saveToCameraRollWithPhUrl`    | Boolean                 | iOS only. If true, speeds up photo taking by about 5-50ms (measured on iPhone X) by only returning a [rn-cameraroll-compatible](https://github.com/react-native-community/react-native-cameraroll/blob/a09af08f0a46a98b29f6ad470e59d3dc627864a2/ios/RNCAssetsLibraryRequestHandler.m#L36) `ph://..` URL instead of a regular `file://..` URL. |  |
+| `onOrientationChange`          | Function                | Callback when physical device orientation changes. Returned event contains `orientation`. Ex: `onOrientationChange={(event) => console.log(event.nativeEvent.orientation)}`. Use `import { Orientation } from 'react-native-camera-kit'; if (event.nativeEvent.orientation === Orientation.PORTRAIT) { ... }` to understand the new value |
 
 ### Barcode Props (Optional)
 

ios/ReactNativeCameraKit/CKCamera.m

@@ -116,6 +116,7 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
 @property (nonatomic) CKCameraZoomMode zoomMode;
 @property (nonatomic, strong) NSString* ratioOverlay;
 @property (nonatomic, strong) UIColor *ratioOverlayColor;
+@property (nonatomic, strong) RCTDirectEventBlock onOrientationChange;
 
 @property (nonatomic) BOOL isAddedOberver;
 
@@ -151,7 +152,7 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
 
 - (void)removeFromSuperview
 {
-
+    [[NSNotificationCenter defaultCenter] removeObserver:self name:UIDeviceOrientationDidChangeNotification object:[UIDevice currentDevice]];
     dispatch_async( self.sessionQueue, ^{
         if ( self.setupResult == CKSetupResultSuccess ) {
             [self.session stopRunning];
@@ -169,6 +170,13 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
         // Create the AVCaptureSession.
         self.session = [[AVCaptureSession alloc] init];
 
+        // Listen to orientation changes
+        [[UIDevice currentDevice] beginGeneratingDeviceOrientationNotifications];
+        [[NSNotificationCenter defaultCenter]
+         addObserver:self selector:@selector(orientationChanged:)
+         name:UIDeviceOrientationDidChangeNotification
+         object:[UIDevice currentDevice]];
+
         // Fit camera preview inside of viewport
         self.session.sessionPreset = AVCaptureSessionPresetPhoto;
 
@@ -301,7 +309,31 @@ RCT_ENUM_CONVERTER(CKCameraZoomMode, (@{
     }
 }
 
--(void)setupCaptureSession {
+- (void) orientationChanged:(NSNotification *)notification
+{
+    if (!self.onOrientationChange) {
+        return;
+    }
+
+    // PORTRAIT: 0, // ⬆️
+    // LANDSCAPE_LEFT: 1, // ⬅️
+    // PORTRAIT_UPSIDE_DOWN: 2, // ⬇️
+    // LANDSCAPE_RIGHT: 3, // ➡️
+    
+    UIDevice * device = notification.object;
+    UIDeviceOrientation orientation = device.orientation;
+    if (orientation == UIDeviceOrientationPortrait) {
+        self.onOrientationChange(@{@"orientation": @0});
+    } else if (orientation == UIDeviceOrientationLandscapeLeft) {
+        self.onOrientationChange(@{@"orientation": @1});
+    } else if (orientation ==  UIDeviceOrientationPortraitUpsideDown) {
+        self.onOrientationChange(@{@"orientation": @2});
+    } else if (orientation == UIDeviceOrientationLandscapeRight) {
+        self.onOrientationChange(@{@"orientation": @3});
+    }
+}
+
+- (void) setupCaptureSession {
     // Setup the capture session.
     // In general it is not safe to mutate an AVCaptureSession or any of its inputs, outputs, or connections from multiple threads at the same time.
     // Why not do all of this on the main queue?

ios/ReactNativeCameraKit/CKCameraManager.m

@@ -26,6 +26,7 @@ RCT_EXPORT_VIEW_PROPERTY(ratioOverlay, NSString)
 RCT_EXPORT_VIEW_PROPERTY(ratioOverlayColor, UIColor)
 
 RCT_EXPORT_VIEW_PROPERTY(onReadCode, RCTDirectEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onOrientationChange, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(showFrame, BOOL)
 RCT_EXPORT_VIEW_PROPERTY(laserColor, UIColor)
 RCT_EXPORT_VIEW_PROPERTY(frameColor, UIColor)

src/Camera.android.tsx

@@ -34,8 +34,4 @@ const Camera = React.forwardRef((props, ref) => {
     />);
 });
 
-const { PORTRAIT, PORTRAIT_UPSIDE_DOWN, LANDSCAPE_LEFT, LANDSCAPE_RIGHT } = RNCameraKitModule.getConstants();
-
-export { PORTRAIT, PORTRAIT_UPSIDE_DOWN, LANDSCAPE_LEFT, LANDSCAPE_RIGHT };
-
 export default Camera;

src/index.ts

@@ -5,6 +5,14 @@ import CameraScreen, { CameraType } from './CameraScreen';
 
 const { CameraKit } = NativeModules;
 
+// Start with portrait/pointing up, increment while moving counter-clockwise
+export const Orientation = {
+  PORTRAIT: 0, // ⬆️
+  LANDSCAPE_LEFT: 1, // ⬅️
+  PORTRAIT_UPSIDE_DOWN: 2, // ⬇️
+  LANDSCAPE_RIGHT: 3, // ➡️
+};
+
 export default CameraKit;
 
 export { Camera, CameraScreen, CameraType };