How to add button inside scanning page of Barcode Scanner?


#1

Barcode Scanner add button inside scanning page


#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

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:


#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.