Search code examples
androidcordovaphonegap-pluginsbarcode-scanner

Phonegap Build - Crossplatform BarcodeScanner integration

I'm developing a crossplatform application in HTML5/CSS/JS using Phonegap 5.1.1. I'm struggling to find a solution to integrate the official phonegap-plugin-barcodescanner, following the instructions which the official page on GitHub refers to. In detail, after building through Phonegap Build, I can't get rid of the Help page which appears as soon as I start the app on Android (see the attached image). This way I cannot test if everything's working fine.

Furthermore, I've found out there are loads of ways to initialize the plugin and I'd like to know whether I'm doing anything wrong. Here's the code in my page:

var scanner = cordova.require("cordova/plugin/BarcodeScanner");

scanner.scan(
    function (result) {
    alert("We got a barcode\n" +
          "Result: " + result.text + "\n" +
          "Format: " + result.format + "\n" +
          "Cancelled: " + result.cancelled);
    }, 
    function (error) {
        alert("Scanning failed: " + error);
    });

Finally, I've modified my config.xml as to include: <gap:plugin name="BarcodeScanner"/>

Any suggestions? Thanks in advance.

Solution

  • I found the solution myself. In case anyone is looking for a ready-to-use way to start, here's the way to go.

    If you're using Phonegap Build online service, you need not add any plugin via phonegap plugin add <plugin_name> (or cordova plugin add). It'll be sufficient to simply mimic the behavior of the official Phonegap BarcodeScanner Demo, particularly as regards the files:

    • <appname>/config.xml (referencing the plugin com.phonegap.plugins.barcodescanner);
    • <appname>/index.html (which includes the line <script src="barcodescanner.js" />);
    • <appname>/js/index.js (which contains the scan and encode methods, as well as their initialization).

    As soon as the app is built, Phonegap Build will inject the official plugin by itself within the package.