1. IronOCR
2. Get Started
3. .NET MAUI OCR

.NET MAUI OCR Using IronOCR

Introduction

Microsoft released .NET MAUI (Multi-platform App UI), which is a framework for building cross-platform applications with the .NET Framework. It allows you to write code that runs on Android, iOS, and Windows using the same codebase, saving you time, resources, and effort. .NET MAUI is open source. You can get the source code of the .NET MAUI project with examples on GitHub.

In this How-To Guide, we'll learn how to create an OCR processor app on .NET MAUI using the IronOCR library with examples.

IronOCR: .NET OCR library

IronOCR is a .NET OCR NuGet library that enables developers to easily integrate Optical Character Recognition (OCR) functionality into their projects. Using IronOCR, PDF documents can be scanned and converted into searchable and editable text/data without any loss of data quality. This makes it easy for users to find the information they need from PDF documents and make changes or corrections if necessary.

IronOCR is the most advanced build of the Tesseract binaries available for any platform. It offers increased speed, accuracy, and a native DLL/API that supports all versions of Tesseract (from Tesseract 3 up to Tesseract 5) with one easy install/download.

IronOCR's language support is extensive, with 125 international languages available to users. The English language is installed by default with the tool/DLL. However, you can easily add more languages by installing them through NuGet or by downloading DLLs.

Comparison with Tesseract

IronOCR is specifically designed for C# developers and integrates seamlessly with .NET applications. By contrast, Tesseract is a generic OCR library that requires developers to write their own wrappers to use it with C#. In addition, IronOCR offers superior accuracy and speed compared to other libraries, thanks to its innovative artificial intelligence algorithms.

IronOCR comes with comprehensive documentation and technical support, making it easy for even novice developers to get up and running quickly.

IronOCR is much more accurate than Tesseract. In fact, it has an accuracy rate of over 99%, while Tesseract's accuracy rate is only around 70.2% to 92.9%. Get more info and support about IronOCR and Tesseract comparison on this YouTube video.

Steps to Create an OCR MAUI app

Follow these steps to create an OCR app in the .NET MAUI framework using IronOCR.

Prerequisites

For creating an OCR app in .NET MAUI, these are the prerequisites:

1. Visual Studio 2022 (Latest version)
2. .NET 6 or 7
3. MAUI packages installed in Visual Studio
4. A .NET MAUI project running in Visual Studio

Install IronOCR

The first step is to install the IronOCR library using the NuGet Package Manager Console. Open the NuGet Package Manager Console by right-clicking on the solution explorer and executing the following command to install the IronOCR library:

Install-Package IronOcr

Frontend Design

We will design the frontend of the application in this section. Open the MainPage.xaml file.

MainPage.xaml

We designate a button that will help us select the image or PDF document for OCR. The button's Clicked property is set to execute the IOCR function which we will define in the next section.

<Button
    x:Name="OCR"
    Text="Click to OCR"
    Clicked="IOCR"
    HorizontalOptions="Center" />

<Button
    x:Name="OCR"
    Text="Click to OCR"
    Clicked="IOCR"
    HorizontalOptions="Center" />

Here, we create an Image element with the name OCRImage. This image box will display the selected file.

<Image
    x:Name="OCRImage"
    SemanticProperties.Description="Selected Image"
    HeightRequest="300"
    HorizontalOptions="Center" />

<Image
    x:Name="OCRImage"
    SemanticProperties.Description="Selected Image"
    HeightRequest="300"
    HorizontalOptions="Center" />

Next, we create an Editor control. It will be used to show the extracted text from the image or PDF document.

<Editor
    x:Name="outputText"
    HorizontalOptions="Center"
    WidthRequest="600"
    HeightRequest="300" />

<Editor
    x:Name="outputText"
    HorizontalOptions="Center"
    WidthRequest="600"
    HeightRequest="300" />

