Enterprise-level component library based on Bootstrap and Blazor

star nuget license download repo commit master coverage

BarcodeReader

This component scans the bar code by calling the camera to obtain the bar code content bar code/QR code

Pay special attention to:

  • The site wants to enable https , which is required by browser vendors
  • The site wants to enable https , which is required by browser vendors
  • The site wants to enable https , which is required by browser vendors
  • The bar code recognition rate is related to the pixel, bar code size and mobile phone execution efficiency

The code is identified by the camera

Demo

How to do this:

  • Tap to start turning on the camera
  • Scan the barcode
  • Click the close button to turn off the camera

Scan code recognition with still pictures

Demo

How to do this:

  • Click the code to pop up the selection file box
  • Select a picture that contains barcodes
  • Start recognizing barcodes

Turn on the camera automatically by setting the AutoStart parameter settings

Demo

How to do this:

  • Click the code to pop up the selection file box
  • Select a picture that contains barcodes
  • Start recognizing barcodes

Attributes

Loading...
@page "/barcodereaders"
@inject IStringLocalizer<BarcodeReaders> Localizer

<h3>BarcodeReader</h3>

<h4>This component scans the bar code by calling the camera to obtain the bar code content bar code/QR code</h4>

<p><b>Pay special attention to:</b></p>
<ul class="ul-demo">
    <li>@((MarkupString)Localizer["Li1"].Value )</li>
    <li>@((MarkupString)Localizer["Li1"].Value )</li>
    <li>@((MarkupString)Localizer["Li1"].Value )</li>
    <li>The bar code recognition rate is related to the pixel, bar code size and mobile phone execution efficiency</li>
</ul>

<DemoBlock Title="Basic usage" Introduction="The code is identified by the camera" Name="Normal">
    <p>How to do this:</p>
    <ul class="ul-demo">
        <li>Tap to start turning on the camera</li>
        <li>Scan the barcode</li>
        <li>Click the close button to turn off the camera</li>
    </ul>
    <BarcodeReader OnInit="@OnInit" OnResult="@OnResult" OnStart="@OnStart" OnClose="@OnClose" OnError="@OnError" />
    <BlockLogger @ref="Trace" class="mt-3" />
</DemoBlock>

<DemoBlock Title="Basic usage" Introduction="Scan code recognition with still pictures" Name="Image">
    <p>How to do this:</p>
    <ul class="ul-demo">
        <li>Click the code to pop up the selection file box</li>
        <li>Select a picture that contains barcodes</li>
        <li>Start recognizing barcodes</li>
    </ul>
    <BarcodeReader ScanType="@ScanType.Image" OnResult="@OnImageResult" OnError="@OnImageError" />
    <BlockLogger @ref="Trace2" class="mt-3" />
</DemoBlock>

<DemoBlock Title="Start automatically" Introduction="Turn on the camera automatically by setting the <code> AutoStart </code> parameter settings" Name="AutoStart">
    <p>How to do this:</p>
    <ul class="ul-demo">
        <li>Click the code to pop up the selection file box</li>
        <li>Select a picture that contains barcodes</li>
        <li>Start recognizing barcodes</li>
    </ul>
    <BarcodeReader OnResult="@OnImageResult" OnError="@OnImageError" AutoStart="true" />
    <BlockLogger @ref="Trace2" class="mt-3" />
</DemoBlock>

<AttributeTable Items="@GetAttributes()" />
// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/

using BootstrapBlazor.Components;
using BootstrapBlazor.Shared.Common;
using BootstrapBlazor.Shared.Components;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace BootstrapBlazor.Shared.Samples;

/// <summary>
/// 
/// </summary>
public sealed partial class BarcodeReaders
{
    private BlockLogger? Trace { get; set; }

    private BlockLogger? Trace2 { get; set; }

