barKoder Installation Guide for Cordova Barcode Reader SDK

Requirements #

Apache Cordova is a cross-platform runtime that lets you build mobile apps using web technologies (HTML, CSS, JavaScript) and run them natively on iOS, Android, or the web. Before you start, ensure the following prerequisites are met:

1. Node.js and npm #

Cordova is installed through npm, which comes bundled with Node.js.

                node -v  
npm -v
            

2. Text Editor or IDE #

Choose an editor to write your code. Popular options include:

3. Git (Recommended) #

Cordova projects are often version-controlled using Git.

                git --version
            

4. Command Line Interface (CLI) #

Cordova commands are executed via your system’s terminal or command prompt.

5. Mobile Development SDKs #

Platform-specific SDKs are required to build and run apps:

• iOS: Xcode (macOS only)
• Android: Android Studio (cross-platform)

6. Verify Setup ( optional )  #

Once everything is installed, confirm your environment is ready:

                # Install Cordova globally
npm install -g cordova  

# Verify Cordova installation
cordova -v  

# Create a test project
cordova create myApp com.example.myapp MyApp  
cd myApp  

# Add platforms (optional)
cordova platform add ios  
cordova platform add android  

# Build the app to ensure everything works
cordova build

            

If you see no errors during the build, your setup is complete.

Cordova Project #

1. Install Cordova #

Install Cordova globally so you can access it from anywhere:

                npm install -g cordova
            

2. Add Platforms #

Add the platforms you want to build for:

                cordova platform add ios  
cordova platform add android
            

3. Start Building #

Open your preferred IDE or text editor and begin developing your app using standard web technologies (HTML, CSS, JavaScript). Cordova will wrap these files into native mobile apps.

4. Build and Run #

Use Cordova commands to compile and launch your app:

                cordova build ios  
cordova build android

            

This will generate platform-specific builds that you can test on emulators or physical devices.

Install #

                cordova plugin add barkoder-cordova
            

Install Manually #

If you would like 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”
            

Licensing #

Using the plugin #

Angular Example #

In your ts file:

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

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

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

  setBarkoderSettings() {
   Barkoder.setRegionOfInterestVisible(true);
   Barkoder.setRegionOfInterest(5, 5, 90, 90);
   Barkoder.setCloseSessionOnResultEnabled(false);
   Barkoder.setImageResultEnabled(true);
   Barkoder.setBarcodeThumbnailOnResultEnabled(true);
   Barkoder.setBeepOnSuccessEnabled(true);
   Barkoder.setPinchToZoomEnabled(true);
   Barkoder.setZoomFactor(2.0);
  }

  async startScanning() {
   const boundingRect = this.barkoderViewRef.nativeElement.getBoundingClientRect() as DOMRect;
   Barkoder.registerWithLicenseKey("your_license_key");
   await Barkoder.initialize(
       Math.round(boundingRect.width),
       Math.round(boundingRect.height),
       Math.round(boundingRect.x),
       Math.round(boundingRect.y))

   this.setBarkoderSettings();
   this.setActiveBarcodeTypes();

   Barkoder.startScanning((barkoderResult: any) => {
     console.log("Result: " + barkoderResult.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;
}