Introducing: Capacitor Barcode Scanner Plugin

Since Ionic and OutSystems have joined forces, we’ve been excited to see how this change would impact Capacitor and our open source tools. Both companies support a large ecosystem of plugins, with a mix of ecosystem-specific plugins and ones that overlap between Ionic and OutSystems. As we work together, we aim to combine our ecosystems and provide the best possible experience, for both the Capacitor and OutSystems communities. In pursuit of that goal, we are thrilled to bring our first shared plugin to the Capacitor ecosystem as a core supported plugin.

Let’s dive into the new plugin and how to get started. 👇

Barcode Scanner plugin

The barcode scanner plugin is a relatively simple plugin providing a basic interface for scanning various different types of barcodes, QR codes, and more. The supported barcode types can be found detailed in the plugin documentation.

This single method plugin will return data when you successfully scan something. Scanning happens directly on the device and doesn’t require additional maintenance, so it’s ready to use. This plugin supports Android & iOS, and has a wide range of applications across various apps. 

This plugin is built on top of native libraries that enable us to ship the plugin to both ecosystems while maintaining a single codebase. This structure is a template that the Capacitor team will work through as we bring new and existing plugins to a wider audience.

Getting started

To add this new plugin, simply follow the below instructions:

npm install @capacitor/barcode-scanner
npx cap sync

Android 

On Android, this plugin requires updating the minimum target SDK for your application to 26. This is higher than the default version of 22 that ships with new Capacitor applications. You can make this change by changing the minSdkVersion value to 26 in your android/variables.gradle file.

ext {
    minSdkVersion = 26
}

You will need to modify the allprojects > repositories section in your android/build.gradle file to include the OutSystems repository. Your android/build.gradle file should look similar to this after adding the repository.

allprojects {
    repositories {
        google()
        mavenCentral()
        maven {
            url 'https://pkgs.dev.azure.com/OutSystemsRD/9e79bc5b-69b2-4476-9ca5-d67594972a52/_packaging/PublicArtifactRepository/maven/v1'
            name 'Azure'
            credentials {
                username = "optional"
                password = ""
            }
            content {
                includeGroup "com.github.outsystems"
            }
        }
    }
}

iOS

If building for iOS, add the NSCameraUsageDescription key to the Info.plist file, which will tell the user why the app needs permission to use the camera:

<key>NSCameraUsageDescription</key>
<string>The app enables the scanning of various barcodes.</string>

Coming next

Find this plugin and many more in our plugin directory, which makes it easier than ever to find Capacitor plugins, arming developers with the tools they need to build world-class applications with Capacitor.

We have additional new plugins already in progress that will be coming to the Capacitor ecosystem soon. We are excited to share these new plugin updates with you as they roll out, so stay tuned!