    private Task OnInit(IEnumerable<DeviceItem> devices)
    {
        var cams = string.Join("", devices.Select(i => i.Label));
        Trace?.Log($"{Localizer["InitLog"]} {cams}");
        return Task.CompletedTask;
    }

    private Task OnImageResult(string barcode)
    {
        Trace2?.Log($"{Localizer["ScanCodeLog"]} {barcode}");
        return Task.CompletedTask;
    }

    private Task OnImageError(string err)
    {
        Trace2?.Log($"{Localizer["ErrorLog"]} {err}");
        return Task.CompletedTask;
    }

    private Task OnResult(string barcode)
    {
        Trace?.Log($"{Localizer["ScanCodeLog"]} {barcode}");
        return Task.CompletedTask;
    }

    private Task OnError(string error)
    {
        Trace?.Log($"{Localizer["ErrorLog"]} {error}");
        return Task.CompletedTask;
    }

    private Task OnStart()
    {
        Trace?.Log(Localizer["OpenCameraLog"]);
        return Task.CompletedTask;
    }

    private Task OnClose()
    {
        Trace?.Log(Localizer["CloseCameraLog"]);
        return Task.CompletedTask;
    }

    /// <summary>
    /// 获得属性
    /// </summary>
    /// <returns></returns>
    private IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
    {
            new AttributeItem()
            {
                Name = "ButtonScanText",
                Description = Localizer["ButtonScanText"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = Localizer["ButtonScanTextDefaultValue"]
            },
            new AttributeItem()
            {
                Name = "ButtonStopText",
                Description = Localizer["ButtonStopText"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = Localizer["ButtonStopTextDefaultValue"]
            },
            new AttributeItem()
            {
                Name = "AutoStopText",
                Description = Localizer["AutoStopText"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = Localizer["AutoStopTextDefaultValue"]
            },
            new AttributeItem()
            {
                Name = "DeviceLabel",
                Description = Localizer["DeviceLabel"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = Localizer["DeviceLabelDefaultValue"]
            },
            new AttributeItem()
            {
                Name = "InitDevicesString",
                Description = Localizer["InitDevicesString"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = Localizer["InitDevicesStringDefaultValue"]
            },
            new AttributeItem()
            {
                Name = "NotFoundDevicesString",
                Description = Localizer["NotFoundDevicesString"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = Localizer["NotFoundDevicesStringDefaultValue"]
            },
            new AttributeItem()
            {
                Name = "AutoStart",
                Description = Localizer["AutoStart"],
                Type = "boolean",
                ValueList = "true|false",
                DefaultValue = "false"
            },
            new AttributeItem()
            {
                Name = "AutoStop",
                Description = Localizer["AutoStart"],
                Type = "boolean",
                ValueList = "true|false",
                DefaultValue = "false"
            },
            new AttributeItem()
            {
                Name = "ScanType",
                Description = "",
                Type = "ScanType",
                ValueList = "Camera|Image",
                DefaultValue = "Camera"
            },
            new AttributeItem()
            {
                Name = "OnInit",
                Description = Localizer["OnInit"],
                Type = "Func<IEnumerable<Camera>, Task>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem()
            {
                Name = "OnResult",
                Description = Localizer["OnResult"],
                Type = "Func<string, Task>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem()
            {
                Name = "OnStart",
                Description = Localizer["OnStart"],
                Type = "Func<Task>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem()
            {
                Name = "OnClose",
                Description = Localizer["OnClose"],
                Type = "Func<Task>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem()
            {
                Name = "OnError",
                Description = Localizer["OnError"],
                Type = "Func<string, Task>",
                ValueList = " — ",
                DefaultValue = " — "
            }
    };
}

B 站相关视频链接

暂无

交流群

QQ Group:BootstrapAdmin & Blazor 795206915 675147445 Welcome to join the group discussion
Themes
Bootstrap
Motronic
Ant Design (完善中)
LayUI (完善中)
An error has occurred. This application may no longer respond until reloaded. Reload