Flutter二维码扫描插件barcode_scanner_kit的使用

Flutter二维码扫描插件barcode_scanner_kit的使用

特性

视觉

功能 Android iOS
条形码扫描

需求

iOS

  • 最低 iOS 部署目标:10.0
  • Xcode 12 或更新版本
  • Swift 5
  • ML Kit 只支持 64 位架构(x86_64 和 arm64)。请检查此 列表 以查看您的设备是否具有所需的功能。

由于 ML Kit 不支持 32 位架构(i386 和 armv7)(阅读更多),您需要在 Xcode 中排除 armv7 架构以运行 flutter build iosflutter build ipa

转到 Project > Runner > Build Settings > Excluded Architectures > Any SDK > armv7:

构建设置

然后您的 Podfile 应该看起来像这样:

# 添加这一行:
$iOSVersion = '10.0'

post_install do |installer|
  # 添加这些行:
  installer.pods_project.build_configurations.each do |config|
    config.build_settings["EXCLUDED_ARCHS[sdk=*]"] = "armv7"
    config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = $iOSVersion
  end
  
  installer.pods_project.targets.each do |target|
    flutter_additional_ios_build_settings(target)
    
    # 添加这些行:
    target.build_configurations.each do |config|
      if Gem::Version.new($iOSVersion) > Gem::Version.new(config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'])
        config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = $iOSVersion
      end
    end
    
  end
end

注意,最小的 IPHONEOS_DEPLOYMENT_TARGET 是 10.0,您可以将其设置为更新的版本但不能更旧。

Android

  • minSdkVersion: 21
  • targetSdkVersion: 29

使用方法

在您的 pubspec.yaml 文件中添加此插件作为依赖项。

在项目级别的 build.gradle 文件中,确保在 buildscript 和所有 allprojects 部分包含 Google 的 Maven 仓库(对于所有 API)。

<meta-data
        android:name="com.google.mlkit.vision.DEPENDENCIES"
        android:value="ica" />
    <!-- 要使用多个模型: android:value="ica,model2,model3" -->

使用这些选项:

  • ocr - 条形码扫描

1. 创建一个 InputImage

从路径创建:

final inputImage = InputImage.fromFilePath(filePath);

从文件创建:

final inputImage = InputImage.fromFile(file);

从字节创建:

final inputImage = InputImage.fromBytes(bytes: bytes, inputImageData: inputImageData);

从 CameraImage 创建(如果您正在使用 camera 插件):

final camera; // 您的相机实例
final WriteBuffer allBytes = WriteBuffer();
for (Plane plane in cameraImage.planes) {
  allBytes.putUint8List(plane.bytes);
}
final bytes = allBytes.done().buffer.asUint8List();

final Size imageSize = Size(cameraImage.width.toDouble(), cameraImage.height.toDouble());

final InputImageRotation imageRotation =
    InputImageRotationMethods.fromRawValue(camera.sensorOrientation) ??
        InputImageRotation.Rotation_0deg;

final InputImageFormat inputImageFormat =
    InputImageFormatMethods.fromRawValue(cameraImage.format.raw) ??
        InputImageFormat.NV21;

final planeData = cameraImage.planes.map(
  (Plane plane) {
    return InputImagePlaneMetadata(
      bytesPerRow: plane.bytesPerRow,
      height: plane.height,
      width: plane.width,
    );
  },
).toList();

final inputImageData = InputImageData(
  size: imageSize,
  imageRotation: imageRotation,
  inputImageFormat: inputImageFormat,
  planeData: planeData,
);

final inputImage = InputImage.fromBytes(bytes: bytes, inputImageData: inputImageData);

2. 创建一个检测器实例

// vision
final barcodeScanner = GoogleMlKit.vision.barcodeScanner();

3. 调用相应的方法

// vision
final List<Barcode> barcodes = await barcodeScanner.processImage(inputImage);

4. 从响应中提取数据

a. 提取条形码。

for (Barcode barcode in barcodes) {
  final BarcodeType type = barcode.type;
  final Rect boundingBox = barcode.value.boundingBox;
  final String displayValue = barcode.value.displayValue;
  final String rawValue = barcode.value.rawValue;

  // 查看 API 参考以获取完整的受支持类型列表
  switch (type) {
    case BarcodeType.wifi:
      BarcodeWifi barcodeWifi = barcode.value;
      break;
    case BarcodeValueType.url:
      BarcodeUrl barcodeUrl = barcode.value;
      break;
  }
}

5. 释放资源

// vision
barcodeScanner.close();

更多关于Flutter二维码扫描插件barcode_scanner_kit的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter二维码扫描插件barcode_scanner_kit的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,下面是一个关于如何在Flutter项目中使用barcode_scanner_kit插件来扫描二维码的示例代码。这个插件是一个功能强大的二维码和条形码扫描库。

1. 添加依赖

首先,在你的pubspec.yaml文件中添加barcode_scanner_kit依赖:

dependencies:
  flutter:
    sdk: flutter
  barcode_scanner_kit: ^0.0.3  # 请注意版本号,这里是一个示例版本号,实际使用时请检查最新版本

然后运行flutter pub get来安装依赖。

2. 导入包

在你的Dart文件中导入barcode_scanner_kit包:

import 'package:flutter/material.dart';
import 'package:barcode_scanner_kit/barcode_scanner_kit.dart';

3. 创建扫描页面

下面是一个简单的示例,展示如何使用barcode_scanner_kit来扫描二维码并显示结果:

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ScanPage(),
    );
  }
}

class ScanPage extends StatefulWidget {
  @override
  _ScanPageState createState() => _ScanPageState();
}

class _ScanPageState extends State<ScanPage> {
  String _result = '';

  Future<void> _scanQRCode() async {
    try {
      String result = await BarcodeScannerKit.scan();
      setState(() {
        _result = result;
      });
    } catch (e) {
      print('Error scanning QR code: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('QR Code Scanner'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Scan Result:',
              style: TextStyle(fontSize: 20),
            ),
            SizedBox(height: 20),
            Text(
              _result,
              style: TextStyle(fontSize: 24),
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _scanQRCode,
              child: Text('Scan QR Code'),
            ),
          ],
        ),
      ),
    );
  }
}

4. 权限处理

在Android上,你需要在AndroidManifest.xml文件中添加相机权限:

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

在iOS上,你需要在Info.plist文件中添加相机权限描述:

<key>NSCameraUsageDescription</key>
<string>Need camera access to scan QR codes</string>

此外,你可能还需要在iOS项目的ios/Runner/Info.plist文件中添加对隐私设置的描述,以确保应用能正确请求和使用相机权限。

5. 运行应用

确保你已经处理了必要的权限,然后运行你的Flutter应用。点击按钮将启动相机并尝试扫描二维码,扫描结果将显示在屏幕上。

这个示例代码展示了如何使用barcode_scanner_kit插件在Flutter应用中实现二维码扫描功能。如果你有更具体的需求或遇到问题,可以进一步查阅该插件的官方文档或提出具体的问题。

回到顶部