Cómo usar .NET MAUI para escáner de código QR

Introducción

Con el auge de las aplicaciones móviles que aprovechan los Códigos QR para una rápida recuperación de información, la necesidad de un escáner de Códigos QR eficiente y fácil de integrar, así como un escáner de Códigos de Barras .NET MAUI para escanear códigos de barras, está en aumento. .NET MAUI (Interfaz de Usuario de Aplicaciones Multiplataforma), el marco multiplataforma de Microsoft, proporciona un entorno unificado para crear aplicaciones en iOS, Android, macOS y Windows. Al escanear códigos QR en una aplicación .NET MAUI, los desarrolladores necesitan una biblioteca intuitiva y poderosa para gestionar el proceso.

IronQR es una biblioteca popular que permite a los desarrolladores generar y decodificar códigos QR de manera rápida, precisa y confiable. Este artículo te guiará a través de la integración de IronQR con .NET MAUI para construir un escáner de códigos QR y de barras que pueda funcionar perfectamente en múltiples plataformas.

Cómo implementar el escaneo de códigos QR utilizando IronQR

1. Crear proyecto .NET MAUI.

2. Instala el paquete NuGet de IronQR.

3. Configurar permisos para la cámara y el almacenamiento de archivos.

4. Implementando el escáner de códigos QR.

Introducción a IronQR para aplicaciones móviles .NET MAUI

IronQR es una potente y fácil de usar biblioteca que simplifica la generación y decodificación de códigos QR en aplicaciones .NET, incluidas las aplicaciones móviles .NET MAUI para la funcionalidad de escaneo de QR y código de barras. Proporciona soluciones rápidas y fiables para integrar la funcionalidad de escaneo de códigos QR y códigos de barras en plataformas como iOS, Android, macOS y Windows, lo cual es esencial para desarrollar aplicaciones móviles multiplataforma.

Características de IronQR for .NET MAUI Mobile Apps

a) Soporte Multiplataforma: Funciona perfectamente en las plataformas iOS, Android, macOS y Windows dentro de las aplicaciones MAUI.

b) Escaneo de códigos QR: Descifra de manera eficiente varios tipos de códigos QR (URLs, texto, información de contacto, etc.). También admite la lectura de múltiples códigos de barras con eficientes algoritmos de detección de códigos de barras.

c) Generación de Códigos QR: Esto permite la fácil generación de códigos QR a partir de datos como URL, textos y más.

d) Manejo de permisos de cámara: Gestiona automáticamente las solicitudes de permisos de cámara, simplificando el proceso de escaneo.

e) Alto Rendimiento: Escaneo y generación de códigos QR rápidos y fiables con un uso mínimo de recursos.

f) Configuraciones personalizables: Ofrece opciones de personalización para los parámetros de escaneo y la apariencia del código QR.

g) Integración Fácil: API sencilla y configuración mínima requerida para agregar escaneo y generación de códigos QR a tu aplicación .NET MAUI.

h) Manejo de Errores: Ofrece mensajes de error detallados y resolución de problemas, garantizando un funcionamiento fluido en diversos escenarios.

i) Sin dependencias externas: IronQR opera de manera independiente, reduciendo la necesidad de bibliotecas de terceros o configuraciones complejas, a diferencia del escáner de códigos de barras ZXing.

j) Compatibilidad con Múltiples Formatos: Soporta múltiples formatos de códigos QR, asegurando compatibilidad con una amplia gama de códigos QR utilizados en el mundo real.

Requisitos previos

Antes de proceder con la implementación, asegúrese de tener los siguientes requisitos previos:

1. Visual Studio 2022 o posterior instalado.

2. SDK de .NET 6.0 o posterior (ya que .NET MAUI está construido sobre .NET 6 y versiones posteriores).

3. Paquete NuGet de IronQR para escaneo de códigos QR y detección de códigos de barras.

4. Aplicación .NET MAUI (Puede crear una nueva aplicación MAUI en Visual Studio si aún no tiene una).

Paso 1: Crear un proyecto .NET MAUI

Para empezar, vamos a crear un proyecto simple de .NET MAUI:

1. Abre Visual Studio y haz clic en Crear un nuevo proyecto.

2. Seleccione la plantilla .NET MAUI App.

   Nuevo Proyecto

3. Nombre el proyecto (por ejemplo, MauiQRCodeScanner), seleccione una ubicación y haga clic en Siguiente.

   

   \

   Seleccione la versión de .NET requerida y haga clic en Crear.

   

Paso 2: Instale el paquete NuGet de IronQR

IronQR es una biblioteca de terceros que proporciona funcionalidades de generación y escaneo de códigos QR. Para instalar IronQR, necesitas agregarlo a través de NuGet:

1. En Visual Studio, haz clic derecho en las Dependencies en tu Explorador de Soluciones.

