How to Use a Document Scanner SDK in a .NET MAUI Application

With the rise of mobile technology, document-scanning apps such as Scanbot SDK, and Native SDKs have become indispensable tools or solution experts for individuals and businesses alike. In this tutorial, we'll explore how to create a document scanner app using the latest version of .NET Multi-platform App UI (MAUI) and IronOCR, a powerful OCR (Optical Character Recognition) library for .NET. .NET MAUI simplifies the creation of cross-platform mobile apps such as Android, ensuring seamless deployment on the end user's device. By the end of this guide, you'll be able to develop your own document scanner SDK app that can extract text from images and scanned files with ease.

How to Use a Document Scanner SDK in a .NET MAUI Application

1. Install IronOCR C# Library to use Document Scanner SDK.
2. Design .NET MAUI Form with Necessary Controls.
3. Capture Photo Frame using MediaPicker.CapturePhotoAsync method.
4. Convert the Captured Photo to Stream.
5. Pass the Stream to OcrInput LoadImage method.
6. Perform OCR using the IronTesseract Read method.
7. Display the Document Text using the OcrResult Text property.

IronOCR - The C# OCR Library

IronOCR is a cutting-edge Optical Character Recognition (OCR) software developed by Iron Software, LLC, designed to accurately and efficiently convert images and scanned documents into editable text. OCR technology has revolutionized the way businesses handle document processing, making it easier to extract valuable information from various sources such as scanned documents, PDFs, and images.

IronOCR stands out among OCR solutions due to its advanced features, robust performance, and ease of integration. Whether you're a developer looking to incorporate OCR features into your applications or a business seeking to streamline data-generated document management processes, IronOCR offers a comprehensive solution.

Key Features of IronOCR

Here are some important key features of IronOCR:

1. High Accuracy: IronOCR employs state-of-the-art algorithms and machine learning techniques to achieve exceptional accuracy in text recognition. It can accurately extract text from complex documents, including images with QR low-resolution or poor-quality scans.
2. Multi-Language Support: One of the standout features of IronOCR is its extensive language support. It can recognize text in over 127 languages, making it suitable for businesses operating in diverse linguistic environments.
3. Image Preprocessing: To enhance accuracy, IronOCR provides various image preprocessing capabilities, such as noise reduction, contrast adjustment, and deskewing. These preprocessing techniques help improve OCR results, especially when dealing with distorted or imperfect images.
4. Support for Various File Formats: IronOCR supports a wide range of file formats, including TIFF, JPEG, PNG, and PDF. This flexibility allows users to process documents from different sources without worrying about compatibility issues.
5. Customization Options: Developers can customize IronOCR's behavior according to their specific requirements. Whether it's fine-tuning recognition parameters or integrating with existing workflows, IronOCR offers a high degree of flexibility and customization.
6. Fast and Scalable: IronOCR is optimized for performance, enabling rapid text extraction even from large volumes of documents. Its scalable architecture ensures seamless operation, whether you're processing a handful of documents or handling massive document repositories.
7. Integration with .NET Applications: IronOCR seamlessly integrates with .NET applications, providing developers with easy-to-use APIs and libraries for incorporating OCR functionality into their software projects. This tight integration simplifies development and accelerates time-to-market for OCR-enabled applications.
8. Document Classification and Data Extraction: Beyond basic text recognition, IronOCR offers advanced features for document classification and data extraction. It can identify specific data fields within documents, such as names, addresses, or invoice numbers, enabling automated data extraction and analysis.

Prerequisites

• Basic knowledge of C# programming.
• Visual Studio 2022 latest version installed on your system with the .NET MAUI workload.
• IronOCR package library installed via NuGet Package Manager.

1. Setting Up Your .NET MAUI Project

• Open Visual Studio 2022 and create a new .NET MAUI App project.

• Choose a suitable project name and configure your project settings.

• Ensure that you have the necessary Android and iOS SDKs installed for target-platform device development.

2. Installing IronOCR Library

• Right-click on your Solution in Visual Studio.
  • Select "Manage NuGet Packages for Solutions" and in the Browse tab, search for "IronOCR".

• Install the IronOCR library to your project.

3. Designing the UI

Let's start by designing the layout of our MainPage.xaml. We'll create a simple layout with an image control to display the captured photo, a Capture button to take photos, and a Label to display the extracted text.

Here's the XAML code for MainPage.xaml:

