在 .NET MAUI 中生成條碼和 QR Code：跨平台應用的實現指南(軟體開發、軟件開發)

   在現代應用程式中，條碼和 QR Code 被廣泛應用於許多領域，如產品追蹤、票務系統、支付系統等。透過 .NET MAUI，我們可以輕鬆地在跨平台應用中生成條碼和 QR Code。本篇文章將詳細介紹如何在 .NET MAUI 中實現條碼和 QR Code 的生成，並進行平台適配。

圖片來源與版權（https://learn.microsoft.com/zh-tw/dotnet/maui/what-is-maui?view=net-maui-8.0）

必備知識與工具

在開始之前，請確保你已具備以下工具和環境：
– **Visual Studio 2022**：建議使用最新版的 Visual Studio 2022，並選擇 “.NET Multi-platform App UI development" 工作負載。
– **.NET 6 或更高版本**：MAUI 需要 .NET 6 以上的環境。
– **開發環境設置完成**：已安裝 Android 模擬器或 iOS 模擬器，或是擁有真實設備進行測試。

使用 ZXing.Net.Maui 套件來生成條碼和 QR Code

ZXing 是一個開源的條碼和 QR Code 處理庫，支援多種條碼格式。ZXing.Net.Maui 是一個適配於 .NET MAUI 的版本，可以讓你在跨平台應用中生成和掃描條碼。

1. 安裝 ZXing.Net.Maui 套件

首先，在 MAUI 專案中安裝 `ZXing.Net.Maui` NuGet 套件。你可以通過 Visual Studio 的 NuGet 套件管理器進行安裝，或者在 NuGet 程式管理主控台中執行以下命令：

“`shell
dotnet add package ZXing.Net.Maui
“`

2. 設置 MAUI 專案以支援 ZXing.Net.Maui

在 `MauiProgram.cs` 檔案中，需註冊 ZXing.Net.Maui 的服務，讓框架支援條碼和 QR Code 的生成與掃描。修改 `MauiProgram.cs` 如下：

“`csharp
using ZXing.Net.Maui;

public static class MauiProgram
{
     public static MauiApp CreateMauiApp()
     {
         var builder = MauiApp.CreateBuilder();
         builder
             .UseMauiApp<App>()
             .UseBarcodeReader(); // 註冊 ZXing.Net.Maui 的條碼讀取功能

        return builder.Build();
     }
}
“`

3. 生成 QR Code 或條碼的頁面設計

接下來，在 `MainPage.xaml` 中設計一個簡單的介面，用於生成 QR Code 和條碼。我們將使用一個 `Entry` 來輸入文本，一個 `Button` 來觸發生成，並使用 `Image` 控件來顯示生成的 QR Code 或條碼。

“`xaml
<VerticalStackLayout Padding="20″>
     <Entry
         x:Name="InputText"
         Placeholder="Enter text to generate barcode" />

    <Button
         Text="Generate QR Code"
         Clicked="OnGenerateQRCodeClicked" />

    <Button
         Text="Generate Barcode"
         Clicked="OnGenerateBarcodeClicked" />

    <Image
         x:Name="BarcodeImage"
         HeightRequest="200″
         WidthRequest="200″
         VerticalOptions="Center"
         HorizontalOptions="Center" />
</VerticalStackLayout>
“`

4. 在程式後端生成條碼或 QR Code

在 `MainPage.xaml.cs` 檔案中，我們需要使用 ZXing.Net.Maui 提供的 API 來生成圖像。以下是如何生成 QR Code 和條碼的代碼範例：