2. Haga clic en Administrar paquetes de NuGet.

3. En la pestaña Examinar, busca IronQR y haz clic en Instalar en el paquete correspondiente (generalmente IronQR o IronQR.Maui si está específicamente disponible para MAUI).

4. Acepte cualquier licencia y asegúrese de que la biblioteca se instale.

   

Paso 3: Configure los permisos para la cámara y el almacenamiento de archivos

Para que tu aplicación pueda escanear códigos QR, necesitarás solicitar permisos de cámara en plataformas móviles (iOS y Android). A continuación se muestra cómo puede agregar los siguientes permisos dentro.

Dispositivo Android: En el archivo AndroidManifest.xml, añade el permiso de cámara:
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />

iOS: En el archivo Info.plist, añade la descripción del uso de la cámara:
<key>NSCameraUsageDescription</key>
<string>Necesitamos acceso a tu cámara para escanear códigos QR.</string>

Paso 4: Implementación del escáner de código QR

Ahora, vamos a crear una interfaz de usuario simple para nuestro escáner de QR en la aplicación de escáner de códigos de barras de MAUI. Usaremos un botón para iniciar el proceso de escaneo y una etiqueta para mostrar el texto del código QR escaneado.

Edita el archivo MainPage.xaml en el espacio de nombres XML.

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"

             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

x:Class="MauiQRCodeScanner.MainPage">
<StackLayout Padding="20" VerticalOptions="Center">
        <Button x:Name="scanButton" Text="Scan QR Code" Clicked="OnScanButtonClicked" />
        <Label x:Name="resultLabel" Text="Scan Result will appear here" HorizontalOptions="Center" VerticalOptions="CenterAndExpand"/>
    </StackLayout>
</ContentPage>

Ahora, en el archivo MainPage.xaml.cs, manejarás los permisos de la cámara y la lógica de escaneo del código QR. Aquí se muestra cómo implementarlo:

using IronQrCode;
using Microsoft.Maui.Controls;
using Microsoft.Maui.Essentials;

namespace MauiQRCodeScanner;

public partial class MainPage : ContentPage
{
    public MainPage()
    {
    License.LicenseKey = "Your key";
        InitializeComponent();
    }

// OnScanButtonClicked method with object sender as input
    private async void OnScanButtonClicked(object sender, EventArgs e)
    {
        // Check for camera permission for var barcode with clear and valid reason
        var status = await Permissions.RequestAsync<Permissions.Camera>();
        if (status != PermissionStatus.Granted)
        {
            await DisplayAlert("Permission Denied", "Cannot scan QR codes without camera permission", "OK");
            return;
        }

        // Start scanning QR codes
        try
{
        var images = await FilePicker.Default.PickAsync(new PickOptions
        {
           PickerTitle = "Pick image",
          FileTypes = FilePickerFileType.Images
        });
        var imageSource = images.FullPath.ToString();
        // barcodeImage.Source = imageSource;

        var inputBmp = AnyBitmap.FromFile(imageSource);
        // Load the asset into QrImageInput
        QrImageInput imageInput = new QrImageInput(inputBmp);

        // Create a QR Reader object
        QrReader reader = new QrReader();

        // Read the input and get all embedded QR Codes
        IEnumerable<QrResult> results = reader.Read(imageInput);

        if (results.Any())
        {
            resultLabel.Text = "Scanned Text: " + results.First().Value; 
            // Display the result
        }
        else
        {
            resultLabel.Text = "No QR code detected";
        }
    }
    catch (Exception ex)
    {
           resultLabel.Text = "Error: " + ex.Message;
    }
    }
}

using IronQrCode;
using Microsoft.Maui.Controls;
using Microsoft.Maui.Essentials;

namespace MauiQRCodeScanner;

public partial class MainPage : ContentPage
{
    public MainPage()
    {
    License.LicenseKey = "Your key";
        InitializeComponent();
    }

// OnScanButtonClicked method with object sender as input
    private async void OnScanButtonClicked(object sender, EventArgs e)
    {
        // Check for camera permission for var barcode with clear and valid reason
        var status = await Permissions.RequestAsync<Permissions.Camera>();
        if (status != PermissionStatus.Granted)
        {
            await DisplayAlert("Permission Denied", "Cannot scan QR codes without camera permission", "OK");
            return;
        }

        // Start scanning QR codes
        try
{
        var images = await FilePicker.Default.PickAsync(new PickOptions
        {
           PickerTitle = "Pick image",
          FileTypes = FilePickerFileType.Images
        });
        var imageSource = images.FullPath.ToString();
        // barcodeImage.Source = imageSource;

        var inputBmp = AnyBitmap.FromFile(imageSource);
        // Load the asset into QrImageInput
        QrImageInput imageInput = new QrImageInput(inputBmp);

        // Create a QR Reader object
        QrReader reader = new QrReader();

        // Read the input and get all embedded QR Codes
        IEnumerable<QrResult> results = reader.Read(imageInput);

        if (results.Any())
        {
            resultLabel.Text = "Scanned Text: " + results.First().Value; 
            // Display the result
        }
        else
        {
            resultLabel.Text = "No QR code detected";
        }
    }
    catch (Exception ex)
    {
           resultLabel.Text = "Error: " + ex.Message;
    }
    }
}