<?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"
             xmlns:d="http://schemas.microsoft.com/dotnet/2021/maui/design"
             x:Class="DocumentScanner.MainPage">
    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">
            <Image
                Source="dotnet_bot.png"
                HeightRequest="185"
                Aspect="AspectFit"
                SemanticProperties.Description="dot net bot in a race car number eight" />
            <Label
                Text="Welcome to .NET MAUI Document Scanner SDK"
                Style="{StaticResource Headline}"
                SemanticProperties.HeadingLevel="Level1" />
            <Label
                Text="Using IronOCR"
                Style="{StaticResource SubHeadline}"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to .NET MAUI Document Scanner SDK" />
            <!-- Camera preview -->
            <Image x:Name="cameraPreview" />
            <!-- Capture button -->
            <Button Text="Capture" Clicked="OnCaptureClicked" />
            <!-- Text display area -->
            <Label x:Name="textLabel"
                   Text="Recognized Text:"/>
        </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"
             xmlns:d="http://schemas.microsoft.com/dotnet/2021/maui/design"
             x:Class="DocumentScanner.MainPage">
    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">
            <Image
                Source="dotnet_bot.png"
                HeightRequest="185"
                Aspect="AspectFit"
                SemanticProperties.Description="dot net bot in a race car number eight" />
            <Label
                Text="Welcome to .NET MAUI Document Scanner SDK"
                Style="{StaticResource Headline}"
                SemanticProperties.HeadingLevel="Level1" />
            <Label
                Text="Using IronOCR"
                Style="{StaticResource SubHeadline}"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to .NET MAUI Document Scanner SDK" />
            <!-- Camera preview -->
            <Image x:Name="cameraPreview" />
            <!-- Capture button -->
            <Button Text="Capture" Clicked="OnCaptureClicked" />
            <!-- Text display area -->
            <Label x:Name="textLabel"
                   Text="Recognized Text:"/>
        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'<?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" xmlns:d="http://schemas.microsoft.com/dotnet/2021/maui/design" x:@Class="DocumentScanner.MainPage"> <ScrollView> <VerticalStackLayout Padding="30,0" Spacing="25"> <Image Source="dotnet_bot.png" HeightRequest="185" Aspect="AspectFit" SemanticProperties.Description="dot net bot in a race car number eight" /> <Label Text="Welcome to .NET MAUI Document Scanner SDK" Style="{StaticResource Headline}" SemanticProperties.HeadingLevel="Level1" /> <Label Text="Using IronOCR" Style="{StaticResource SubHeadline}" SemanticProperties.HeadingLevel="Level2" SemanticProperties.Description="Welcome to .NET MAUI Document Scanner SDK" /> <!-- Camera preview -- > <Image x:Name="cameraPreview" /> <!-- Capture button -- > <Button Text="Capture" Clicked="OnCaptureClicked" /> <!-- Text display area -- > <Label x:Name="textLabel" Text="Recognized Text:"/> </VerticalStackLayout> </ScrollView> </ContentPage>

In this layout:

• We use a VerticalStackLayout to stack the controls vertically.
• The Image control named capturedImage is used to display the captured photo.
• The Button control triggers the OnCaptureClicked event handler when clicked.
• The Label control named textLabel is used to display the extracted text.

Output

4. Implementing Document Scanning Functionality

To integrate text extraction functionality into our .NET MAUI Document Scanning app, we will follow these steps:

1. Utilize the Camera API: Begin by leveraging the camera API provided by .NET MAUI to capture image files directly within your application.
2. Pass Image to IronOCR: Once an image is captured, pass it to IronOCR, a powerful OCR library, for text extraction. IronOCR provides robust functionality for extracting text from images with high accuracy.
3. Display Extracted Text: Finally, display the extracted text in the designated area on your app's user interface. This allows users to easily view the text extracted from the captured image or QR Code.

Here's the corresponding code snippet implementing these steps:

using IronOcr;
namespace DocumentScanner
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }
        private async void OnCaptureClicked(object sender, EventArgs e)
        {
            License.LicenseKey = "YOUR-LICENSE-KEY-HERE";
            try
            {
                // Request camera permissions
                var status = await Permissions.RequestAsync<Permissions.Camera>();
                if (status == PermissionStatus.Granted)
                {
                    // Take photo
                    var photo = await MediaPicker.CapturePhotoAsync();
                    if (photo != null)
                    {
                        // Display captured photo in Image
                        cameraPreview.Source = ImageSource.FromStream(() => photo.OpenReadAsync().Result);
                        using (var stream = await photo.OpenReadAsync())
                        {
                            // Use a stream from the captured photo for OCR
                            var ocr = new IronTesseract();
                            using var ocrInput = new OcrInput();
                            ocrInput.LoadImage(stream);
                            var ocrResult = ocr.Read(ocrInput);
                            if (string.IsNullOrEmpty(ocrResult.Text))
                            {
                                await DisplayAlert("Error", "No Text Detected!", "OK");
                            }
                            else
                            {
                                await DisplayAlert("Text Detected!", ocrResult.Text, "OK");
                                // Display extracted text
                                textLabel.Text = ocrResult.Text;
                            }
                        }
                    }
                }
                else
                {
                    // Camera permission denied
                    await DisplayAlert("Permission Denied", "Camera permission is required to capture photos.", "OK");
                }
            }
            catch (Exception ex)
            {
                // Handle exception
                await DisplayAlert("Error", ex.Message, "OK");
            }
        }
    }
}

