.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 並安裝最新版本。

前端設計

掃描器的使用者介面包含一個用於觸發圖片選取的按鈕、一個用於預覽所選 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 會傳回一個 IEnumerable<QrResult> 物件，其中包含影像中每個 QR 碼對應的單一條目。

輸出

選取 QR 碼圖片即可觸發掃描。 解碼後的值會顯示在圖片預覽下方的結果標籤中。

選取的 QR 碼及其解碼結果將顯示於結果標籤中