When I try to build an app with OpenCV with Xcode, the build succeeds, but the app couldn't be installed, and then such window pops up

If I click Details button, then I get such error

This app could not be installed at this time.
Domain: IXUserPresentableErrorDomain
Code: 1
Failure Reason: Could not install at this time.
Recovery Suggestion: Failed to load Info.plist from bundle at path /Users/mpodlesny/Library/Developer/CoreSimulator/Devices/4D35945D-A969-4578-9BFB-36C284AE832F/data/Library/Caches/com.apple.mobile.installd.staging/temp.B3q0wJ/extracted/FirstReactNativeApp.app/Frameworks/opencv2.framework

Failed to load Info.plist from bundle at path /Users/mpodlesny/Library/Developer/CoreSimulator/Devices/4D35945D-A969-4578-9BFB-36C284AE832F/data/Library/Caches/com.apple.mobile.installd.staging/temp.B3q0wJ/extracted/FirstReactNativeApp.app/Frameworks/opencv2.framework
Domain: MIInstallerErrorDomain
Code: 35
User Info: {
FunctionName = "-[MIBundle _validateWithError:]";
LegacyErrorString = PackageInspectionFailed;
SourceFileLine = 39;
}

Please say how can I overcome this problem. Thanks in advance!

Getting the above error message when trying to run the project on IOS. Has anyone come across this before?

In Java, methods should have the opening curly bracket in the same line, which is mostly applied in this repo but not e.g. here.

Maybe we could add a Java linter to enforce the coding style?
Though I'm not sure whether any good Java linter exists beside these which are builtin in an IDE.

Hi, I'm new to openCV and java so just trying to understand react bridge a bit more, I noticed that you commented out:

Bitmap image = decodeSampledBitmapFromFile(imageurl, 2000, 2000);

And replaced it with the base64 from the react native camera. Is there a reason why base64 was used across the bridge instead of just sending the path name through the bridge? Is this faster? If I was going to send an image back to react native - do you suggest sending base64 back or how?

react-native native module is not loading opencv

err [TypeError: _OpenCV.default.checkForBlurryImage is not a function. (In '_OpenCV.default.checkForBlurryImage(imageAsBase64, function (error) {}, function (msg) {
resolve(msg);
})', '_OpenCV.default.checkForBlurryImage' is undefined)]

Hey i went through your blog and trying to wire up OpenCV with react-native, i am unable to successfully add dependency in my react-native application. Would be really helpful if you can help through with it :)
Also I am newbie to react-native and android studio please excuse me if it is a really very silly doubt. !!

This is the screenshot of the image, where I am stuck.

I was able to successfully import the package and change the required versions for
compileSdkVersion
buildToolsVersion
minSdkVersion
targetSdkVersion
in my module build.gradle file as suggested by you. When I reach the part for dependency addition it does not show up anything request you to please help me out.

I am using android-opencv SDK version 4.1.1

The git link for my react-native application : https://github.com/LochanRn/OpenCV-React-Native.git

Thanks in advance.

Can you give exmaple code for a realtime imageprocesing?

For example capture a image from camera draw a rect with opencv and show it in realtime.

hi,

Don't have much knowledge in objective c, however i need to retrieve an image RGBA array with native modules.
Was able to add opencv but now i'm stuck while creating a function able to return the RGBA array from a given base64 image.

Also, example in the project returns false for dataArray

Unable to run successfully

I did it according to the operation manual.
https://brainhub.eu/blog/opencv-react-native-image-processing/

Unfortunately, I did not RUN successfully

npm : 6.14.5
node: v12.18.1
react-native-cli: 2.0.1
react-native: 0.54.2

There is no proper code documentation of bridging between react native and opencv. Are they using native modules If yes then where? How the bridging is done?

Can you make a example to create a greyscale image? or leave me some suggestion (openCV function or link).

Many thanks, love your work. <3

Hi, Thanks for kind blog.
I'm trying to clone and build your project but it's failed.

** BUILD FAILED **