“`csharp
using ZXing.Net.Maui;
using ZXing.QrCode.Internal;
using System.IO;

public partial class MainPage : ContentPage
{
     public MainPage()
     {
         InitializeComponent();
     }

    private void OnGenerateQRCodeClicked(object sender, EventArgs e)
     {
         string text = InputText.Text;
         if (string.IsNullOrWhiteSpace(text))
         {
             DisplayAlert(“Error", “Please enter text to generate QR Code", “OK");
             return;
         }

        var qrCode = BarcodeWriter.CreateBarcode(text, BarcodeFormat.QrCode);
         BarcodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCode));
     }

    private void OnGenerateBarcodeClicked(object sender, EventArgs e)
     {
         string text = InputText.Text;
         if (string.IsNullOrWhiteSpace(text))
         {
             DisplayAlert(“Error", “Please enter text to generate Barcode", “OK");
             return;
         }

        var barcode = BarcodeWriter.CreateBarcode(text, BarcodeFormat.Code128);
         BarcodeImage.Source = ImageSource.FromStream(() => new MemoryStream(barcode));
     }
}
“`

上述代碼中，我們使用 `BarcodeWriter.CreateBarcode` 方法來生成條碼或 QR Code，並指定生成的條碼格式（如 `BarcodeFormat.QrCode` 或 `BarcodeFormat.Code128`）。生成後的圖像被轉換為 `MemoryStream` 並顯示在 `Image` 控件上。

5. 測試應用

完成以上步驟後，你可以運行應用，並在 Android 模擬器或實體設備上測試生成 QR Code 和條碼的功能。輸入文本後，點擊 “Generate QR Code" 或 “Generate Barcode" 按鈕，應該能夠看到相應的圖像顯示。

## 擴展功能

除了基本的條碼和 QR Code 生成功能，你還可以進一步擴展應用，加入以下功能：

1. **掃描 QR Code 和條碼**：ZXing.Net.Maui 也支援條碼掃描，你可以添加相機掃描功能，實現即時掃描和解析。
2. **自訂條碼外觀**：可修改條碼的顏色、大小和邊框，以符合應用的設計需求。
3. **儲存生成的 QR Code 和條碼圖像**：將生成的圖像儲存在設備上或分享給其他應用程式。

### 掃描條碼範例

若要新增掃描功能，只需在頁面上新增 ZXing 的掃描控制項並處理掃描結果：

“`xaml
<zxing:CameraBarcodeReaderView x:Name="barcodeReader"
     BarcodeDetected="OnBarcodeDetected"
     HorizontalOptions="FillAndExpand"
     VerticalOptions="FillAndExpand" />
“`

在程式碼後端處理掃描結果：

“`csharp
private void OnBarcodeDetected(object sender, BarcodeDetectionEventArgs e)
{
     MainThread.BeginInvokeOnMainThread(() =>
     {
         DisplayAlert(“Scanned Result", e.Results[0].Value, “OK");
     });
}
“`

結論

本篇文章示範與簡單講解展示了如何在 .NET MAUI 中生成和掃描條碼及 QR Code，並提供了實際的代碼示例。透過 ZXing.Net.Maui 套件的支援，你可以輕鬆地將條碼和 QR Code 功能整合到跨平台應用中，進一步提升應用的實用性和互動性。

這篇教學文章提供了較深入的功能實現步驟，如果需要進一步擴充或加入更多代碼示例，請隨時告訴我！

網智數位-軟體開發團隊一直突破開發技術、累積各種產業知識，而且在出版業、室內設計裝潢業、製造業、機電顧問、貿易、地板、窗簾、窗材、拉門、布料業的商業管理軟體投入有特別的領域知識、也在圖控軟體（圖控軟件）、機械手臂、 Android APP 、iPhone APP、3D列印 開發一直突破再創新，我們也堅持相信好的軟體可以協助企業，不管在管理營運角度、商品創新、決策分析等都絕對是不可缺少的關鍵因素，如果客戶您有任何軟體開發、程式開發委外需求，請聯繫我們讓我們協助您一起討論如何開發一個好的軟體來協助您。

網智數位-軟體開發（軟件開發）
針對各特殊產業都可以量身定做符合貴公司的需求，別人無法克服的就是我們的挑戰
業務合作、軟體委外開發
業務窗口：allen@netqna.com
聯繫電話：0920-883-870
公司電話：02-55991310
公司地址（業務營運處）：台北市中山區錦州街 25 號 5 樓
skype： netqna
line：netqna
微信：netqna
黃先生 Allen