1. IronBarcode
2. Cómo Hacer
3. Lector y escáner de códigos de barras .NET MAUI

Escáner de código de barras .NET MAUI

Introducción

.NET MAUI (Interfaz de usuario de aplicaciones multiplataforma .NET)es un marco multiplataforma para crear aplicaciones multiplataforma sin problemas en una única base de código. Por ejemplo, puedes crear fácilmente aplicaciones de Microsoft Windows, iOS y Android en un solo proyecto. Lo que la diferencia de otras plataformas, frameworks y bibliotecas es la forma en que permite a la comunidad de desarrolladores utilizar los controles nativos en sus proyectos y les proporciona componentes adicionales. Como resultado, los desarrolladores pueden utilizar estos componentes y servicios prefabricados para construir las aplicaciones más rápidamente sin tener que escribir cada aspecto del código desde cero.

En este artículo, explicaremos cómo integrar IronBarcode en una aplicación de Windows .NET MAUI para escanear un código de barras o un código QR.

IronBarcode: Biblioteca de códigos de barras C

Para leer códigos de barras en nuestra aplicación, utilizaremos nuestra biblioteca IronBarcode .NET. Ofrece una API robusta y sencilla para la lectura de códigos de barras, lo que permite el desarrollo sin complicaciones ni necesidad de conocimiento en el dominio de los códigos de barras. Se puede instalar fácilmente con el administrador de paquetes NuGet.

IronBarcode admite una multitud de formatos de códigos de barras para lectura, incluyendo Code 39, Code 128, PDF417, entre muchos otros. Puede leer desde una variedad de formatos de datos como archivos de imagen, flujos de memoria y PDFs.

Pasos para leer códigos de barras en una aplicación .NET MAUI

Siga estos pasos para leer un código de barras en una aplicación .NET MAUI.

Requisitos previos

1. Visual Studio 2022

2. Un proyecto .NET MAUI en Visual Studio

Instalar la librería IronBarcode

Podemos instalar la biblioteca IronBarcode utilizando la Consola del Administrador de Paquetes de NuGet. Para abrir esta consola en Visual Studio, navega a Herramientas > Administrador de paquetes NuGet > Consola del Administrador de paquetes. A continuación, escribe el siguiente comando en la consola:

Install-Package BarCode

Este comando de consola descargará la última versión de la librería IronBarcode en el proyecto MAUI. Alternativamente, también podrías buscar la última versión del paquete NuGet en el Sitio web de NuGet.

Front-End

El primer paso será crear el diseño del front-end. Para esto, crearemos un diseño que consiste en dos botones, un área de texto y un cuadro de imagen. Un botón servirá para seleccionar el código de barras y otro para copiar el texto del código de barras. El cuadro Imagen mostrará la imagen seleccionada.

Sustituya el contenido del archivo MainPage.xaml por lo siguiente:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MAUI_Barcode.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Button
                x:Name="ImageSelect"
                Text="Select Barcode"
                SemanticProperties.Hint="Select Image"
                Clicked="SelectBarcode"
                HorizontalOptions="Center" />
            <Image
                x:Name="barcodeImage"
                SemanticProperties.Description="Selected Barcode"
                HeightRequest="200"
                HorizontalOptions="Center" />
            <Editor x:Name="outputText"
                Placeholder="Output text"
                HeightRequest="100"
                WidthRequest="500" />
            <Button
                x:Name="copyText"
                Text="Copy"
                SemanticProperties.Hint="Copy Text"
                WidthRequest="150"
                Clicked="CopyEditorText"
                HorizontalOptions="Center" />

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MAUI_Barcode.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Button
                x:Name="ImageSelect"
                Text="Select Barcode"
                SemanticProperties.Hint="Select Image"
                Clicked="SelectBarcode"
                HorizontalOptions="Center" />
            <Image
                x:Name="barcodeImage"
                SemanticProperties.Description="Selected Barcode"
                HeightRequest="200"
                HorizontalOptions="Center" />
            <Editor x:Name="outputText"
                Placeholder="Output text"
                HeightRequest="100"
                WidthRequest="500" />
            <Button
                x:Name="copyText"
                Text="Copy"
                SemanticProperties.Hint="Copy Text"
                WidthRequest="150"
                Clicked="CopyEditorText"
                HorizontalOptions="Center" />

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

