.NET MAUI QR Kod Tarayıcı

Önkoşullar

1. .NET MAUI iş yükü kurulu olan Visual Studio 2022
2. Android veya iOS'u hedefleyen bir .NET MAUI projesi

IronQR Kurulumu

Visual Studio'daki NuGet Package Manager Console kullanarak IronQR kütüphanesini yükleyin. Navigasyon icin Tools > NuGet Package Manager > Package Manager Console gidin ve calistirin:

Install-Package IronQR

Alternatif olarak, NuGet uzerinde IronQR arayabilir ve en son surumunu yukleyebilirsiniz.

Ön Yüz Tasarımı

Tarayıcı kullanıcı arayüzü, görüntü seçimini başlattığı bir düğme, seçilen QR kodunu önizlemek için bir görüntü görünümü ve çözülmüş sonucu göstermek için bir etiket içerir.

MainPage.xaml icerigini asagidaki ile değiştirin:

<?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>

Örnek Girdi

Aşağıdaki QR kodunu test resmi olarak kullanın. Cihazınıza kaydedin, ardından uygulamanın dosya seçicisi aracılığıyla seçin. Decode edilen değer https://ironsoftware.com olarak gösterilmelidir.

Örnek QR kodu - https://ironsoftware.com kodluyor

IronQR ile QR Kod Tarama

Tarama dugmesine dokunuldugunda, FilePicker cihazın resim kutuphanesini acar. Kullanıcı bir fotograf sectikten sonra, tam yol AnyBitmap icine yuklenir ve QrReader.Read()'a iletilir. İlk tespit edilen QR kodundan çözülmüş değer, sonuç etiketinde gösterilir.

MainPage.xaml.cs icin asagidaki metodu ekleyin:

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 platform soyutlama katmani tarafindan saglanir ve platforma ozgu kod olmadan Android, iOS ve Windows'ta calisir. AnyBitmap.FromFile resim decode etmeyi yonetir ve QrReader.Read, resimde bulunan her bir QR kodu icin bir girisle bir IEnumerable<QrResult> dondurur.

Çıktı

Bir QR kod görüntüsü seçmek taramayı tetikler. Çözülen değer, görüntü önizlemesinin altındaki sonuç etiketinde belirir.

QR kodu seçildi ve çözülen değer sonuç etiketinde gösterildi