How to Build a .NET MAUI Barcode Scanner Using IronBarcode

Barcode scanning is an essential feature in many modern applications, from retail and inventory management to ticketing systems and logistics. By automating the barcode reading process, businesses can streamline operations, reduce manual errors, and enhance efficiency. In this tutorial, we'll show you how to integrate a powerful barcode scanner into a .NET MAUI application, capturing barcodes directly from your device camera.

.NET MAUI (Multi-platform App UI) is Microsoft’s cross-platform framework that allows you to build applications for iOS, Android, Windows, and macOS with a single codebase. With .NET MAUI, developing mobile applications is easier than ever, offering native access to device features and a responsive UI design.

In this article, we’ll guide you through creating a barcode scanner using IronBarcode, a robust .NET library for barcode generation and reading. IronBarcode simplifies barcode operations, allowing you to scan a wide range of barcodes with minimal setup and code. This tutorial will walk you through the entire process, from setting up the project to implementing barcode reading functionality.

Prerequisites

Before diving in, make sure you have:

1. Visual Studio 2022 with .NET MAUI workload installed.
2. A basic understanding of C# and .NET MAUI.

Step 1: Setting Up the .NET MAUI Project

1. Open Visual Studio 2022 and create a new .NET MAUI App project.
2. Name your project BarcodeScannerApp and select a location to save it.
3. Select .NET 8 as the target framework for the latest features and compatibility.

Step 2: Installing IronBarcode

IronBarcode is designed to make barcode reading easy and accessible for .NET applications, supporting a wide array of barcode types and use cases. Its ability to quickly interpret barcode data, combined with advanced error handling, makes it a great choice for mobile applications where speed and accuracy are essential.

To add IronBarcode to your project:

1. Open the NuGet Package Manager by right-clicking on the project and selecting Manage NuGet Packages.
2. Search for IronBarcode and install it.

Step 3: Creating the UI for Barcode Scanning

Let’s create a simple UI that includes a button to capture an image, a display area for the captured image, and a label for showing the barcode result.

In MainPage.xaml, add the following XAML code:

<?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="BarcodeScannerApp.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">
            <Label
    Text="Barcode Scanner APP"
    Style="{StaticResource Headline}"
    SemanticProperties.HeadingLevel="Level1" />

            <Image x:Name="barcodeImage"
                Source="dotnet_bot.png"
                HeightRequest="185"
                Aspect="AspectFit"
                SemanticProperties.Description="Barcode Scanner App" />



            <Label x:Name="barcodeResult"
                Text="Barcode Result"
                Style="{StaticResource SubHeadline}"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to Barcode Scanner App" />

            <Button
                x:Name="scanBarcode"
                Text="Scan Barcode" 
                SemanticProperties.Hint="Scan Barcode"
                Clicked="OnScanButtonClicked"
                HorizontalOptions="Fill" />
        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

This XAML code defines the user interface for a .NET MAUI Barcode Scanner App. It uses a ContentPage with a ScrollView containing a VerticalStackLayout for organized, vertical arrangement.

1. A Label displays the app's title, styled as a headline.

2. An Image named barcodeImage is set with a placeholder source (dotnet_bot.png) and serves to display the barcode image captured later.

3. Another Label named barcodeResult is used to show the result of the scanned barcode.

4. A Button named scanBarcode is provided for users to trigger barcode scanning by invoking the OnScanButtonClicked event handler.

5. Accessibility features, like semantic descriptions and hints, are included to enhance usability for screen readers.

Our UI will look like below:

Barcode Scanner UI:

Step # 4: Implementing the Barcode Scanner Logic

Now, let’s implement the logic to capture a photo and scan the barcode using IronBarcode.

Import the required namespaces:

using IronBarCode;
using IronSoftware.Drawing;

Add the OnScanButtonClicked event handler:

