react-native-camera/docs/migration.md

Migrating from RCTCamera to RNCamera

Project Integration

Please follow the RNCamera doc instalation guide to install the face detection frameworks on both platforms.

iOS

Open your app's XCode project. Expand the Libraries folder in the project navigation and right click and delete the RCTCamera.xcodeproj.

On your project's target, on Build Phases, click on libRCTCamera.a and delete (press the - button below).

You can follow the instalation steps for RNCamera on the readme to link the new RNCamera project to your app's XCode project.

You can do it via react-native link command or by the manual steps.

Before building and running again, do a complete clean on your project.

Android

1. On the MainApplication of your Android project change the import of RCTCameraPackage line to:

import org.reactnative.RNCameraPackage;

2. Inside the getPackages() methods change new RCTCameraPackage() to new RNCameraPackage().

3. On android/app/build.gradle, change the line: compile (project(':react-native-camera')) to:

      compile (project(':react-native-camera')) {
      exclude group: "com.google.android.gms"
  }
      compile ("com.google.android.gms:play-services-vision:10.2.0") {
      force = true;
  }

4. Add jitpack to android/build.gradle

allprojects {
    repositories {
        maven { url "https://jitpack.io" }
    }
}```

## Usage differences

### imports

Instead of importing `Camera`, now, you should import `{ RNCamera }` from `react-native-camera`.

### No `captureMode` prop

On RCTCamera, you would set the camera `captureMode` to `still` or `video` and you could only record or take a picture depending on the `captureMode` of your `Camera`.

On RNCamera you do not need to specify `captureMode`. The RNCameara, in any state, can record or take a picture calling the appropriate method.

### `capture` to `takePictureAsync` or `recordAsync`

Let's say you have a component with a RCTCamera taking a photo:

import Camera from 'react-native-camera'; class TakePicture extends Component { takePicture = async () => { try { const data = await this.camera.capture(); console.log('Path to image: ' + data.path); } catch (err) { // console.log('err: ', err); } }; render() { return ( <Camera ref={cam => { this.camera = cam; }} style={styles.preview} aspect={Camera.constants.Aspect.fill} captureAudio={false} > camera Take Photo

    <View style={styles.space} />
  </View>
);

} }

You should change this to:

import { RNCamera } from 'react-native-camera'; class TakePicture extends Component { takePicture = async () => { try { const data = await this.camera.takePictureAsync(); console.log('Path to image: ' + data.uri); } catch (err) { // console.log('err: ', err); } }; render() { return ( <RNCamera ref={cam => { this.camera = cam; }} style={styles.preview} > camera Take Photo

    <View style={styles.space} />
  </View>
);

} }

The same logic applies to change `capture` to `recordAsync`.

### `flashMode` and `torchMode`

In RCTCamera, there was `flashMode` and `torchMode` prop. In RNCamera, these are combined into the `flashMode` prop.

### Other differences

Take a look into the [RCTCamera doc](https://github.com/react-native-community/react-native-camera/blob/master/docs/RCTCamera.md) and the [RNCamera doc](https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md) to see more differences.