From 0e5b97817a2a4d3be951f5b6079c1f20010a3956 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 15:52:56 -0200 Subject: [PATCH 01/10] Create new readme to be used when 1.0.0 is released --- docs/README-1.0.md | 292 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 292 insertions(+) create mode 100644 docs/README-1.0.md diff --git a/docs/README-1.0.md b/docs/README-1.0.md new file mode 100644 index 0000000..26483f9 --- /dev/null +++ b/docs/README-1.0.md @@ -0,0 +1,292 @@ +# React Native Camera [![Backers on Open Collective](https://opencollective.com/react-native-camera/backers/badge.svg)](#backers) [![Sponsors on Open Collective](https://opencollective.com/react-native-camera/sponsors/badge.svg)](#sponsors) [![npm version](https://badge.fury.io/js/react-native-camera.svg)](http://badge.fury.io/js/react-native-camera) [![Gitter](https://badges.gitter.im/lwansbrough/react-native-camera.svg)](https://gitter.im/lwansbrough/react-native-camera) + +The comprehensive camera module for React Native. Including photographs, videos, face detection and barcode scanning! + +`import { RNCamera, FaceDetector } from 'react-native-camera';` + +#### How to use master branch? +Inside your package.json, use this +`"react-native-camera": "git+https://git@github.com/react-native-community/react-native-camera"` +instead of `"react-native-camera": "^0.13.0"`. + +### Contributing +- Pull Requests are welcome, if you open a pull request we will do our best to get to it in a timely manner +- Pull Request Reviews and even more welcome! we need help testing, reviewing, and updating open PRs +- If you are interested in contributing more actively, please contact me (same username on Twitter, Facebook, etc.) Thanks! +- We are now on [Open Collective](https://opencollective.com/react-native-camera#sponsor)! Contributions are appreciated and will be used to fund core contributors. [more details](#open-collective) +- If you want to help us coding, join Expo slack https://slack.expo.io/, so we can chat over there. (#react-native-camera) + +#### Breaking Changes +##### android build tools has been bumped to 25.0.2, please update (can be done via android cli or AndroidStudio) +##### react-native header imports have changed in v0.40, and that means breaking changes for all! [Reference PR & Discussion](https://github.com/lwansbrough/react-native-camera/pull/544). +- if on react-native < 0.40: `npm i react-native-camera@0.4` +- if on react-native >= 0.40 `npm i react-native-camera@0.6` + +##### Permissions +To use the camera on Android you must ask for camera permission: +```java + +``` +To enable `video recording` feature you have to add the following code to the `AndroidManifest.xml`: +```java + + + + +``` + +![5j2jduk](https://cloud.githubusercontent.com/assets/2302315/22190752/6bc6ccd0-e0da-11e6-8e2f-6f22a3567a57.gif) + +## Getting started + +### Requirements +1. JDK >= 1.7 (if you run on 1.6 you will get an error on "_cameras = new HashMap<>();") +2. With iOS 10 and higher you need to add the "Privacy - Camera Usage Description" key to the Info.plist of your project. This should be found in 'your_project/ios/your_project/Info.plist'. Add the following code: +``` +NSCameraUsageDescription +Your message to user when the camera is accessed for the first time + + +NSPhotoLibraryUsageDescription +Your message to user when the photo library is accessed for the first time + + +NSMicrophoneUsageDescription +Your message to user when the microphone is accessed for the first time +``` +3. On Android, you require `buildToolsVersion` of `25.0.2+`. _This should easily and automatically be downloaded by Android Studio's SDK Manager._ + +4. On iOS 11 and later you need to add `NSPhotoLibraryAddUsageDescription` key to the Info.plist. This key lets you describe the reason your app seeks write-only access to the user’s photo library. Info.plist can be found in 'your_project/ios/your_project/Info.plist'. Add the following code: +``` + +NSPhotoLibraryAddUsageDescription +Your message to user when the photo library is accessed for the first time +``` + +### Mostly automatic install with react-native +1. `npm install react-native-camera --save` +3. `react-native link react-native-camera` + +### Mostly automatic install with CocoaPods +1. `npm install react-native-camera --save` +2. Add the plugin dependency to your Podfile, pointing at the path where NPM installed it: +```obj-c +pod 'react-native-camera', path: '../node_modules/react-native-camera' +``` +3. Run `pod install` + +### Manual install +#### iOS +1. `npm install react-native-camera --save` +2. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]` +3. Go to `node_modules` ➜ `react-native-camera` and add `RCTCamera.xcodeproj` +4. In XCode, in the project navigator, select your project. Add `libRCTCamera.a` to your project's `Build Phases` ➜ `Link Binary With Libraries` +5. Click `RCTCamera.xcodeproj` in the project navigator and go the `Build Settings` tab. Make sure 'All' is toggled on (instead of 'Basic'). In the `Search Paths` section, look for `Header Search Paths` and make sure it contains both `$(SRCROOT)/../../react-native/React` and `$(SRCROOT)/../../../React` - mark both as `recursive`. + +### Face Detection Steps + +Face Detecion is optional on iOS. If you want it, you are going to need to install Google Mobile Vision frameworks in your project, as mentioned in the next section. + +##### No Face Detection steps + +If you do not need it and do not wnat to install the GMV frameworks, open your app xcode project, on the Project Navigator, expand the RNCamera project, right click on the FaceDetector folder and delete it (move to trash, if you want). If you keep that folder and do not follow the GMV installation setps, your project will not compile. + +If you want to make this automatic, you can add a postinstall script to your app `package.json`. Inside the `postinstall_project` there is a xcode project ready with the folder removed (we opened xcode, removed the folder from the project and copied the resulting project file). The post install script is: +``` +#!/bin/bash +rm -rf node_modules/react-native-camera/ios/FaceDetector +cp node_modules/react-native-camera/postinstall_project/projectWithoutFaceDetection.pbxproj node_modules/react-native-camera/ios/RCTCamera.xcodeproj/project.pbxproj +``` + +And add something like this to the `scripts` section in your `package.json`: + +``` +"postinstall": "./scripts/post.sh", +``` + +##### Installing GMV frameworks +GMV (Google Mobile Vision) is used for Face detection by the iOS RNCamera. You have to link the google frameworks to your project to successfully compile the RNCamera project. + +1. Download: +Google Symbol Utilities: https://www.gstatic.com/cpdc/dbffca986f6337f8-GoogleSymbolUtilities-1.1.1.tar.gz + + Google Utilities: https://dl.google.com/dl/cpdc/978f81964b50a7c0/GoogleUtilities-1.3.2.tar.gz + + Google Mobile Vision: https://dl.google.com/dl/cpdc/df83c97cbca53eaf/GoogleMobileVision-1.1.0.tar.gz + + Google network Utilities: https://dl.google.com/dl/cpdc/54fd7b7ef8fd3edc/GoogleNetworkingUtilities-1.2.2.tar.gz + + Google Interchange Utilities: https://dl.google.com/dl/cpdc/1a7f7ba905b2c029/GoogleInterchangeUtilities-1.2.2.tar.gz + +2. Extract everything to one folder. Delete "BarcodeDetector" and "copy" folders from Google Mobile Vision. + +3. Open XCode, right click on your project and choose "New Group". Rename the new folder to "Frameworks". Right click on "Frameworks" and select "add files to 'YOUR_PROJECT'". Select all content from the folder of step 2, click on Options. Select "Copy items if needed", leave "Create groups" selected and choose all your targets on the "Add to targets" section. Then, click on "Add". + +4. On your target -> Build Phases -> Link Binary with Libraries -> add AddressBook.framework +5. On your target -> Build Settings -> Other Linker Flags -> add -lz, -ObjC and -lc++ +6. To force indexing and prevent erros, restart xcode and reopen your project again before compiling. + +#### Android +1. `npm install react-native-camera --save` +2. Open up `android/app/src/main/java/[...]/MainApplication.java + - Add `import com.lwansbrough.RCTCamera.RCTCameraPackage;` to the imports at the top of the file + - Add `new RCTCameraPackage()` to the list returned by the `getPackages()` method. Add a comma to the previous item if there's already something there. + +3. Append the following lines to `android/settings.gradle`: + + ```gradle + include ':react-native-camera' + project(':react-native-camera').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-camera/android') + ``` + +4. Insert the following lines inside the dependencies block in `android/app/build.gradle`: + + ```gradle + compile project(':react-native-camera') + ``` +5. Declare the permissions in your Android Manifest (required for `video recording` feature) + + ```java + + + + ``` + +6. Add jitpack to android/build.gradle +```gradle +allprojects { + repositories { + maven { url "https://jitpack.io" } + } +} +``` + +## Usage + +### RNCamera + +Take a look into this [documentation](https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md). + +### RCTCamera + +Since `1.0.0`, RCTCamera is deprecated, but if you want to use it, you can see its [documentation](https://github.com/react-native-community/react-native-camera/blob/master/docs/RCTCamera.md). + +## Q & A + +#### meta-data android 26 +``` + AndroidManifest.xml:25:13-35 Error: + Attribute meta-data#android.support.VERSION@value value=(26.0.2) from [com.android.support:exifinterface:26.0.2] Android + Manifest.xml:25:13-35 + is also present at [com.android.support:support-v4:26.0.1] AndroidManifest.xml:28:13-35 value=(26.0.1). + Suggestion: add 'tools:replace="android:value"' to element at AndroidManifest.xml:23:9-25:38 to override. +``` + +Add this to your AndroidManifest.xml: + +- [ ] xmlns:tools="http://schemas.android.com/tools" + +```xml + +``` + +#### When I try to build my project, I get following error: +``` +Execution failed for task ':app:processDebugManifest'. +> Manifest merger failed : Attribute meta-data#android.support.VERSION@value value=(26.0.2) from [com.android.support:exifinterface:26.0.2] AndroidManifest.xml:25:13-35 + is also present at [com.android.support:support-v4:26.0.1] AndroidManifest.xml:28:13-35 value=(26.0.1). + Suggestion: add 'tools:replace="android:value"' to element at AndroidManifest.xml:23:9-25:38 to override. +``` +#### As the error message hints `com.android.support:exifinterface:26.0.2` is already found in `com.android.support:support-v4:26.0.1` +To fix this issue, modify your project's `android/app/build.gradle` as follows: +```Gradle +dependencies { + compile (project(':react-native-camera')) { + exclude group: "com.android.support" + + // uncomment this if also com.google.android.gms:play-services-vision versions are conflicting + // this can happen if you use react-native-firebase + // exclude group: "com.google.android.gms" + } + + compile ('com.android.support:exifinterface:26.0.1') { + force = true; + } + + // uncomment this if you uncommented the previous line + // compile ('com.google.android.gms:play-services-vision:11.6.0') { + // force = true; + // } +} +``` + +## Open Collective +We are just beginning a funding campaign for react-native-camera. Contributions are greatly appreciated. When we gain more than $250 we will begin distributing funds to core maintainers in a fully transparent manner. Feedback for this process is welcomed, we will continue to evolve the strategy as we grow and learn more. + +### Backers + +Support us with a monthly donation and help us continue our activities. [[Become a backer](https://opencollective.com/react-native-camera#backer)] + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +### Sponsors + +Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/react-native-camera#sponsor)] + + + + + + + + + + + + + +------------ + +Thanks to Brent Vatne (@brentvatne) for the `react-native-video` module which provided me with a great example of how to set up this module. From 5ec8fa59cc7ee2892845373721846ad1c595ab23 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 17:02:14 -0200 Subject: [PATCH 02/10] Create migration guide. --- docs/README-1.0.md | 13 ++++- docs/migration.md | 124 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 136 insertions(+), 1 deletion(-) create mode 100644 docs/migration.md diff --git a/docs/README-1.0.md b/docs/README-1.0.md index 26483f9..b92b1dc 100644 --- a/docs/README-1.0.md +++ b/docs/README-1.0.md @@ -37,6 +37,10 @@ To enable `video recording` feature you have to add the following code to the `A ![5j2jduk](https://cloud.githubusercontent.com/assets/2302315/22190752/6bc6ccd0-e0da-11e6-8e2f-6f22a3567a57.gif) +## Migrating from RCTCamera to RNCamera + +See this [doc](https://github.com/react-native-community/react-native-camera/blob/master/docs/migration.md). + ## Getting started ### Requirements @@ -142,7 +146,12 @@ Google Symbol Utilities: https://www.gstatic.com/cpdc/dbffca986f6337f8-GoogleSym 4. Insert the following lines inside the dependencies block in `android/app/build.gradle`: ```gradle - compile project(':react-native-camera') + compile (project(':react-native-camera')) { + exclude group: "com.google.android.gms" + } + compile ("com.google.android.gms:play-services-vision:10.2.0") { + force = true; + } ``` 5. Declare the permissions in your Android Manifest (required for `video recording` feature) @@ -161,6 +170,8 @@ allprojects { } ``` +Follow the Q & A section if you are having compilation issues. + ## Usage ### RNCamera diff --git a/docs/migration.md b/docs/migration.md new file mode 100644 index 0000000..b07c5ad --- /dev/null +++ b/docs/migration.md @@ -0,0 +1,124 @@ +# Migrating from RCTCamera to RNCamera + +## Compiling + +Please follow the [RNCamera doc](https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md) instalation guide to install the face detection frameworks on both platforms. + + +### Android + +On `android/app/build.gradle`, change the line: `compile (project(':react-native-camera'))` to: + ```gradle + compile (project(':react-native-camera')) { + exclude group: "com.google.android.gms" + } + compile ("com.google.android.gms:play-services-vision:10.2.0") { + force = true; + } + ``` + +Add jitpack to android/build.gradle +```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 ( + + { + this.camera = cam; + }} + style={styles.preview} + aspect={Camera.constants.Aspect.fill} + captureAudio={false} + > + + + camera + Take Photo + + + + + + + ); + } +} +``` + +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 ( + + { + this.camera = cam; + }} + style={styles.preview} + > + + + camera + Take Photo + + + + + + + ); + } +} +``` + +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. \ No newline at end of file From 04fe1332ade10c56bd36aa94febea32c41caf773 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 17:26:22 -0200 Subject: [PATCH 03/10] Change more docs --- docs/README-1.0.md | 4 ++-- docs/migration.md | 11 +++++++++-- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/docs/README-1.0.md b/docs/README-1.0.md index b92b1dc..b56c377 100644 --- a/docs/README-1.0.md +++ b/docs/README-1.0.md @@ -133,8 +133,8 @@ Google Symbol Utilities: https://www.gstatic.com/cpdc/dbffca986f6337f8-GoogleSym #### Android 1. `npm install react-native-camera --save` 2. Open up `android/app/src/main/java/[...]/MainApplication.java - - Add `import com.lwansbrough.RCTCamera.RCTCameraPackage;` to the imports at the top of the file - - Add `new RCTCameraPackage()` to the list returned by the `getPackages()` method. Add a comma to the previous item if there's already something there. + - Add `import org.reactnative.RNCameraPackage;` to the imports at the top of the file + - Add `new RNCameraPackage()` to the list returned by the `getPackages()` method. Add a comma to the previous item if there's already something there. 3. Append the following lines to `android/settings.gradle`: diff --git a/docs/migration.md b/docs/migration.md index b07c5ad..b133100 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -7,7 +7,14 @@ Please follow the [RNCamera doc](https://github.com/react-native-community/react ### Android -On `android/app/build.gradle`, change the line: `compile (project(':react-native-camera'))` to: +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: ```gradle compile (project(':react-native-camera')) { exclude group: "com.google.android.gms" @@ -17,7 +24,7 @@ On `android/app/build.gradle`, change the line: `compile (project(':react-native } ``` -Add jitpack to android/build.gradle +4. Add jitpack to android/build.gradle ```gradle allprojects { repositories { From 377b184e04ed5a795b0203b06139aef6c4304b98 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 17:27:05 -0200 Subject: [PATCH 04/10] Migrate Android from RCTCameraPackage to RNCameraPackage --- android/src/main/AndroidManifest.xml | 2 +- .../reactnative/RNCameraPackage.java} | 30 +++++++++++-------- 2 files changed, 18 insertions(+), 14 deletions(-) rename android/src/main/java/{com/lwansbrough/RCTCamera/RCTCameraPackage.java => org/reactnative/RNCameraPackage.java} (66%) diff --git a/android/src/main/AndroidManifest.xml b/android/src/main/AndroidManifest.xml index d90aa96..111750c 100644 --- a/android/src/main/AndroidManifest.xml +++ b/android/src/main/AndroidManifest.xml @@ -1,4 +1,4 @@ - + diff --git a/android/src/main/java/com/lwansbrough/RCTCamera/RCTCameraPackage.java b/android/src/main/java/org/reactnative/RNCameraPackage.java similarity index 66% rename from android/src/main/java/com/lwansbrough/RCTCamera/RCTCameraPackage.java rename to android/src/main/java/org/reactnative/RNCameraPackage.java index 12f7492..7fefba2 100644 --- a/android/src/main/java/com/lwansbrough/RCTCamera/RCTCameraPackage.java +++ b/android/src/main/java/org/reactnative/RNCameraPackage.java @@ -1,27 +1,32 @@ -package com.lwansbrough.RCTCamera; - -import java.util.Arrays; -import java.util.Collections; -import java.util.List; +package org.reactnative; import com.facebook.react.ReactPackage; +import com.facebook.react.bridge.JavaScriptModule; import com.facebook.react.bridge.NativeModule; import com.facebook.react.bridge.ReactApplicationContext; import com.facebook.react.uimanager.ViewManager; -import com.facebook.react.bridge.JavaScriptModule; +import com.lwansbrough.RCTCamera.RCTCameraModule; +import com.lwansbrough.RCTCamera.RCTCameraViewManager; import org.reactnative.camera.CameraModule; import org.reactnative.camera.CameraViewManager; import org.reactnative.facedetector.FaceDetectorModule; -public class RCTCameraPackage implements ReactPackage { +import java.util.Arrays; +import java.util.Collections; +import java.util.List; +/** + * Created by jgfidelis on 02/02/18. + */ + +public class RNCameraPackage implements ReactPackage { @Override public List createNativeModules(ReactApplicationContext reactApplicationContext) { return Arrays.asList( - new RCTCameraModule(reactApplicationContext), - new CameraModule(reactApplicationContext), - new FaceDetectorModule(reactApplicationContext) + new RCTCameraModule(reactApplicationContext), + new CameraModule(reactApplicationContext), + new FaceDetectorModule(reactApplicationContext) ); } @@ -33,9 +38,8 @@ public class RCTCameraPackage implements ReactPackage { @Override public List createViewManagers(ReactApplicationContext reactApplicationContext) { return Arrays.asList( - new RCTCameraViewManager(), - new CameraViewManager() + new RCTCameraViewManager(), + new CameraViewManager() ); } - } From 4146865bb6b3e232e9a9a67b45b543d1413272a4 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 17:34:16 -0200 Subject: [PATCH 05/10] Change project from RCTCamera to RNCamera --- .../project.pbxproj | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) rename ios/{RCTCamera.xcodeproj => RNCamera.xcodeproj}/project.pbxproj (96%) diff --git a/ios/RCTCamera.xcodeproj/project.pbxproj b/ios/RNCamera.xcodeproj/project.pbxproj similarity index 96% rename from ios/RCTCamera.xcodeproj/project.pbxproj rename to ios/RNCamera.xcodeproj/project.pbxproj index 8155713..e54bc7b 100644 --- a/ios/RCTCamera.xcodeproj/project.pbxproj +++ b/ios/RNCamera.xcodeproj/project.pbxproj @@ -40,7 +40,7 @@ /* Begin PBXFileReference section */ 0314E39B1B661A0C0092D183 /* CameraFocusSquare.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = CameraFocusSquare.h; sourceTree = ""; }; 0314E39C1B661A460092D183 /* CameraFocusSquare.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = CameraFocusSquare.m; sourceTree = ""; }; - 4107012F1ACB723B00C6AA39 /* libRCTCamera.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = libRCTCamera.a; sourceTree = BUILT_PRODUCTS_DIR; }; + 4107012F1ACB723B00C6AA39 /* libRNCamera.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = libRNCamera.a; sourceTree = BUILT_PRODUCTS_DIR; }; 410701471ACB732B00C6AA39 /* RCTCamera.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCTCamera.h; sourceTree = ""; }; 410701481ACB732B00C6AA39 /* RCTCamera.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTCamera.m; sourceTree = ""; }; 410701491ACB732B00C6AA39 /* RCTCameraManager.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCTCameraManager.h; sourceTree = ""; }; @@ -96,7 +96,7 @@ 410701301ACB723B00C6AA39 /* Products */ = { isa = PBXGroup; children = ( - 4107012F1ACB723B00C6AA39 /* libRCTCamera.a */, + 4107012F1ACB723B00C6AA39 /* libRNCamera.a */, ); name = Products; sourceTree = ""; @@ -156,9 +156,9 @@ /* End PBXGroup section */ /* Begin PBXNativeTarget section */ - 4107012E1ACB723B00C6AA39 /* RCTCamera */ = { + 4107012E1ACB723B00C6AA39 /* RNCamera */ = { isa = PBXNativeTarget; - buildConfigurationList = 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RCTCamera" */; + buildConfigurationList = 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RNCamera" */; buildPhases = ( 4107012B1ACB723B00C6AA39 /* Sources */, 4107012C1ACB723B00C6AA39 /* Frameworks */, @@ -168,9 +168,9 @@ ); dependencies = ( ); - name = RCTCamera; + name = RNCamera; productName = RCTCamera; - productReference = 4107012F1ACB723B00C6AA39 /* libRCTCamera.a */; + productReference = 4107012F1ACB723B00C6AA39 /* libRNCamera.a */; productType = "com.apple.product-type.library.static"; }; /* End PBXNativeTarget section */ @@ -186,7 +186,7 @@ }; }; }; - buildConfigurationList = 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RCTCamera" */; + buildConfigurationList = 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RNCamera" */; compatibilityVersion = "Xcode 3.2"; developmentRegion = English; hasScannedForEncodings = 0; @@ -198,7 +198,7 @@ projectDirPath = ""; projectRoot = ""; targets = ( - 4107012E1ACB723B00C6AA39 /* RCTCamera */, + 4107012E1ACB723B00C6AA39 /* RNCamera */, ); }; /* End PBXProject section */ @@ -337,7 +337,7 @@ /* End XCBuildConfiguration section */ /* Begin XCConfigurationList section */ - 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RCTCamera" */ = { + 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RNCamera" */ = { isa = XCConfigurationList; buildConfigurations = ( 410701291ACB719800C6AA39 /* Debug */, @@ -346,7 +346,7 @@ defaultConfigurationIsVisible = 0; defaultConfigurationName = Release; }; - 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RCTCamera" */ = { + 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RNCamera" */ = { isa = XCConfigurationList; buildConfigurations = ( 410701421ACB723B00C6AA39 /* Debug */, From 2bb5ac2e6905ee2bba78c0958d951821a29d755a Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 18:06:14 -0200 Subject: [PATCH 06/10] More docs about migrating --- docs/README-1.0.md | 6 +++--- docs/migration.md | 14 +++++++++++++- 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/docs/README-1.0.md b/docs/README-1.0.md index b56c377..e80cbb5 100644 --- a/docs/README-1.0.md +++ b/docs/README-1.0.md @@ -83,9 +83,9 @@ pod 'react-native-camera', path: '../node_modules/react-native-camera' #### iOS 1. `npm install react-native-camera --save` 2. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]` -3. Go to `node_modules` ➜ `react-native-camera` and add `RCTCamera.xcodeproj` -4. In XCode, in the project navigator, select your project. Add `libRCTCamera.a` to your project's `Build Phases` ➜ `Link Binary With Libraries` -5. Click `RCTCamera.xcodeproj` in the project navigator and go the `Build Settings` tab. Make sure 'All' is toggled on (instead of 'Basic'). In the `Search Paths` section, look for `Header Search Paths` and make sure it contains both `$(SRCROOT)/../../react-native/React` and `$(SRCROOT)/../../../React` - mark both as `recursive`. +3. Go to `node_modules` ➜ `react-native-camera` and add `RNCamera.xcodeproj` +4. In XCode, in the project navigator, select your project. Add `libRNCamera.a` to your project's `Build Phases` ➜ `Link Binary With Libraries` +5. Click `RNCamera.xcodeproj` in the project navigator and go the `Build Settings` tab. Make sure 'All' is toggled on (instead of 'Basic'). In the `Search Paths` section, look for `Header Search Paths` and make sure it contains both `$(SRCROOT)/../../react-native/React` and `$(SRCROOT)/../../../React` - mark both as `recursive`. ### Face Detection Steps diff --git a/docs/migration.md b/docs/migration.md index b133100..66e13d9 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -1,9 +1,21 @@ # Migrating from RCTCamera to RNCamera -## Compiling +## Project Integration Please follow the [RNCamera doc](https://github.com/react-native-community/react-native-camera/blob/master/docs/RNCamera.md) 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 From 1805209e1c89f324dfadd7741a14a00500b335d2 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Fri, 2 Feb 2018 18:09:30 -0200 Subject: [PATCH 07/10] Modify project without face detection for new RNCamera project --- .../projectWithoutFaceDetection.pbxproj | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/postinstall_project/projectWithoutFaceDetection.pbxproj b/postinstall_project/projectWithoutFaceDetection.pbxproj index 8aba166..01373fa 100644 --- a/postinstall_project/projectWithoutFaceDetection.pbxproj +++ b/postinstall_project/projectWithoutFaceDetection.pbxproj @@ -35,7 +35,7 @@ /* Begin PBXFileReference section */ 0314E39B1B661A0C0092D183 /* CameraFocusSquare.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = CameraFocusSquare.h; sourceTree = ""; }; 0314E39C1B661A460092D183 /* CameraFocusSquare.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = CameraFocusSquare.m; sourceTree = ""; }; - 4107012F1ACB723B00C6AA39 /* libRCTCamera.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = libRCTCamera.a; sourceTree = BUILT_PRODUCTS_DIR; }; + 4107012F1ACB723B00C6AA39 /* libRNCamera.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = libRNCamera.a; sourceTree = BUILT_PRODUCTS_DIR; }; 410701471ACB732B00C6AA39 /* RCTCamera.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCTCamera.h; sourceTree = ""; }; 410701481ACB732B00C6AA39 /* RCTCamera.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RCTCamera.m; sourceTree = ""; }; 410701491ACB732B00C6AA39 /* RCTCameraManager.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RCTCameraManager.h; sourceTree = ""; }; @@ -80,7 +80,7 @@ 410701301ACB723B00C6AA39 /* Products */ = { isa = PBXGroup; children = ( - 4107012F1ACB723B00C6AA39 /* libRCTCamera.a */, + 4107012F1ACB723B00C6AA39 /* libRNCamera.a */, ); name = Products; sourceTree = ""; @@ -123,9 +123,9 @@ /* End PBXGroup section */ /* Begin PBXNativeTarget section */ - 4107012E1ACB723B00C6AA39 /* RCTCamera */ = { + 4107012E1ACB723B00C6AA39 /* RNCamera */ = { isa = PBXNativeTarget; - buildConfigurationList = 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RCTCamera" */; + buildConfigurationList = 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RNCamera" */; buildPhases = ( 4107012B1ACB723B00C6AA39 /* Sources */, 4107012C1ACB723B00C6AA39 /* Frameworks */, @@ -135,9 +135,9 @@ ); dependencies = ( ); - name = RCTCamera; + name = RNCamera; productName = RCTCamera; - productReference = 4107012F1ACB723B00C6AA39 /* libRCTCamera.a */; + productReference = 4107012F1ACB723B00C6AA39 /* libRNCamera.a */; productType = "com.apple.product-type.library.static"; }; /* End PBXNativeTarget section */ @@ -153,7 +153,7 @@ }; }; }; - buildConfigurationList = 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RCTCamera" */; + buildConfigurationList = 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RNCamera" */; compatibilityVersion = "Xcode 3.2"; developmentRegion = English; hasScannedForEncodings = 0; @@ -165,7 +165,7 @@ projectDirPath = ""; projectRoot = ""; targets = ( - 4107012E1ACB723B00C6AA39 /* RCTCamera */, + 4107012E1ACB723B00C6AA39 /* RNCamera */, ); }; /* End PBXProject section */ @@ -299,7 +299,7 @@ /* End XCBuildConfiguration section */ /* Begin XCConfigurationList section */ - 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RCTCamera" */ = { + 410701281ACB719800C6AA39 /* Build configuration list for PBXProject "RNCamera" */ = { isa = XCConfigurationList; buildConfigurations = ( 410701291ACB719800C6AA39 /* Debug */, @@ -308,7 +308,7 @@ defaultConfigurationIsVisible = 0; defaultConfigurationName = Release; }; - 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RCTCamera" */ = { + 410701411ACB723B00C6AA39 /* Build configuration list for PBXNativeTarget "RNCamera" */ = { isa = XCConfigurationList; buildConfigurations = ( 410701421ACB723B00C6AA39 /* Debug */, From 1e2dd4e61f2a307fe3ad133c1e83e59e92714c84 Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Sat, 3 Feb 2018 09:36:03 -0200 Subject: [PATCH 08/10] Change new package location to avoid a Android studio bug --- android/src/main/AndroidManifest.xml | 2 +- .../main/java/org/reactnative/{ => camera}/RNCameraPackage.java | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) rename android/src/main/java/org/reactnative/{ => camera}/RNCameraPackage.java (97%) diff --git a/android/src/main/AndroidManifest.xml b/android/src/main/AndroidManifest.xml index 111750c..fe6303a 100644 --- a/android/src/main/AndroidManifest.xml +++ b/android/src/main/AndroidManifest.xml @@ -1,4 +1,4 @@ - + diff --git a/android/src/main/java/org/reactnative/RNCameraPackage.java b/android/src/main/java/org/reactnative/camera/RNCameraPackage.java similarity index 97% rename from android/src/main/java/org/reactnative/RNCameraPackage.java rename to android/src/main/java/org/reactnative/camera/RNCameraPackage.java index 7fefba2..ccdbd43 100644 --- a/android/src/main/java/org/reactnative/RNCameraPackage.java +++ b/android/src/main/java/org/reactnative/camera/RNCameraPackage.java @@ -1,4 +1,4 @@ -package org.reactnative; +package org.reactnative.camera; import com.facebook.react.ReactPackage; import com.facebook.react.bridge.JavaScriptModule; From e21d2f4c870f8f7608ab1000833138497d4f38aa Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Sat, 3 Feb 2018 10:37:35 -0200 Subject: [PATCH 09/10] Use most recent cameraview commit --- android/build.gradle | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/android/build.gradle b/android/build.gradle index 28e43a9..1c66b11 100755 --- a/android/build.gradle +++ b/android/build.gradle @@ -44,5 +44,5 @@ dependencies { compile 'com.google.android.gms:play-services-vision:+' compile "com.android.support:exifinterface:26.0.2" - compile 'com.github.react-native-community:cameraview:df60b07573' + compile 'com.github.react-native-community:cameraview:d5d9b0d925494ef451ce3eef3fdf14cc874d9baa' } From 28aab558e069e271f5723bf68779ca1898089fda Mon Sep 17 00:00:00 2001 From: Joao Fidelis Date: Sat, 3 Feb 2018 10:47:16 -0200 Subject: [PATCH 10/10] Added warning on main readme.md about package change on master branch --- README.md | 28 ++++++++++++++++++++++++++++ docs/migration.md | 2 +- 2 files changed, 29 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index d42a1ba..c0c3f41 100644 --- a/README.md +++ b/README.md @@ -14,6 +14,34 @@ Inside your package.json, use this `"react-native-camera": "git+https://git@github.com/react-native-community/react-native-camera"` instead of `"react-native-camera": "^0.12.0"`. +#### Package change + +We are getting close to the 1.0 release and changed the package name's from RCTCamera to RNCamera, if you are using master branch, your app will not compile right away. + +Steps to adapt: + +### 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.camera.RNCameraPackage; +``` + +2. Inside the getPackages() methods change `new RCTCameraPackage()` to `new RNCameraPackage()`. + ### Contributing - Pull Requests are welcome, if you open a pull request we will do our best to get to it in a timely manner - Pull Request Reviews and even more welcome! we need help testing, reviewing, and updating open PRs diff --git a/docs/migration.md b/docs/migration.md index 66e13d9..d9c8deb 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -21,7 +21,7 @@ Before building and running again, do a complete clean on your project. 1. On the MainApplication of your Android project change the import of RCTCameraPackage line to: ``` -import org.reactnative.RNCameraPackage; +import org.reactnative.camera.RNCameraPackage; ``` 2. Inside the getPackages() methods change `new RCTCameraPackage()` to `new RNCameraPackage()`.