Todos los elementos están en una pila vertical con la posición central. Puedes cambiarlo según tus preferencias.

Escaneado de códigos de barras con IronBarcode

Esta sección describirá el código para escanear códigos de barras utilizando la librería IronBarcode. En primer lugar, utilizaremos un FilePicker para seleccionar el archivo y especificar el tipo de archivo de la imagen. A continuación, utilizaremos la propiedad FullPath para recuperar la ruta del archivo de imagen y luego establecer la fuente de la caja de imagen al valor FullPath. Por último, utilizaremos el valor path en la función Read del BarcodeReader para recuperar el texto.

private async void SelectBarcode(object sender, EventArgs e)
{
    var images = await FilePicker.Default.PickAsync(new PickOptions
    {
    PickerTitle = "Pick image",
    FileTypes = FilePickerFileType.Images
    });
    var imageSource = images.FullPath.ToString();
    barcodeImage.Source = imageSource;
    var result = BarcodeReader.Read(imageSource).First().Text;
    outputText.Text = result;
}

private async void SelectBarcode(object sender, EventArgs e)
{
    var images = await FilePicker.Default.PickAsync(new PickOptions
    {
    PickerTitle = "Pick image",
    FileTypes = FilePickerFileType.Images
    });
    var imageSource = images.FullPath.ToString();
    barcodeImage.Source = imageSource;
    var result = BarcodeReader.Read(imageSource).First().Text;
    outputText.Text = result;
}

Private Async Sub SelectBarcode(ByVal sender As Object, ByVal e As EventArgs)
	Dim images = Await FilePicker.Default.PickAsync(New PickOptions With {
		.PickerTitle = "Pick image",
		.FileTypes = FilePickerFileType.Images
	})
	Dim imageSource = images.FullPath.ToString()
	barcodeImage.Source = imageSource
	Dim result = BarcodeReader.Read(imageSource).First().Text
	outputText.Text = result
End Sub

El código que se muestra a continuación se utilizará para copiar el texto del editor de texto y mostrar un mensaje de alerta al usuario de que el texto se ha copiado.

private async void CopyEditorText (object sender, EventArgs e)
{
    await Clipboard.SetTextAsync(outputText.Text);
    await DisplayAlert("Success", "Text is copied!", "OK");
}

private async void CopyEditorText (object sender, EventArgs e)
{
    await Clipboard.SetTextAsync(outputText.Text);
    await DisplayAlert("Success", "Text is copied!", "OK");
}

Private Async Sub CopyEditorText(ByVal sender As Object, ByVal e As EventArgs)
	Await Clipboard.SetTextAsync(outputText.Text)
	Await DisplayAlert("Success", "Text is copied!", "OK")
End Sub

Puedes encontrar el código fuente del proyecto en este artículo en GitHub.

Salida

Después de ejecutar el proyecto, verás la siguiente salida. La imagen no se muestra porque aún no está seleccionada.

Salida cuando no hay ninguna imagen seleccionada

Cuando se selecciona el código de barras, se mostrará como en la siguiente captura de pantalla, y el texto de salida del código QR se mostrará en el editor.

Salida después de seleccionar la imagen

Al hacer clic en el botón Copiar, aparecerá la ventana de alerta mencionada anteriormente.

Alerta de copia

Conclusión

En este artículo, explicamos cómo podemos leer códigos de barras en una aplicación .NET MAUI utilizando IronBarcode. Como lector de códigos QR, IronBarcode funciona muy bien: proporciona exactamente el resultado esperado. Además, puede leer códigos de barras que son difíciles de leer. También puede crear y personalizar los códigos de barras utilizando diferentes fuentes. Obtenga más tutoriales sobre IronBarcode desde aquíenlace.

IronBarcode debe estar licenciado para su uso en desarrollo y comercial. Puede encontrar más información sobre licencias.aquí.