MAUI バーコードスキャナー（IronBarcode搭載）: ステップバイステップガイド

MAUIバーコードスキャナーを構築するための前提条件は何ですか？

始める前に、開発環境が整っていることを確認してください。

• .NET MAUIワークロードがインストールされたVisual Studio 2022 （v17.8以降）
• .NET 10 SDK --公式.NETサイトからダウンロード -基本的なC#の知識― async/awaitパターンに精通していると役立ちます
• カメラテスト用に構成された物理デバイスまたはエミュレータ
• IronBarcodeライセンス-無料トライアルで評価できます

プロジェクトを作成する前にVisual StudioにMAUIワークロードがインストールされていることを確認しておくと、後々のトラブルシューティングにかかる​​時間を大幅に節約できます。 Visual Studioインストーラーの"個別コンポーネント"で".NETマルチプラットフォームアプリUI開発"を検索することで、このことを確認できます。

MAUIバーコードスキャンプロジェクトの設定方法を教えてください

まず、Visual Studio 2022 で新しい.NET MAUIアプリ プロジェクトを作成します。プロジェクト名を BarcodeScannerApp とし、ターゲット フレームワークとして.NET 10 を選択します。 Visual Studioは、Android、iOS、macOS、Windowsそれぞれに対応したプラットフォーム固有のフォルダを含む、標準的なMAUIプロジェクト構造を生成します。

Install-Package BarCode

IronBarCode.License.LicenseKey = "YOUR-LICENSE-KEY";

IronBarCode.License.LicenseKey = "YOUR-LICENSE-KEY";

AndroidとiOSでカメラの権限を設定するにはどうすればいいですか？

プラットフォーム固有のカメラ権限はバーコードスキャン機能に不可欠です。 各プラットフォームは、MediaPicker.CapturePhotoAsync() が正常に動作する前に、マニフェストファイルに特定の構成が必要です。

<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" android:required="true" />
<uses-feature android:name="android.hardware.camera.autofocus" />

<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" android:required="true" />
<uses-feature android:name="android.hardware.camera.autofocus" />

<key>NSCameraUsageDescription</key>
<string>This app requires camera access to scan barcodes</string>

<key>NSCameraUsageDescription</key>
<string>This app requires camera access to scan barcodes</string>

バーコードスキャナーのインターフェースはどのように作成しますか？

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="BarcodeScannerApp.MainPage"
             Title="Barcode Scanner">
    <VerticalStackLayout Padding="20" Spacing="20">
        <Label Text="Point the camera at a barcode"
               FontSize="16"
               HorizontalOptions="Center"
               TextColor="#555555" />
        <Image x:Name="CapturedImage"
               HeightRequest="300"
               Aspect="AspectFit"
               BackgroundColor="#F0F0F0" />
        <Label x:Name="ResultLabel"
               Text="Tap Scan to begin"
               FontSize="18"
               HorizontalOptions="Center"
               FontAttributes="Bold" />
        <Label x:Name="FormatLabel"
               Text=""
               FontSize="13"
               HorizontalOptions="Center"
               TextColor="#888888" />
        <Button Text="Scan Barcode"
                Clicked="OnScanClicked"
                BackgroundColor="#007ACC"
                TextColor="White"
                CornerRadius="8"
                HeightRequest="50" />
        <Button Text="Load from Gallery"
                Clicked="OnPickFromGalleryClicked"
                BackgroundColor="#5C5C5C"
                TextColor="White"
                CornerRadius="8"
                HeightRequest="50" />
    </VerticalStackLayout>
</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="BarcodeScannerApp.MainPage"
             Title="Barcode Scanner">
    <VerticalStackLayout Padding="20" Spacing="20">
        <Label Text="Point the camera at a barcode"
               FontSize="16"
               HorizontalOptions="Center"
               TextColor="#555555" />
        <Image x:Name="CapturedImage"
               HeightRequest="300"
               Aspect="AspectFit"
               BackgroundColor="#F0F0F0" />
        <Label x:Name="ResultLabel"
               Text="Tap Scan to begin"
               FontSize="18"
               HorizontalOptions="Center"
               FontAttributes="Bold" />
        <Label x:Name="FormatLabel"
               Text=""
               FontSize="13"
               HorizontalOptions="Center"
               TextColor="#888888" />
        <Button Text="Scan Barcode"
                Clicked="OnScanClicked"
                BackgroundColor="#007ACC"
                TextColor="White"
                CornerRadius="8"
                HeightRequest="50" />
        <Button Text="Load from Gallery"
                Clicked="OnPickFromGalleryClicked"
                BackgroundColor="#5C5C5C"
                TextColor="White"
                CornerRadius="8"
                HeightRequest="50" />
    </VerticalStackLayout>