The following build commands failed:
        CompileC /Users/kangsangkwon/Desktop/FaceParty/react-native-opencv-tutorial/ios/build/Build/Intermediates.noindex/React.build/Debug-iphonesimulator/double-conversion.build/Objects-normal/x86_64/fixed-dtoa.o /Users/kangsangkwon/Desktop/FaceParty/react-native-opencv-tutorial/node_modules/react-native/third-party/double-conversion-1.1.5/src/fixed-dtoa.cc normal x86_64 c++ com.apple.compilers.llvm.clang.1_0.compiler
        CompileC /Users/kangsangkwon/Desktop/FaceParty/react-native-opencv-tutorial/ios/build/Build/Intermediates.noindex/React.build/Debug-iphonesimulator/double-conversion.build/Objects-normal/x86_64/strtod.o /Users/kangsangkwon/Desktop/FaceParty/react-native-opencv-tutorial/node_modules/react-native/third-party/double-conversion-1.1.5/src/strtod.cc normal x86_64 c++ com.apple.compilers.llvm.clang.1_0.compiler
        CompileC /Users/kangsangkwon/Desktop/FaceParty/react-native-opencv-tutorial/ios/build/Build/Intermediates.noindex/React.build/Debug-iphonesimulator/double-conversion.build/Objects-normal/x86_64/fast-dtoa.o /Users/kangsangkwon/Desktop/FaceParty/react-native-opencv-tutorial/node_modules/react-native/third-party/double-conversion-1.1.5/src/fast-dtoa.cc normal x86_64 c++ com.apple.compilers.llvm.clang.1_0.compiler
(3 failures)

Installing build/Build/Products/Debug-iphonesimulator/reactNativeOpencvTutorial.app
An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=22):
Failed to install the requested application
The bundle identifier of the application could not be determined.
Ensure that the application's Info.plist contains a value for CFBundleIdentifier.
Print: Entry, ":CFBundleIdentifier", Does Not Exist

Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/reactNativeOpencvTutorial.app/Info.plist
Print: Entry, ":CFBundleIdentifier", Does Not Exist

