How to add button inside scanning page of Barcode Scanner?

Ionic Native
1

Barcode Scanner add button inside scanning page

win
win.jpg1417Ă—2376 699 KB

1 Like
2

Is this a picture of your app how it looks like now or what it should look like?
What “Barcode Scanner” are you referring to?

3

Now, auto scanning page looks like

qrcode
qrcode.png768Ă—1024 602 KB
i want to add button in this scanning page.:grinning:

4

Then you have the code that produces this view. But you still didn’t mention which plugin or library you are using to do that.

5

I used all code,

$ ionic cordova plugin add phonegap-plugin-barcodescanner
$ npm install --save @ionic-native/barcode-scanner

<button ion-button round outline (click)=“scanQR()”>QR Code Scanner

public scanQR() {
this.buttonText = “Loading…”;
this.loading = true;
this.options = {
formats: “QR_CODE”,
//prompt : “Place the code in the center of the square.”+ “\n”+ " It will be scanned automatically",
}
this._barcodeScanner.scan(this.options).then((barcodeData) => {

  if (barcodeData.cancelled) {
    console.log("User cancelled the action!");
    this.buttonText = "Scan";
    this.loading = false;
    return false;
  }
  console.log("Scanned successfully!");
  console.log(barcodeData);
  this.scannedText = barcodeData.text;

  this.navCtrl.push(ScanQrDetailPage, {
    data: this.scannedText
  });

}, (err) => {
  console.log(err);
});

}

:grinning::grinning::grinning:

1 Like
6

Ok so you are talking about https://ionicframework.com/docs/native/barcode-scanner/ (I fixed your topic category to the correct one)

That uses the Cordova plugin https://github.com/phonegap/phonegap-plugin-barcodescanner in the background. You can see there this only has some minor customization options.

To add a button you would probably have to fork the plugin and edit the native code for iOS and Android.

1 Like
7

did you find the way to do it mate? ı am looking for the exactly same thing, a back button (modal close button) on this barcode page view