artydev / ZXingBlazor

Using ZXing Scan barcode/QR code in blazor

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

ZXing Blazor Component

English | 中文 | Orther demos


Introduction

This project is a Blazor component library packaged with ZXing

Demo

ssr https://zxingblazor.app1.es

wasm https://densen2014.github.io/

Nuget

https://www.nuget.org/packages/ZXingBlazor/

Step

_Imports.razor

@using ZXingBlazor.Components

Pages/_Host.cshtml , in wasm is: wwwroot/index.html

<script src="_content/ZXingBlazor/lib/barcodereader/zxing.js"></script>
<script src="_content/ZXingBlazor/lib/barcodereader/barcode.js"></script>

In your Blazor page

QQ图片20200926035359

Screenshot

ZXingBlazor

New Components

Handwritten 2020.10.05 Sign

Pages/_Host.cshtml , in wasm is: wwwroot/index.html

<script src="_content/ZXingBlazor/lib/handwritten/handwritten.js"></script>

Updates

2021-5-13 BarcodeReader supports defining button text and supports multiple languages

now support set button text: code https://github.com/densen2014/ZXingBlazor/blob/master/Demo.Server/Pages/IndexEN.razor demo https://zxingblazor.app1.es/

    <BarcodeReader ScanResult="((e) => { BarCode=e; ShowScanBarcode = !ShowScanBarcode; })"
                   ShowScanBarcode="ShowScanBarcode"
                   Close="(()=>ShowScanBarcode=!ShowScanBarcode)" 
                   ScanBtnTitle="Scan"
                   ResetBtnTitle="Reset"
                   CloseBtnTitle="Close"
                   SelectDeviceBtnTitle="Select Device"
                   />

barcode

Participate in contribution

  1. Fork this project
  2. Create new Feat_xxx branch
  3. Submit the code
  4. New Pull Request

About

Using ZXing Scan barcode/QR code in blazor

License:Apache License 2.0


Languages

Language:HTML 67.0%Language:JavaScript 16.0%Language:CSS 11.3%Language:C# 5.7%