Giter Club home page Giter Club logo

razor-barcode-library's Introduction

Razor Barcode Library

A Razor Class Library, equipped with the Dynamsoft JavaScript Barcode SDK, enables the creation of web-based barcode reader and scanner applications entirely in C#.

Online Demo

https://yushulx.me/Razor-Barcode-Library/

Demo Video

dotnet-blazor-barcode-scanner.mp4

Prerequisites

Quick Usage

  • Import and initialize the Razor Barcode Library.

    @using RazorBarcodeLibrary
    
    protected override async Task OnInitializedAsync()
    {
        barcodeJsInterop = new BarcodeJsInterop(JSRuntime);
        await barcodeJsInterop.LoadJS();
    }
  • Set the license key and load the wasm module.

    await barcodeJsInterop.SetLicense('LICENSE-KEY');
    await barcodeJsInterop.LoadWasm();
  • Create a barcode reader instance.

    BarcodeReader reader = await barcodeJsInterop.CreateBarcodeReader();
  • Read barcodes from a base64 image source.

    List<BarcodeResult> results = await reader.DecodeBase64(imageSrc);
    string text = "";
    foreach (BarcodeResult result in results)
    {
        text += "format: " + result.Format + ", ";
        text += "text: " + result.Text + "<br>";
    }
  • Create a barcode scanner instance and set the callback function.

    @implements BarcodeScanner.ICallback
    
    BarcodeReader reader = await barcodeJsInterop.CreateBarcodeScanner();
    await scanner.RegisterCallback(this);
    
    public async Task OnCallback(List<BarcodeResult> results) {}
  • Open the camera and start scanning.

    <div id="videoContainer"></div>
    
    await scanner.SetVideoElement("videoContainer");
    List<Camera> cameras = await scanner.GetCameras();
    await scanner.OpenCamera(cameras[0]);

API

Camera Class

Represents a camera device with its device ID and label.

BarcodeResult Class

Represents the result of a barcode scan, including the decoded text, format, and positional details.

BarcodeJsInterop Class

Provides JavaScript interop functionalities for barcode operations.

  • Task LoadJS(): Loads and initializes the JavaScript module.
  • Task SetLicense(string license): Sets the license key for the barcode functionality.
  • Task LoadWasm(): Loads the WebAssembly for barcode processing.
  • Task<BarcodeReader> CreateBarcodeReader(): Creates a new BarcodeReader instance.
  • Task<BarcodeScanner> CreateBarcodeScanner(): Creates a new BarcodeScanner instance.
  • Task DrawCanvas(string id, int sourceWidth, int sourceHeight, List<BarcodeResult> results): Draws the barcode results on a specified canvas.
  • Task ClearCanvas(string id): Clears the specified canvas element.

BarcodeReader Class

Provides functionalities to decode barcodes from various sources such as Base64 strings and canvas objects.

  • Task<List<BarcodeResult>> DecodeBase64(string base64): Asynchronously decodes a barcode from a Base64 encoded string.
  • Task<List<BarcodeResult>> DecodeCanvas(IJSObjectReference canvas): Asynchronously decodes a barcode from a canvas object.
  • Task<string> GetParameters(): Asynchronously retrieves the current parameters of the barcode reader.
  • Task<int> SetParameters(string parameters): Asynchronously sets the parameters for the barcode reader.

BarcodeScanner Class

Provides functionalities for barcode scanning using a camera.

  • Task SetVideoElement(string videoId): Sets a div element as the video container.
  • Task OpenCamera(Camera camera): Opens the camera for barcode scanning.
  • Task CloseCamera(): Closes the current camera.
  • Task<List<Camera>> GetCameras(): Gets a list of available cameras.
  • Task RegisterCallback(ICallback callback): Registers a callback for handling barcode scan results.

Example

razor-barcode-library's People

Contributors

yushulx avatar

Watchers

 avatar  avatar

Forkers

webstorage119

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.