Cómo Usar un SDK de Escáner de Documentos en una Aplicación .NET MAUI

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

1. Install the IronOCR C# Library to use the Document Scanner SDK.
2. Design a .NET MAUI Form with necessary controls.
3. Capture a photo using the MediaPicker.CapturePhotoAsync method.
4. Convert the captured photo to a Stream.
5. Pass the stream to the 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 how 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 document management processes, IronOCR offers a comprehensive solution.

Prerequisites

• Basic knowledge of C# programming.
• Visual Studio 2022 installed 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 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 Solution" 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>

In this layout:

• We use a VerticalStackLayout to stack the controls vertically.
• The Image control named cameraPreview 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.

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: Leverage 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 for text extraction, utilizing its robust functionality.
3. Display Extracted Text: Display the extracted text in the designated area on your app's user interface for user viewing.

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

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 various fonts, sizes, and orientations.
• Verify that the extracted text is accurate and displayed correctly on the UI.

Conclusion

By following this tutorial, you've learned how to use the IronOCR document scanner SDK within .NET MAUI. Document scanning apps have numerous practical applications, from digitizing paper documents to extracting stored information from receipts and invoices. Using 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 its complete functionality in commercial mode. Its perpetual lite license starts from $799. Download the library from the download page and give it a try.