Add ability to switch cameras

Author: Michaël Villeneuve

Example/index.ios.js

@@ -21,6 +21,7 @@ export default class Example extends Component {
     this.state = {
       image: null,
       flashEnabled: false,
+      useFrontCam: false,
     };
   }
 
@@ -46,6 +47,7 @@ export default class Example extends Component {
             onPictureTaken={data => this.setState({ image: data.croppedImage })}
             overlayColor="rgba(255,130,0, 0.7)"
             enableTorch={this.state.flashEnabled}
+            useFrontCam={this.state.useFrontCam}
             brightness={0.2}
             saturation={0}
             quality={0.5}
@@ -69,9 +71,12 @@ export default class Example extends Component {
           </TouchableOpacity>
         }
 
-        <TouchableOpacity style={styles.flashEnabledButton} onPress={() => this.setState({ flashEnabled: !this.state.flashEnabled })}>
+        <TouchableOpacity style={[styles.button, styles.left]} onPress={() => this.setState({ flashEnabled: !this.state.flashEnabled })}>
           <Text>📸 Flash</Text>
         </TouchableOpacity>
+        <TouchableOpacity style={[styles.button, styles.right]} onPress={() => this.setState({ useFrontCam: !this.state.useFrontCam })}>
+          <Text>📸 Front Cam</Text>
+        </TouchableOpacity>
       </View>
     );
   }
@@ -89,7 +94,7 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center'
   },
-  flashEnabledButton: {
+  button: {
     position: 'absolute',
     alignItems: 'center',
     justifyContent: 'center',
@@ -100,6 +105,12 @@ const styles = StyleSheet.create({
     width: 120,
     backgroundColor: '#FFF',
   },
+  left: {
+    left: 20,
+  },
+  right: {
+    right: 20,
+  },
   welcome: {
     fontSize: 20,
     textAlign: 'center',

index.js

@@ -32,6 +32,7 @@ class PdfScanner extends React.Component {
         {...this.props}
         onPictureTaken={this.sendOnPictureTakenEvent.bind(this)}
         onRectangleDetect={this.sendOnRectanleDetectEvent.bind(this)}
+        useFrontCam={this.props.useFrontCam||false}
         brightness={this.props.brightness||0}
         saturation={this.props.saturation||1}
         contrast={this.props.contrast||1}
@@ -48,6 +49,7 @@ PdfScanner.propTypes = {
   onRectangleDetect: PropTypes.func,
   overlayColor: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   enableTorch: PropTypes.bool,
+  useFrontCam: PropTypes.bool,
   saturation: PropTypes.number,
   brightness: PropTypes.number,
   contrast: PropTypes.number,

ios/DocumentScannerView.m

@@ -6,19 +6,7 @@ @implementation DocumentScannerView
 - (instancetype)init {
     self = [super init];
     if (self) {
-        [self setupCameraView];
         [self setEnableBorderDetection:YES];
-
-
-        [self setOverlayColor: self.overlayColor];
-        [self setEnableTorch: self.enableTorch];
-
-        [self setContrast: self.contrast];
-        [self setBrightness: self.brightness];
-        [self setSaturation: self.saturation];
-
-
-        [self start];
         [self setDelegate: self];
     }
 

ios/IPDFCameraViewController.h

@@ -36,6 +36,7 @@ typedef NS_ENUM(NSInteger, IPDFRectangeType)
 
 @property (nonatomic,assign,getter=isBorderDetectionEnabled) BOOL enableBorderDetection;
 @property (nonatomic,assign,getter=isTorchEnabled) BOOL enableTorch;
+@property (nonatomic,assign,getter=isFrontCam) BOOL useFrontCam;
 
 @property (weak, nonatomic) id<IPDFCameraViewControllerDelegate> delegate;
 

ios/IPDFCameraViewController.m

@@ -91,8 +91,19 @@ - (void)setupCameraView
 {
     [self createGLKView];
 
-    NSArray *possibleDevices = [AVCaptureDevice devicesWithMediaType:AVMediaTypeVideo];
-    AVCaptureDevice *device = [possibleDevices firstObject];
+    AVCaptureDevice *device = nil;
+    NSArray *devices = [AVCaptureDevice devicesWithMediaType:AVMediaTypeVideo];
+    for (AVCaptureDevice *possibleDevice in devices) {
+        if (self.useFrontCam) {
+            if ([possibleDevice position] == AVCaptureDevicePositionFront) {
+                device = possibleDevice;
+            }
+        } else {
+            if ([possibleDevice position] != AVCaptureDevicePositionFront) {
+                device = possibleDevice;
+            }
+        }
+    }
     if (!device) return;
 
     _imageDedectionConfidence = 0.0;
@@ -265,6 +276,14 @@ - (void)setEnableTorch:(BOOL)enableTorch
     }
 }
 
+- (void)setUseFrontCam:(BOOL)useFrontCam
+{
+    _useFrontCam = useFrontCam;
+    [self stop];
+    [self setupCameraView];
+    [self start];
+}
+
 
 - (void)setContrast:(float)contrast
 {
@@ -285,7 +304,6 @@ - (void)setBrightness:(float)brightness
 - (void)setDetectionRefreshRateInMS:(NSInteger)detectionRefreshRateInMS
 {
     _detectionRefreshRateInMS = detectionRefreshRateInMS;
-    NSLog(@"lol : %ld", (long)_detectionRefreshRateInMS);
 }
 
 

ios/RNPdfScannerManager.m

@@ -21,6 +21,7 @@ - (dispatch_queue_t)methodQueue
 
 RCT_EXPORT_VIEW_PROPERTY(overlayColor, UIColor)
 RCT_EXPORT_VIEW_PROPERTY(enableTorch, BOOL)
+RCT_EXPORT_VIEW_PROPERTY(useFrontCam, BOOL)
 RCT_EXPORT_VIEW_PROPERTY(detectionCountBeforeCapture, NSInteger)
 RCT_EXPORT_VIEW_PROPERTY(detectionRefreshRateInMS, NSInteger)
 RCT_EXPORT_VIEW_PROPERTY(saturation, float)

package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-native-document-scanner",
   "description": "Scan documents, automatic border detection, automatic crop",
-  "version": "1.2.2",
+  "version": "1.3.0",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"