Flutterでバーコードをスキャンする (2022/05/02)

はじめに

Flutterでバーコードスキャンをする方法はbarcode_scanパッケージを使用しますが、2022年現在ではbarcode_scan2を使用するようになっています。最新の方法が検索しても載っていなかったので備忘録。

1. プラットフォームの設定

iosとAndroidでカメラを使用する設定をします。
以下の二つのファイルに追加します。

• Android

android/app/src/main/AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="~~~~~~~~~~~~~~~~~~~~~~~~">
    <uses-permission android:name="android.permission.CAMERA" />
...

manifestタグの直下。おそらく3行目くらい

• ios

ios/Runner/Info.plist

<dict>
...
    <key>NSCameraUsageDescription</key>
    <string>Camera permission is required for barcode scanning.</string>
...
</dict>

タグ内。タグのすぐ下がわかりやすい

2. パッケージの設定

プロジェクトに読み込ませるパッケージを指定します。
ここが主に以前の方法と違います。２になってます。

pubspec.yaml

dependencies:
...
    # https://pub.dev/packages/barcode_scan2
    barcode_scan2: any
...

ここを書いたらパッケージを更新しましょう。
ターミナルで以下のコマンドを入力します。

flutter packages get

バージョン関係のエラーが出たら多分これなんで以下を書き換える。詳しくは参考のサイトを見てください

android/app/build.gradle

defaultConfig {
...
    minSdkVersion 18
...
}

3. import

以下の二つをインポートします。

import 'package:barcode_scan2/platform_wrapper.dart';
import 'package:flutter/services.dart';

4. スキャン

以下の関数をボタンを押したときにせってするとスキャンされます
readDataにはスキャンの内容、typeDataにはバーコードの種類が格納されます。

String readData = "";
String typeData = "";

Future scan() async {
  try {
    var scan = await BarcodeScanner.scan();
    setState(() => {
      readData = scan.rawContent,
      typeData = scan.format.name,
    });
  }
  on PlatformException catch (e) {
    if (e.code == BarcodeScanner.cameraAccessDenied) {
      setState(() {
        readData = 'Camera permissions are not valid.';
      });
    }
    else {
      setState(() => readData = 'Unexplained error : $e');
    }
  }
  on FormatException{
    setState(() => readData = 'Failed to read (I used the back button before starting the scan).');
  } catch (e) {
    setState(() => readData = 'Unknown error : $e');
  }
}

ちなみにボタンへの設定方法はScaffold内のfloatingActionButtonの方法を例とします。

floatingActionButton: FloatingActionButton(
  onPressed: scan,
  tooltip: 'QR SCAN',
  child: Icon(Icons.add),
), 

参考