cordova-plugin-qrscanner
cordova-plugin-qrscanner copied to clipboard
Change scan area
By default the QR needs to be fairly centered into the preview to be scanned but I am putting an overlay on top of it. Is it possible to change the center for scanning or any other way to make the plugin scan a not centered QR?
I was facing the same issue. The easiest workaround I found (for Android) was to tweak the setupCamera() function in QRScanner.java
.
Because the decode happens from approximately the mid-one-third of the screen, the trick is to relatively shift this center region by changing the height value
of the cameraPreviewParams
in the function.
If you look at my implementation, I am using the DisplayMetrics
to find the height of the screen and then halving it to display the camera preview only in the top half of the screen. This effectively also shifts the decode area further up the screen. Use this height value in cameraPreviewParams
.
Though this may not be ideal solution, it was easiest workaround I found (though I had to wreck my head many days as I do not know Java and the Android API) and it works flawlessly for me.
Note: Yes, you will need to create your own fork of this project and use it in your application.
@james11a Can you help me show steps to how can I use your implementation to use this plugin ?
@james11a Can you help me show steps to how can I use your implementation to use this plugin ?
@ayubUOL
Below are the steps for an Ionic project
- Create your own fork of this project
- Make the changes I mentioned to the
QRScanner.java
file. Here's how the diff looks like: https://editor.mergely.com/srZ6osB5/ - Import the fork instead of this into your project:
yarn add https://github.com/james11a/cordova-plugin-qrscanner.git
. Don't use my fork, I might end up deleting it some day. - Rest, follow the steps mentioned in the ionic doc: https://ionicframework.com/docs/native/qr-scanner