</ContentPage>

このレイアウトでは、カメラで新しい写真を撮影する操作と、ギャラリーから既存の画像を選択する操作の2つのスキャンパスが提供されます。 これは、ユーザーが事前にバーコードを撮影したり、電子メールで画像を受信したりするワークフローにおいて重要となる。 FormatLabel は、検出されたバーコード形式とデコードされた値を同時に表示します。これは、デバッグやユーザーによる確認の際に役立ちます。

バーコードリーダー機能はどのように実装しますか？

MainPage.xaml.cs にコアスキャンロジックを実装します。 以下のコードは、適切な非同期パターンとエラー処理を用いて、カメラのキャプチャとギャラリーの選択の両方を処理します。

using IronBarCode;
using IronSoftware.Drawing;

namespace BarcodeScannerApp;

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

    private async void OnScanClicked(object sender, EventArgs e)
    {
        await ScanFromSource(() => MediaPicker.Default.CapturePhotoAsync());
    }

    private async void OnPickFromGalleryClicked(object sender, EventArgs e)
    {
        await ScanFromSource(() => MediaPicker.Default.PickPhotoAsync());
    }

    private async Task ScanFromSource(Func<Task<FileResult?>> sourceFunc)
    {
        try
        {
            var photo = await sourceFunc();
            if (photo is null) return;

            using var stream = await photo.OpenReadAsync();
            using var memoryStream = new MemoryStream();
            await stream.CopyToAsync(memoryStream);
            var imageBytes = memoryStream.ToArray();

            // Show the captured image in the UI
            CapturedImage.Source = ImageSource.FromStream(() =>
                new MemoryStream(imageBytes));

            // Process with IronBarcode
            var bitmap = AnyBitmap.FromBytes(imageBytes);
            var options = new BarcodeReaderOptions
            {
                Speed = ReadingSpeed.Balanced,
                ExpectMultipleBarcodes = false
            };

            var results = await BarcodeReader.ReadAsync(bitmap, options);

            if (results.Any())
            {
                var first = results.First();
                ResultLabel.Text = $"Value: {first.Value}";
                FormatLabel.Text = $"Format: {first.BarcodeType}";
            }
            else
            {
                ResultLabel.Text = "No barcode detected";
                FormatLabel.Text = string.Empty;
            }
        }
        catch (FeatureNotSupportedException)
        {
            await DisplayAlert("Unsupported",
                "Camera is not available on this device.", "OK");
        }
        catch (PermissionException)
        {
            await DisplayAlert("Permission Required",
                "Please grant camera permission in Settings.", "OK");
        }
        catch (Exception ex)
        {
            await DisplayAlert("Error",
                $"Scanning failed: {ex.Message}", "OK");
        }
    }
}

using IronBarCode;
using IronSoftware.Drawing;

namespace BarcodeScannerApp;

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

    private async void OnScanClicked(object sender, EventArgs e)
    {
        await ScanFromSource(() => MediaPicker.Default.CapturePhotoAsync());
    }

    private async void OnPickFromGalleryClicked(object sender, EventArgs e)
    {
        await ScanFromSource(() => MediaPicker.Default.PickPhotoAsync());
    }

    private async Task ScanFromSource(Func<Task<FileResult?>> sourceFunc)
    {
        try
        {
            var photo = await sourceFunc();
            if (photo is null) return;

            using var stream = await photo.OpenReadAsync();
            using var memoryStream = new MemoryStream();
            await stream.CopyToAsync(memoryStream);
            var imageBytes = memoryStream.ToArray();

            // Show the captured image in the UI
            CapturedImage.Source = ImageSource.FromStream(() =>
                new MemoryStream(imageBytes));

            // Process with IronBarcode
            var bitmap = AnyBitmap.FromBytes(imageBytes);
            var options = new BarcodeReaderOptions
            {
                Speed = ReadingSpeed.Balanced,
                ExpectMultipleBarcodes = false
            };

            var results = await BarcodeReader.ReadAsync(bitmap, options);

            if (results.Any())
            {
                var first = results.First();
                ResultLabel.Text = $"Value: {first.Value}";
                FormatLabel.Text = $"Format: {first.BarcodeType}";
            }
            else
            {
                ResultLabel.Text = "No barcode detected";
                FormatLabel.Text = string.Empty;
            }
        }
        catch (FeatureNotSupportedException)
        {
            await DisplayAlert("Unsupported",
                "Camera is not available on this device.", "OK");
        }
        catch (PermissionException)
        {
            await DisplayAlert("Permission Required",
                "Please grant camera permission in Settings.", "OK");
        }
        catch (Exception ex)
        {
            await DisplayAlert("Error",
                $"Scanning failed: {ex.Message}", "OK");
        }
    }
}

