General Example

Requirements #

cordova is a cross-platform app runtime that makes it easy to build web apps that run natively on iOS, Android and the web. To get started with building apps using cordova, you'll need to meet certain requirements:

1. Node.js and npm #

Ensure you have Node.js installed on your machine.

2. Text Editor or IDE #

Choose a text editor or an integrated development environment (IDE) for coding. Popular choices include Visual Studio Code, Atom, or any other editor of your preference.

3. Git #

Cordova projects are often managed with Git, so having Git installed on your machine is recommended.

4. Command Line Interface (CLI) #

Cordova commands are executed via the command line. Make sure you have a command line interface (CLI) installed and accessible on your system.

5. Mobile Development SDKs #

To build and run apps on specific platforms, you'll need the corresponding SDKs:

• For iOS development: Xcode (available on macOS)
• For Android development: Android Studio

6. Install Cordova #

                npm install -g cordova
            

7. Add Platforms #

                cordova platform add ios   
cordova platform add android
            

8. Open IDE and Start Coding #

Open your chosen IDE or text editor and start building your app using web technologies.

9. Build and Run #

Use Cordova commands to build and run your app on different platforms.

                cordova build ios   
cordova build android
            

Installation #

Install from npm #

Most users will use this method to install the plugin as it provides the easiest straight forward path to obtaining the software.

                cordova plugin add barkoder-cordova
            

Install Manually #

There will be situation where you would want to install it manually. In this case to install from a local folder you will need to follow these steps:

• Download zip
• Unpack zip file
• Rename folder to your liking (ex. barkoder-cordova)
• Move the folder to your liking but not in the project directory
• Finally:

                cordova plugin add “/your-path/barkoder-cordova”
            

Examples of using the plugin #

Angular #

In your ts file:

                declare var Barkoder: any;
import { BarkoderResult, BarcodeType } from 'plugins/barkoder-cordova-plugin/www/BarkoderConfig';

@ViewChild('barkoderView') barkoderViewRef!: ElementRef;

  constructor(private platform: Platform) {}

    ngAfterViewInit() {
    this.platform.ready().then(() => {
      Barkoder.registerWithLicenseKey("YOUR_LICENSE_KEY");
      setTimeout(() => {
        const boundingRect = this.barkoderViewRef.nativeElement.getBoundingClientRect() as DOMRect;
        Barkoder.initialize(
          Math.round(boundingRect.width),
          Math.round(boundingRect.height),
          Math.round(boundingRect.x),
          Math.round(boundingRect.y)
        );
        this.setBarkoderSettings();
        this.setActiveBarcodeTypes();
      }, 200);
    });
  }

   setActiveBarcodeTypes() {
    Barkoder.setBarcodeTypeEnabled(BarcodeType.qr, true);
    Barkoder.setBarcodeTypeEnabled(BarcodeType.code128, true);
    Barkoder.setBarcodeTypeEnabled(BarcodeType.ean13, true);
   }

   setBarkoderSettings() {
    Barkoder.setRegionOfInterestVisible(true);
    Barkoder.setRegionOfInterest(5, 5, 90, 90);
    Barkoder.setImageResultEnabled(true);
    Barkoder.setBarcodeThumbnailOnResultEnabled(true);
   }

   startScanning() {
    Barkoder.startScanning((data: any) => {
      console.log("startScanning results called");
      const barkoderResult = new BarkoderResult(data);
      if (barkoderResult) {
         barkoderResult.decoderResults.forEach((result, index) => {
            console.log(`Result ${index + 1}: ${result.textualData}`);
         });
      }
    }, (err: any) => {
      console.log(err);
    });
   }
            

In your HTML file add the barkoderView div id:

                <div id="barkoderView" #barkoderView >
            

In your scss file set the desired barkoderView height:

                #barkoderView {
   height: 400px;
}