Here is the completed XAML User Interface markup.

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

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">
            <Button
                x:Name="OCR"
                Text="Click to OCR"
                Clicked="IOCR"
                HorizontalOptions="Center" />
            <Image
                x:Name="OCRImage"
                SemanticProperties.Description="Selected Image"
                HeightRequest="300"
                HorizontalOptions="Center" />

            <Editor
                x:Name="outputText"
                HorizontalOptions="Center"
                WidthRequest="600"
                HeightRequest="300" />
        </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="IronOCR_MAUI_Test.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">
            <Button
                x:Name="OCR"
                Text="Click to OCR"
                Clicked="IOCR"
                HorizontalOptions="Center" />
            <Image
                x:Name="OCRImage"
                SemanticProperties.Description="Selected Image"
                HeightRequest="300"
                HorizontalOptions="Center" />

            <Editor
                x:Name="outputText"
                HorizontalOptions="Center"
                WidthRequest="600"
                HeightRequest="300" />
        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

Now, it's time to write the code for OCR functionality.

Code for OCR using IronOCR

Open the MainPage.xaml.cs class file and write the following function:

MainPage.xaml.cs

private async void IOCR(object sender, EventArgs e)
{
    // Prompt user to select an image using FilePicker
    var images = await FilePicker.Default.PickAsync(new PickOptions
    {
        PickerTitle = "Pick image",
        FileTypes = FilePickerFileType.Images
    });

    // Get the full path of the selected image
    var path = images.FullPath.ToString();

    // Display the selected image in the Image control
    OCRImage.Source = path;

    // Create an IronTesseract object to perform OCR
    var ocr = new IronTesseract();

    // Perform OCR and extract text from the selected image
    using (var input = new OcrInput())
    {
        input.AddImage(path); // Add image to the OCR input
        OcrResult result = ocr.Read(input); // Perform OCR
        string text = result.Text; // Extract text

        // Display extracted text in the Editor control
        outputText.Text = text; 
    }
}

private async void IOCR(object sender, EventArgs e)
{
    // Prompt user to select an image using FilePicker
    var images = await FilePicker.Default.PickAsync(new PickOptions
    {
        PickerTitle = "Pick image",
        FileTypes = FilePickerFileType.Images
    });

    // Get the full path of the selected image
    var path = images.FullPath.ToString();

    // Display the selected image in the Image control
    OCRImage.Source = path;

    // Create an IronTesseract object to perform OCR
    var ocr = new IronTesseract();

    // Perform OCR and extract text from the selected image
    using (var input = new OcrInput())
    {
        input.AddImage(path); // Add image to the OCR input
        OcrResult result = ocr.Read(input); // Perform OCR
        string text = result.Text; // Extract text

        // Display extracted text in the Editor control
        outputText.Text = text; 
    }
}

Let's break down the above code:

• The code uses the FilePicker to allow the user to select an image file from the device. The file picker is configured to only allow images.

var images = await FilePicker.Default.PickAsync(new PickOptions
{
    PickerTitle = "Pick image",
    FileTypes = FilePickerFileType.Images
});
var path = images.FullPath.ToString();

var images = await FilePicker.Default.PickAsync(new PickOptions
{
    PickerTitle = "Pick image",
    FileTypes = FilePickerFileType.Images
});
var path = images.FullPath.ToString();

• The Image control is set to display the selected image using its file path.

OCRImage.Source = path;

OCRImage.Source = path;

• An IronTesseract object is created to perform OCR. The selected image is added to an OcrInput object. The Read method is called to extract text from the image, which is then displayed in the Editor control.

var ocr = new IronTesseract();
using (var input = new OcrInput())
{
    input.AddImage(path);
    OcrResult result = ocr.Read(input);
    string text = result.Text;
    outputText.Text = text; 
}

var ocr = new IronTesseract();
using (var input = new OcrInput())
{
    input.AddImage(path);
    OcrResult result = ocr.Read(input);
    string text = result.Text;
    outputText.Text = text; 
}

Output

After running the project, the below UI shows up. When you click on the button, it will prompt you to select an image/PDF from any location.

OCR Output

After selecting the image, IronOCR processes the image and shows the recognized words in the Editor control. You can copy the text from the Editor control.

OCR Image

From the results, it shows that IronOCR performs a wonderful job at processing complex images with patterns, showing accurate results. IronOCR is able to detect small details and select the exact letters required using its pre-trained models.

<{i:(Running the project in release mode with debugging attached might cause issues. In such cases, you can publish the project as an unpackaged .NET MAUI app, as shown in the link below, to ensure the app works properly.)}>

Conclusion

For further reading, refer to this tutorial which provides additional information about how to use IronOCR to read text from images.

IronOCR is free for development purposes. You can purchase it for a very low price starting from just $749. Check out the pricing plan here.