この実装では、カメラとギャラリーのパス間で画像処理ロジックが重複しないように、共有ヘルパーメソッドを使用します。 AnyBitmap.FromBytes メソッドは、JPEG、PNG、WebP、およびその他の一般的な画像フォーマットを自動的に処理します。手動でフォーマットを検出する必要はありません。

結果オブジェクトには、他のプロパティに加えて、first.Value (デコードされた文字列)、first.BarcodeType (フォーマット列挙型)、および first.BarcodeImage (検出されたバーコード領域の切り抜き画像) が公開されます。 完全なリストについては、 BarcodeResult クラスのドキュメントを参照してください。

高度なスキャンオプションはどのように設定するのですか？

IronBarcode は、特定のユースケースに合わせて検出動作を微調整できる BarcodeReaderOptions オブジェクトを公開します。 これらのオプションを理解することで、アプリケーションのニーズに基づいて、速度と精度とのバランスを取ることができます。

var options = new BarcodeReaderOptions
{
    Speed = ReadingSpeed.Balanced,
    ExpectMultipleBarcodes = true,
    ExpectBarcodeTypes = BarcodeEncoding.QRCode | BarcodeEncoding.Code128
};

var results = await BarcodeReader.ReadAsync(bitmap, options);

var options = new BarcodeReaderOptions
{
    Speed = ReadingSpeed.Balanced,
    ExpectMultipleBarcodes = true,
    ExpectBarcodeTypes = BarcodeEncoding.QRCode | BarcodeEncoding.Code128
};

var results = await BarcodeReader.ReadAsync(bitmap, options);

var options = new BarcodeReaderOptions
{
    Speed = ReadingSpeed.Detailed,
    ImageFilters = new ImageFilterCollection
    {
        new SharpenFilter(),
        new ContrastFilter(1.2f)
    }
};

var options = new BarcodeReaderOptions
{
    Speed = ReadingSpeed.Detailed,
    ImageFilters = new ImageFilterCollection
    {
        new SharpenFilter(),
        new ContrastFilter(1.2f)
    }
};

よくあるトラブルシューティングのシナリオにはどのように対処しますか？

適切に設定されたMAUIバーコードスキャナーであっても、デバイス固有の動作、画像品質の問題、またはプラットフォームの制約によって問題が発生する可能性があります。

次のステップは何ですか?

IronBarcodeで動作するMAUIバーコードスキャナーが使えるようになったので、アプリケーションの要件に応じていくつかの選択肢があります。

-バーコードの生成-- IronBarcodeには、文字列データからQRコード、Code 128ラベル、その他の形式のバーコードを作成するための バーコード生成APIが含まれています。 -バッチスキャン-- BarcodeReader.ReadAsync と ExpectMultipleBarcodes = true を使用して、ループで複数の画像ファイルを処理します。 バッチスキャンの例を参照してください

• PDF バーコード抽出-- IronBarcode は、同じ BarcodeReader クラスを使用して PDF ドキュメントに埋め込まれたバーコードを読み取ることができます。 PDF形式のバーコード読み取りに関するドキュメントをご覧ください。 -スタイル設定とブランディング- 生成されたバーコードの視覚的な出力を、色、ロゴ、注釈でカスタマイズします。 バーコードのスタイル設定オプションを参照してください -その他のIronSoftware製品-- MAUIアプリでPDF生成、OCR、スプレッドシートのサポートも必要な場合は、一貫したクロスプラットフォーム機能を提供するIron Suite全体を検討してください。

無料トライアルライセンスから始めて、評価期間中は制限なく導入できます。 生産ライセンスのオプションとボリュームディスカウントについては、 IronBarcodeの価格ページをご覧ください。 IronBarcodeのドキュメントポータルとIronBarcodeのGitHubリポジトリには、追加のコード例とコミュニティサポートが掲載されています。