Doc Scanner Plugin

Description

The Document Scanner Plugin converts your device camera into an efficient scanner.

Test app:

https://bubble.io/page?name=index&id=scannerplugin&tab=tabs-1

Demo:

https://scannerplugin.bubbleapps.io/version-test

Elements:

  • Camera Feed: This element serves as the video stream container for viewing the document you want to capture.

Actions:

  • Begin Scanning: Initiates the document scanning process, activating the camera to capture images.
  • Capture Image: Captures an image using the device's camera for the document scanning process.
  • Export Image to PDF: Exports an image to PDF.
  • End Scanning: Stops the document scanning process, deactivating the camera.

States:

  • Scanner Result: The image of the scanned document; in other words, the output from the scanner.

Events:

  • On Scanning Done: This event is fired after the scanning process is complete, and the document has been captured and uploaded to S3.

Tip: Only trigger the End Scanning action on the On Scanning Done event to avoid calling it too early and interrupting the scanning process.

Instructions

Follow these three simple steps to use the Document Scanner Plugin:

  1. Add Camera Feed Element: Click and drag the Camera Feed element onto the canvas, placing it within a container element or directly on the page.
  2. Initiate Scanning: Trigger the Begin Scanning action to start the scanning process. This can be done when the page loads or in response to a button click, among other events.
  3. Capture Document Image: To capture an image of the document, trigger the Capture Image action. This action captures a still photo for processing.

Remember to use the End Scanning action to stop the scanning process. While you can trigger this action at any time, it's recommended to do so on the On Scanning Done event or as needed.

The scanned document is exposed through the Scanner Result state of the Camera Feed element.