Implementing the Anyline Plugin

This section walks you through the steps in order to set up a view and work with Anyline plugins for your Android application.

Overview

The examples provided here are based on a simple meter scanning use case. A more detailed discussion can be found in the next section, as well in the API Reference.

Adding the ScanView to your Activity

Let’s create a new blank activity in your project and call it "ScanActivity".

The first step is to add the ScanView to the layout file of your Activity in order to embed it into the view. In our case, we’ll call it "scan_view".

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ScanActivity">

    <io.anyline2.view.ScanView
        android:id="@+id/scan_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

In the activity class file (ScanActivity.kt), You’ll now have access to the ScanView and are almost ready to configure your scanner.

Before we jump into the code, let’s first add a config file to your project.

If your module does not have an assets folder yet, right-click on your module, select New → Folder → Assets Folder
Right-click on your assets folder, select New → File and call it "meter_config.json"

Open the file and add the following code:

{
  "cameraConfig": {
    "captureResolution": "1080p"
  },
  "flashConfig": {
    "mode": "manual",
    "alignment": "top_right"
  },
  "viewPluginConfig": {
    "pluginConfig": {
      "id": "MyMeterPlugin",
      "meterConfig": {
        "scanMode": "auto_analog_digital_meter"
      },
      "cancelOnResult": true
    },
    "cutoutConfig": {
      "style": "rect",
      "alignment": "top",
      "strokeWidth": 2,
      "strokeColor": "FFFFFF",
      "cornerRadius": 4,
      "outerColor": "000000",
      "outerAlpha": 0.5,
      "feedbackStrokeColor": "0099FF",
      "width": 550,
      "maxWidthPercent": "90%",
      "maxHeightPercent": "90%",
      "ratioFromSize": {
        "width": 2.25,
        "height": 1
      }
    },
    "scanFeedbackConfig": {
      "style": "CONTOUR_RECT",
      "strokeColor": "0099FF",
      "strokeWidth": 2,
      "fillColor": "220099FF",
      "cornerRadius": 2,
      "redrawTimeout": 200,
      "animationDuration": 75,
      "blinkOnResult": true,
      "beepOnResult": true,
      "vibrateOnResult": true
    }
  }
}

You’ll find what each of the parameters means in the View Configuration section.

Initialize the ScanView

By this time, you should already have initialized the Anyline SDK with the license key for your application. For more details, please see Initialize the Anyline SDK.

Now it’s time to initalize the ScanView with that configuration.

In ScanActivity.kt, override the onCreate method as follows:

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    binding = ActivityScanBinding.inflate(layoutInflater)
    setContentView(binding.root)
    scanView = binding.scanView

    scanView.init("meter_config.json")
}

This will instantiate & configure all necessary objects and attach them to the ScanView automatically.

If you call scanView.scanViewPlugin, you’ll get the instance of your configured ScanViewPlugin. This property gives you a ViewPluginBase.

Handling Results

Once your plugin is configured, you can directly register to listen to events of the ScanView.ScanViewPlugin.ScanPlugin.

// once the scan view is initialized, we can hook on the plugin events
scanView.scanViewPlugin.apply {
    resultReceived = Event { data -> onResult.invoke(data)}
}

...

private val onResult: (ScanResult) -> Unit = {
    // do something with the result image
    val image = it.image;

    // do something with the meter result
    val meterScanResult = it.pluginResult.meterResult

    // do something with the result as a JSON object
    val json = it.result
}

Start scanning

A common scenario is to start the plugin on activity lifecycle resumed state.

override fun onResume() {
    super.onResume()
    //start scanning on Activity resume
    scanView.start()
}

Final things

Once your Activity is paused, you want to consider cleaning up resources. This includes closing the camera and more importantly, stoping the ScanView.

override fun onPause() {
    //stop scanning on Activity pause
    scanView.stop()
    super.onPause()
}

And voilá - That’s all it takes - You’re ready to scan now 👏🎉.

You can find the complete source code in our GitHub examples.