Imports IronQrCode
Imports Microsoft.Maui.Controls
Imports Microsoft.Maui.Essentials

Namespace MauiQRCodeScanner

	Partial Public Class MainPage
		Inherits ContentPage

		Public Sub New()
		License.LicenseKey = "Your key"
			InitializeComponent()
		End Sub

	' OnScanButtonClicked method with object sender as input
		Private Async Sub OnScanButtonClicked(ByVal sender As Object, ByVal e As EventArgs)
			' Check for camera permission for var barcode with clear and valid reason
			Dim status = Await Permissions.RequestAsync(Of Permissions.Camera)()
			If status <> PermissionStatus.Granted Then
				Await DisplayAlert("Permission Denied", "Cannot scan QR codes without camera permission", "OK")
				Return
			End If

			' Start scanning QR codes
			Try
			Dim images = Await FilePicker.Default.PickAsync(New PickOptions With {
				.PickerTitle = "Pick image",
				.FileTypes = FilePickerFileType.Images
			})
			Dim imageSource = images.FullPath.ToString()
			' barcodeImage.Source = imageSource;

			Dim inputBmp = AnyBitmap.FromFile(imageSource)
			' Load the asset into QrImageInput
			Dim imageInput As New QrImageInput(inputBmp)

			' Create a QR Reader object
			Dim reader As New QrReader()

			' Read the input and get all embedded QR Codes
			Dim results As IEnumerable(Of QrResult) = reader.Read(imageInput)

			If results.Any() Then
				resultLabel.Text = "Scanned Text: " & results.First().Value
				' Display the result
			Else
				resultLabel.Text = "No QR code detected"
			End If
		Catch ex As Exception
			   resultLabel.Text = "Error: " & ex.Message
		End Try
		End Sub
	End Class
End Namespace

Ingresar código QR

Salida

Seleccione el código QR necesario o captúrelo desde la transmisión de la cámara.

El resultado se muestra en la interfaz de usuario como se indica a continuación.

Código Explicación

Permisos: Solicitamos permisos para la cámara utilizando Permissions.RequestAsync<Permissions.Camera>(). Si se deniega el permiso, se muestra una alerta al usuario.

Escáner IronQR: La clase IronQrCode.Scanner() se utiliza para escanear códigos QR. El método ScanAsync() inicia el escaneo, y el resultado se almacena en scanResult. El texto del código QR escaneado se muestra en el resultLabel.

Probando el escáner de códigos QR: Ahora, estás listo para probar el escáner de códigos QR. Cuando se ejecute la aplicación, al hacer clic en el botón "Escanear código QR" se iniciará el proceso de escaneo. Si un código QR válido está frente a la cámara, se decodificará y se mostrará en la pantalla.

IronQR License (Prueba Disponible)

IronQR funciona con una clave de licencia en el código de la aplicación móvil. Los desarrolladores pueden obtener fácilmente una licencia de prueba desde la página de licencias. Coloca la licencia en algún lugar del código como se muestra a continuación antes de usar la biblioteca IronQR.

License.LicenseKey = "Your License";

License.LicenseKey = "Your License";

License.LicenseKey = "Your License"

Conclusión

En este artículo, recorrimos el proceso de construir un escáner de código QR en una aplicación .NET MAUI utilizando IronQR. Comenzamos configurando una aplicación .NET MAUI, instalamos el paquete IronQR e implementamos la interfaz de usuario y la lógica de escaneo. IronQR hace que el escaneo de códigos QR en una aplicación .NET MAUI sea increíblemente simple y efectivo.

La biblioteca IronQR está diseñada para ser multiplataforma, asegurando que las aplicaciones construidas con .NET MAUI puedan acceder a la funcionalidad de Código QR de manera consistente en todos los dispositivos objetivo, ya sean teléfonos inteligentes, tabletas o sistemas de escritorio. IronQR también admite funciones como la gestión automática de permisos de cámara, lo que facilita la integración del escaneo de códigos QR sin la complicación de gestionar los permisos manualmente.

En resumen, IronQR for .NET MAUI permite a los desarrolladores implementar rápidamente funciones de escaneo y generación de códigos QR en sus aplicaciones móviles, agilizando el desarrollo y mejorando la experiencia del usuario en todas las plataformas.