No exit button once camera is up and scanning. How can I cancel without scanning?

[cyrushandwriting]

` await BarcodeScanner.hideBackground(); // make background of WebView transparent

document.documentElement.style.opacity = '0'; // hideBackground() is not working on iOS

document.documentElement.style.visibility = 'hidden';

document.documentElement.style.display = 'none';

const result = await BarcodeScanner.startScan(); // start scanning and wait for a result

document.documentElement.style.opacity = '100%';

document.documentElement.style.visibility = 'visible';

document.documentElement.style.display = 'block';`

Hi this is what we do so that it works on both IOS and android.  However it goes into full camera mode with nothing to cancel it if the user decides to abandon barcode scanning.   Any ideas how to handle this?

[Duarte10]

Also, if the user uses the back button, it exits the app, can this be controlled in the BarcodeScanner side to call the stopScan?

[DiogoParrinha]

Hello,

You can follow this: https://github.com/capacitor-community/barcode-scanner/issues/26#issuecomment-808862821

And then apply a scanner ui inside the div:

<div class="scanner-ui">
    <ion-header translucent>
      <ion-toolbar>
        <ion-buttons slot="end">
          <ion-button (click)="cancelScanning()">Cancel</ion-button>
        </ion-buttons>
      </ion-toolbar>
    </ion-header>
</div>

and cancelScanning could be

    cancelScanning() {
        document.body.classList.remove("qrscanner");
        BarcodeScanner.showBackground();
        BarcodeScanner.stopScan();
    }

[thegnuu]

I will close this issue since the Plugin comes with no UI by definition. This is currently not really well documented and some basic examples would make sense, but I just became a maintainer of this repo and it will take me a while to update the docs and add some examples.