Chamo, I have a problem :(

I followed for step-by-step guide and I still can't get NativeModules to work. It's an empty object. I'm using RN 0.61.

Please help.

How can use this to detect ArUco markers ?

getting error while click on capture icon ..in Android

I just grab the code and run but this issue appears.

Any help is really appreciated.

Xcode Version 10.3 (10G8)
opencv2.framework 4.5.1 downloaded form https://opencv.org/releases/

Can you please have a look at the below code and see if there are any reasons why this would not detect a QR code when a photo is taken? for the detectAndDecode method it returns an empty string and detect method it returns 0.

RCT_EXPORT_METHOD(checkForQRCode:(NSString )imageAsBase64) {
RCTLog(@"%@", imageAsBase64);
UIImage image = [self decodeBase64ToImage:imageAsBase64];

cv::QRCodeDetector qrDecoder = cv::QRCodeDetector();

BOOL isQRPresentResult = [self isQRPresent:image];

NSString *decodedQrData = [self decodeQRCode:image];
//BOOL isQRPresentResult = 1;

//std::string data = qrDecoder.detectAndDecode(matImage);
//std::string data = "testing";

//NSString* result = [NSString stringWithUTF8String:data.c_str()];
//NSString* result = @"test";
RCTLogInfo(@"Pretending to create an event %@", decodedQrData);
RCTLog(isQRPresentResult ? @"yes" : @"No");
};

-(BOOL)isQRPresent:(UIImage*)image{

cv::Mat matImage = [self convertUIImageToCVMat:image];
cv::Mat matImageGrey;
// converting image's color space (RGB) to grayscale
cv::cvtColor(matImage, matImageGrey, cv::COLOR_BGRA2GRAY);
std::vectorcv::Point points;

cv::QRCodeDetector qrDecoder = cv::QRCodeDetector();
return qrDecoder.detect(matImageGrey, points);

};
-(NSString*)decodeQRCode:(UIImage*)image{

cv::Mat matImage = [self convertUIImageToCVMat:image];
cv::Mat matImageGrey;
// converting image's color space (RGB) to grayscale
cv::cvtColor(matImage, matImageGrey, cv::COLOR_BGRA2GRAY);

cv::QRCodeDetector qrDecoder = cv::QRCodeDetector();
std::string qrData;
qrData = qrDecoder.detectAndDecode(matImageGrey);
return [NSString stringWithUTF8String:qrData.c_str()];

};

• (cv::Mat)convertUIImageToCVMat:(UIImage *)image {
  CGColorSpaceRef colorSpace = CGImageGetColorSpace(image.CGImage);
  CGFloat cols = image.size.width;
  CGFloat rows = image.size.height;

  cv::Mat cvMat(rows, cols, CV_8UC4); // 8 bits per component, 4 channels (color channels + alpha)

  CGContextRef contextRef = CGBitmapContextCreate(cvMat.data, // Pointer to data
  cols, // Width of bitmap
  rows, // Height of bitmap
  8, // Bits per component
  cvMat.step[0], // Bytes per row
  colorSpace, // Colorspace
  kCGImageAlphaNoneSkipLast |
  kCGBitmapByteOrderDefault); // Bitmap info flags

  CGContextDrawImage(contextRef, CGRectMake(0, 0, cols, rows), image.CGImage);
  CGContextRelease(contextRef);

  return cvMat;
  };

• (UIImage *)decodeBase64ToImage:(NSString *)strEncodeData {
  NSData *data = [[NSData alloc]initWithBase64EncodedString:strEncodeData options:NSDataBase64DecodingIgnoreUnknownCharacters];
  return [UIImage imageWithData:data];
  };

err [TypeError: null is not an object (evaluating '_OpenCV.default.checkForBlurryImage')]

I am getting the following error when I take a picture:

Could not invoke RNOpenCvLibrary.checkForBlurryImage

null

No implementation found for long org.opencv.core.Mat.n_Mat() (tried Java_org_opencv_core_Mat_n_1Mat and Java_org_opencv_core_Mat_n_1Mat__)

I found a similar issue on stackoverflow, but couldn't figure out how to solve this:
https://stackoverflow.com/questions/35090838/no-implementation-found-for-long-org-opencv-core-mat-n-mat-error-using-opencv

Any clues? Thanks!

on CameraScreen.js line 56 :
https://github.com/brainhubeu/react-native-opencv-tutorial/blob/master/src/Screens/CameraScreen.js

where does blurryPhoto come from? I tried to mimic this function with modified method on RNOpenCvLibraryModule.java, but it returns nothing instead of boolean

sorry if this is a strange thing to ask

Even i capture blurred image, code is giving me as image is not blurred.

if (maxLap <= soglia) {
System.out.println("is blur image");
}

maxLap value is always -1 and greater than sogalia : int soglia = -6118750;

So I have to run downloadAndInsertOpenCV? or download from OpenCV website???

What do you mean with unzipped opencv archive?

5. Run `./downloadAndInsertOpenCV.sh`.
6. Download manually the Android pack from https://opencv.org/releases.html (version 3.4.1).
7. Unzip the package.
8. Import OpenCV to Android Studio, From File -> New -> Import Module, choose sdk/java folder in the unzipped opencv archive.

Hi guys, thanks for making this tutorial. I ran through the tutorial, cloned it and tried to make it run locally. However When I finished all of the steps as the tutorial instructed, I got the following error in Android studio:

Error:(29, 0) Could not find method compile() for arguments [project ':openCVLibrary341'] on object of type org.gradle.api.internal.artifacts.dsl.dependencies.DefaultDependencyHandler.

I'm new to react native and android development. Do you guys know how to fix this? Any ideas? Thanks!

BTW I'm using android studio 2.3.1 and buildtoolsversion is 26.0.1. If this helps

I followed the instructions. First I used latest OpenCV version which wouldn't let me add module dependency. So I downgraded to 3.4.1 and followed the instructions. However the app isn't building anymore.

> Task :app:mergeDexDebug FAILED

Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.2/userguide/command_line_interface.html#sec:command_line_warnings
197 actionable tasks: 2 executed, 195 up-to-date
D8: Cannot fit requested classes in a single dex file (# methods: 69475 > 65536 ; # fields: 67498 > 65536)
com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:
The number of method references in a .dex file cannot exceed 64K.
Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html
        at com.android.builder.dexing.D8DexArchiveMerger.getExceptionToRethrow(D8DexArchiveMerger.java:131)
        at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:118)
        at com.android.build.gradle.internal.transforms.DexMergerTransformCallable.call(DexMergerTransformCallable.java:102)
        at com.android.build.gradle.internal.tasks.DexMergingTaskRunnable.run(DexMergingTask.kt:444)
        at com.android.build.gradle.internal.tasks.Workers$ActionFacade.run(Workers.kt:335)
        at org.gradle.workers.internal.AdapterWorkAction.execute(AdapterWorkAction.java:57)
        at org.gradle.workers.internal.DefaultWorkerServer.execute(DefaultWorkerServer.java:63)
        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1.create(NoIsolationWorkerFactory.java:66)
        at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1.create(NoIsolationWorkerFactory.java:62)
        at org.gradle.internal.classloader.ClassLoaderUtils.executeInClassloader(ClassLoaderUtils.java:98)
        at org.gradle.workers.internal.NoIsolationWorkerFactory$1.lambda$execute$0(NoIsolationWorkerFactory.java:62)        
        at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:44)
        at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:41)
        at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:416)
        at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:406)
        at org.gradle.internal.operations.DefaultBuildOperationExecutor$1.execute(DefaultBuildOperationExecutor.java:165)       
        at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:250)
        at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:158)
        at org.gradle.internal.operations.DefaultBuildOperationExecutor.call(DefaultBuildOperationExecutor.java:102)
        at org.gradle.internal.operations.DelegatingBuildOperationExecutor.call(DelegatingBuildOperationExecutor.java:36)       
        at org.gradle.workers.internal.AbstractWorker.executeWrappedInBuildOperation(AbstractWorker.java:41)
        at org.gradle.workers.internal.NoIsolationWorkerFactory$1.execute(NoIsolationWorkerFactory.java:59)
        at org.gradle.workers.internal.DefaultWorkerExecutor.lambda$submitWork$2(DefaultWorkerExecutor.java:198)
        at java.util.concurrent.FutureTask.run(FutureTask.java:266)
        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runExecution(DefaultConditionalExecutionQueue.java:215)
        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runBatch(DefaultConditionalExecutionQueue.java:164)
        at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.run(DefaultConditionalExecutionQueue.java:131)
        at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511)
        at java.util.concurrent.FutureTask.run(FutureTask.java:266)
        at org.gradle.internal.concurrent.ExecutorPolicy$CatchAndRecordFailures.onExecute(ExecutorPolicy.java:64)
        at org.gradle.internal.concurrent.ManagedExecutorImpl$1.run(ManagedExecutorImpl.java:48)
        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)
        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)
        at org.gradle.internal.concurrent.ThreadFactoryImpl$ManagedThreadRunnable.run(ThreadFactoryImpl.java:56)
        at java.lang.Thread.run(Thread.java:748)