private async void OnScanButtonClicked(object sender, EventArgs e)
{
    try
    {
        // Use MediaPicker to capture an image
        var photo = await MediaPicker.Default.CapturePhotoAsync();

        if (photo == null)
            return;

        // Set the IronBarcode License Key
        License.LicenseKey = "YOUT-LICENSE-KEY"; // Get your free trial key from https://ironsoftware.com/


        using var stream = await photo.OpenReadAsync();
        byte[] imageBytes;
        using (var memoryStream = new MemoryStream())
        {
            await stream.CopyToAsync(memoryStream);
            imageBytes = memoryStream.ToArray();
        }

        // Create an AnyBitmap from the byte array
        var bitmap = AnyBitmap.FromBytes(imageBytes);

        // Optionally, display the image
        barcodeImage.Source = ImageSource.FromStream(() => new MemoryStream(imageBytes));

        var resultFromFile = await BarcodeReader.ReadAsync(bitmap);
        barcodeResult.Text = resultFromFile?.FirstOrDefault()?.ToString() ?? "No barcode detected.";
    }
    catch (Exception ex)
    {
        // Log or display the exception as needed
        Console.WriteLine($"An error occurred: {ex.Message}");
        barcodeResult.Text = "Error reading barcode.";
    }
}       

The above code defines the event handler OnScanButtonClicked that is triggered when the Scan Barcode button is clicked. It handles capturing an image, processing it with the IronBarcode library, and displaying the barcode result.

1. Capture Image: The method uses MediaPicker.Default.CapturePhotoAsync() to let the user capture a photo via their device's camera. If no photo is taken, it exits early.

2. Set License Key: The License.LicenseKey is set for IronBarcode to enable its functionality. you can get your free trial key from here.

3. Read Image Stream: The captured photo is opened as a stream using photo.OpenReadAsync() and converted to a byte array using a MemoryStream.

4. Convert to Bitmap: The byte array is transformed into an AnyBitmap object, which IronBarcode uses to process images.

5. Display Captured Image: The captured image is displayed in the app by setting the barcodeImage.Source to the image stream.

6. Barcode Reading: The BarcodeReader.ReadAsync method processes the AnyBitmap to detect multiple barcodes. If barcodes are found, the result is displayed in the barcodeResult label; otherwise, a "No barcode detected" message is shown.

7. Error Handling: If an exception occurs during the process, it logs the error and updates the UI with an error message in barcodeResult.

Run Project - Barcode Detection:

Now, let's run the project to test our barcode scanning functionality.

Select your Windows Machine to run the project. Once the application launches, click on the Scan Barcode button. The camera interface will open, allowing you to capture an image of your barcode. Position the barcode clearly in front of the camera, take the picture, and then click Accept to proceed, as shown below.

Once the barcode is captured, our barcode scanning library will process the image, display the captured barcode on the screen, and output the decoded barcode value below it.

In this way, we can seamlessly scan multiple barcodes in our .NET MAUI applications. IronBarcode simplifies the barcode scanning process, making it efficient and straightforward to integrate into any application.

Advanced Features of IronBarcode:

IronBarcode offers a suite of advanced features that elevate barcode scanning capabilities, making it highly customizable and efficient for diverse use cases. Some of these features include:

1. Asynchronous Barcode Reading: Enables smooth and non-blocking barcode processing for enhanced application performance.

2. Customizable Barcode Reading Options: Developers can optimize barcode scanning speed and efficiency by fine-tuning settings based on specific requirements.

3. Format Specification: Allows precise control by specifying which barcode formats to detect, improving accuracy and reducing false positives.

4. Confidence Threshold with Machine Learning: Sets a confidence threshold to ensure reliable barcode detection by leveraging machine learning techniques.

5. Image Correction Filters: Automatically enhances image quality, correcting distortions or rotations for accurate barcode recognition.

These features make IronBarcode an excellent choice for developers seeking precision and flexibility in their .NET applications.

Conclusion:

In conclusion, integrating barcode scanning into your .NET MAUI applications with IronBarcode enhances efficiency and accuracy, offering a simple yet powerful solution for various use cases. This tutorial has guided you through setting up a .NET MAUI barcode scanner, from creating the user interface to implementing barcode reading functionality with IronBarcode. You can now capture barcodes with ease, process the images, and display the results in your application. Additionally, IronBarcode's advanced features, such as asynchronous reading, customizable options, machine learning-based confidence thresholds, and image correction filters, empower developers to optimize performance and accuracy. To get started, take advantage of IronBarcode’s free trial, and explore its full capabilities with a commercial license for continued use in your projects.