.NET MAUI QR 코드 스캐너

필수 조건

1. .NET MAUI 워크로드가 설치된 Visual Studio 2022
2. Android 또는 iOS를 타겟팅하는 .NET MAUI 프로젝트

IronQR 설치

Visual Studio의 NuGet 패키지 관리 콘솔을 사용하여 IronQR 라이브러리를 설치하세요. Tools > NuGet Package Manager > Package Manager Console로 이동하여 다음을 실행하십시오:

Install-Package IronQR

또는 NuGet에서 IronQR을 검색하여 최신 버전을 설치하십시오.

프론트엔드 디자인

스캐너 UI는 이미지 선택을 트리거하는 버튼, 선택된 QR 코드를 미리보기 할 수 있는 이미지 보기, 디코딩된 결과를 표시하는 레이블로 구성됩니다.

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"
             x:Class="MauiQrScanner.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Button
                x:Name="scanButton"
                Text="Select QR Code Image"
                SemanticProperties.Hint="Select Image"
                Clicked="OnScanButtonClicked"
                HorizontalOptions="Center" />

            <Image
                x:Name="qrImage"
                SemanticProperties.Description="Selected QR Code"
                HeightRequest="200"
                HorizontalOptions="Center" />

            <Label
                x:Name="resultLabel"
                Text="Scanned Text: "
                HorizontalOptions="Center"
                VerticalOptions="Center" />

        </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="MauiQrScanner.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Button
                x:Name="scanButton"
                Text="Select QR Code Image"
                SemanticProperties.Hint="Select Image"
                Clicked="OnScanButtonClicked"
                HorizontalOptions="Center" />

            <Image
                x:Name="qrImage"
                SemanticProperties.Description="Selected QR Code"
                HeightRequest="200"
                HorizontalOptions="Center" />

            <Label
                x:Name="resultLabel"
                Text="Scanned Text: "
                HorizontalOptions="Center"
                VerticalOptions="Center" />

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

샘플 입력

아래 QR 코드를 테스트 이미지로 사용하세요. 이를 장치에 저장한 후 앱의 파일 선택기를 통해 선택하세요. 디코딩된 값은 https://ironsoftware.com 형식으로 표시되어야 합니다.

표본 QR 코드 — https://ironsoftware.com을 인코딩

IronQR로 QR 코드 스캔하기

스캔 버튼을 탭하면 FilePicker가 기기의 이미지 라이브러리를 엽니다. 사용자가 사진을 선택하면 전체 경로가 AnyBitmap에 로드되며, 이는 QrReader.Read()로 전달됩니다. 처음으로 감지된 QR 코드에서 디코딩된 값이 결과 레이블에 표시됩니다.

MainPage.xaml.cs에 다음 메서드를 추가하십시오:

using IronQr;
using IronSoftware.Drawing;

private async void OnScanButtonClicked(object sender, EventArgs e)
{
    // Start scanning QR codes
    var images = await FilePicker.Default.PickAsync(new PickOptions
    {
        PickerTitle = "Pick image",
        FileTypes = FilePickerFileType.Images
    });
    var imageSource = images.FullPath.ToString();

    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);

    // Display the first result
    resultLabel.Text = "Scanned Text: " + results.First().Value;
}

using IronQr;
using IronSoftware.Drawing;

private async void OnScanButtonClicked(object sender, EventArgs e)
{
    // Start scanning QR codes
    var images = await FilePicker.Default.PickAsync(new PickOptions
    {
        PickerTitle = "Pick image",
        FileTypes = FilePickerFileType.Images
    });
    var imageSource = images.FullPath.ToString();

    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);

    // Display the first result
    resultLabel.Text = "Scanned Text: " + results.First().Value;
}

Imports IronQr
Imports IronSoftware.Drawing

Private Async Sub OnScanButtonClicked(sender As Object, e As EventArgs)
    ' Start scanning QR codes
    Dim images = Await FilePicker.Default.PickAsync(New PickOptions With {
        .PickerTitle = "Pick image",
        .FileTypes = FilePickerFileType.Images
    })
    Dim imageSource = images.FullPath.ToString()

    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)

    ' Display the first result
    resultLabel.Text = "Scanned Text: " & results.First().Value
End Sub

FilePicker.Default.PickAsync는 MAUI 플랫폼 추상화 계층에서 제공하며, 플랫폼별 코드 없이 Android, iOS 및 Windows에서 작동합니다. AnyBitmap.FromFile는 이미지 디코딩을 처리하며, QrReader.Read는 이미지에서 발견된 QR 코드 하나당 하나의 항목을 포함하는 IEnumerable<QrResult>를 반환합니다.

산출

QR 코드 이미지 선택은 스캔을 트리거합니다. 디코딩된 값은 이미지 미리보기 아래의 결과 레이블에 나타납니다.

선택된 QR 코드와 디코딩된 값이 결과 레이블에 표시됨