Caused by: com.android.tools.r8.CompilationFailedException: Compilation failed to complete
        at com.android.tools.r8.utils.t.a(:55)
        at com.android.tools.r8.D8.run(:11)
        at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:116)
        ... 33 more
Caused by: com.android.tools.r8.utils.AbortException: Error: null, Cannot fit requested classes in a single dex file (# methods: 69475 > 65536 ; # fields: 67498 > 65536)
        at com.android.tools.r8.utils.Reporter.a(:21)
        at com.android.tools.r8.utils.Reporter.a(:7)
        at com.android.tools.r8.dex.VirtualFile.a(:33)
        at com.android.tools.r8.dex.VirtualFile$h.a(:5)
        at com.android.tools.r8.dex.ApplicationWriter.a(:13)
        at com.android.tools.r8.dex.ApplicationWriter.write(:35)
        at com.android.tools.r8.D8.d(:44)
        at com.android.tools.r8.D8.b(:1)
        at com.android.tools.r8.utils.t.a(:23)
        ... 35 more


FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:mergeDexDebug'.
> A failure occurred while executing com.android.build.gradle.internal.tasks.Workers$ActionFacade
   > com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:
     The number of method references in a .dex file cannot exceed 64K.
     Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 9s

error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
D8: Cannot fit requested classes in a single dex file (# methods: 69475 > 65536 ; # fields: 67498 > 65536)

I get the following errors when I follow the steps for android:

$ react-native run-android
Scanning folders for symlinks in /PATH/react-native-opencv-tutorial/node_modules (21ms)
Starting JS server...
Building and installing the app on the device (cd android && ./gradlew installDebug)...
Incremental java compilation is an incubating feature.

FAILURE: Build failed with an exception.

• Where:
  Build file '/PATH/react-native-opencv-tutorial/node_modules/react-native-camera/android/build.gradle' line: 4

• What went wrong:
  A problem occurred evaluating project ':react-native-camera'.

Could not find method google() for arguments [] on repository container.

• Try:
  Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

BUILD FAILED

Total time: 33.879 secs
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html

React Native Project Version

 "dependencies": {
    "react": "16.13.1",
    "react-native": "0.63.2"
  },
  "devDependencies": {
    "@babel/core": "^7.8.4",
    "@babel/runtime": "^7.8.4",
    "@react-native-community/eslint-config": "^1.1.0",
    "babel-jest": "^25.1.0",
    "eslint": "^6.5.1",
    "jest": "^25.1.0",
    "metro-react-native-babel-preset": "^0.59.0",
    "react-test-renderer": "16.13.1"

OpenCV - 4.2.0

I followed the instructions as my project builds successfully in AndroidStudio. Even before I could consume the library in JS, I console logged OpenCV in UseEffect and get null. Ofcourse, I can't invoke any other method like CheckForBlurryImage etc. on a null.

I haven't integrated Camera or anything as I wanted to keep a minimal example and just ensure I get ReactNativeOpenCvLibrary instance before I start adding camera etc. Can you suggest where I might be getting wrong?
thanks

I've added my code to git repo
https://github.com/deepakaggarwal7/rnOpenCVtry

I tried to run app using debug mode in AndroidStudio and found following error:
dalvik.system.PathClassLoader[DexPathList[[zip file "/data/app/com.rnopencvtry-RYvO0hrGgWT_TpJUALbOqA==/base.apk"],nativeLibraryDirectories=[/data/app/com.rnopencvtry-RYvO0hrGgWT_TpJUALbOqA==/lib/x86, /data/app/com.rnopencvtry-RYvO0hrGgWT_TpJUALbOqA==/base.apk!/lib/x86, /system/lib]]] couldn't find "libopencv_info.so"
I don't know which library is libopencv_info.so as the downloaded zip from opencv inside jniLibs are libopencv_java4.so

With further debugging, I realized that missing info is in try/catch and I see native log
com.rnopencvtry D/SUCCESS: OpenCV loaded
which means OpenCV is loaded. There's no error thereafter. Still, by {NativeModules} is {} and hence, OpenCV is null.
Is there a step I'm missing which hooks OpenCV into React's {NativeModues}?

Would it be possible to include steps to build OpenCV in existing Xcode and Android Studio projects ?
I've already ran the downloadAndInsertOpenCV.sh script. it worked well.
I have an existing react native project where I would like to include OpenCV compilation.
Thanks in advance.

Can I use canny algorithm? I need remove background and I want to recognize the contours and then remove the background

1. Not able to compile project as It gives lots of pom files missing.(see snapshot)
2. some of the packages are not available in google and maven repos.(see snapshots)

please give updated packages and we need solution in react native side. Its really hard to make such kind of project most of in native side.

Is there any possible way of adding my existing pyhton-opencv code like this?