using IronOcr;
namespace DocumentScanner
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }
        private async void OnCaptureClicked(object sender, EventArgs e)
        {
            License.LicenseKey = "YOUR-LICENSE-KEY-HERE";
            try
            {
                // Request camera permissions
                var status = await Permissions.RequestAsync<Permissions.Camera>();
                if (status == PermissionStatus.Granted)
                {
                    // Take photo
                    var photo = await MediaPicker.CapturePhotoAsync();
                    if (photo != null)
                    {
                        // Display captured photo in Image
                        cameraPreview.Source = ImageSource.FromStream(() => photo.OpenReadAsync().Result);
                        using (var stream = await photo.OpenReadAsync())
                        {
                            // Use a stream from the captured photo for OCR
                            var ocr = new IronTesseract();
                            using var ocrInput = new OcrInput();
                            ocrInput.LoadImage(stream);
                            var ocrResult = ocr.Read(ocrInput);
                            if (string.IsNullOrEmpty(ocrResult.Text))
                            {
                                await DisplayAlert("Error", "No Text Detected!", "OK");
                            }
                            else
                            {
                                await DisplayAlert("Text Detected!", ocrResult.Text, "OK");
                                // Display extracted text
                                textLabel.Text = ocrResult.Text;
                            }
                        }
                    }
                }
                else
                {
                    // Camera permission denied
                    await DisplayAlert("Permission Denied", "Camera permission is required to capture photos.", "OK");
                }
            }
            catch (Exception ex)
            {
                // Handle exception
                await DisplayAlert("Error", ex.Message, "OK");
            }
        }
    }
}

Imports IronOcr
Namespace DocumentScanner
	Partial Public Class MainPage
		Inherits ContentPage

		Public Sub New()
			InitializeComponent()
		End Sub
		Private Async Sub OnCaptureClicked(ByVal sender As Object, ByVal e As EventArgs)
			License.LicenseKey = "YOUR-LICENSE-KEY-HERE"
			Try
				' Request camera permissions
				Dim status = Await Permissions.RequestAsync(Of Permissions.Camera)()
				If status = PermissionStatus.Granted Then
					' Take photo
					Dim photo = Await MediaPicker.CapturePhotoAsync()
					If photo IsNot Nothing Then
						' Display captured photo in Image
						cameraPreview.Source = ImageSource.FromStream(Function() photo.OpenReadAsync().Result)
						Using stream = Await photo.OpenReadAsync()
							' Use a stream from the captured photo for OCR
							Dim ocr = New IronTesseract()
							Dim ocrInput As New OcrInput()
							ocrInput.LoadImage(stream)
							Dim ocrResult = ocr.Read(ocrInput)
							If String.IsNullOrEmpty(ocrResult.Text) Then
								Await DisplayAlert("Error", "No Text Detected!", "OK")
							Else
								Await DisplayAlert("Text Detected!", ocrResult.Text, "OK")
								' Display extracted text
								textLabel.Text = ocrResult.Text
							End If
						End Using
					End If
				Else
					' Camera permission denied
					Await DisplayAlert("Permission Denied", "Camera permission is required to capture photos.", "OK")
				End If
			Catch ex As Exception
				' Handle exception
				Await DisplayAlert("Error", ex.Message, "OK")
			End Try
		End Sub
	End Class
End Namespace

Code Explanation

Let's break down the code step by step:

• In MainPage.xaml.cs file, we define the OnCaptureClicked method, which will be triggered when the user clicks the Capture button.
• Inside the OnCaptureClicked method, we first set the IronOCR license key. This is necessary to use the IronOCR library. Replace "YOUR-LICENSE-KEY-HERE" with your actual license key.
• Then, we request camera permissions using Permissions.RequestAsync(). This ensures that the app has the necessary permissions to access the device's camera.
• We use MediaPicker.CapturePhotoAsync() to capture a photo using the device's camera. If a photo is successfully captured, we display it in an Image control named cameraPreview.
• We open a stream from the captured photo and use it as input for OCR using IronOCR. We create an instance of IronTesseract, load the image stream into an OcrInput object, and then call the Read method to perform OCR.
• If text is successfully extracted, we display it in a Label control named textLabel. If no text is detected, we display an error message using DisplayAlert.

For more robust use of IronOCR and code details, visit this code examples page.

5. Testing the Document Scanner App

• Run the app on various platforms (Android, iOS, and Windows) to ensure cross-platform compatibility.
• Test different scenarios, such as scanning documents with different fonts, sizes, and orientations.
• Verify that the extracted text is accurate and displayed correctly on the UI.

Output - Scanned Document without Text

Output - Scanned Document with Text

Conclusion

By following this tutorial, you've learned how to use IronOCR document scanner SDK in .NET MAUI. Document scanning apps have numerous practical applications, from digitizing paper documents to extracting stored information from receipts and invoices. With the powerful capabilities of IronOCR and the flexibility of .NET MAUI, you can build feature-rich document scanner apps that cater to various use cases. Experiment with different functionalities, explore additional libraries and continue honing your skills to create even more impressive apps.

For more detailed information on IronOCR capabilities, please visit this documentation page.

IronOCR provides a free trial to test out its complete functionality in commercial mode. Its perpetual lite license starts from $749. Download the library from download page and give it a try.