Flutter条形码扫描插件ai_barcode_scanner的使用

Flutter是一个用于开发跨平台移动应用的框架，而ai_barcode_scanner插件则为Flutter应用提供了条形码和二维码的扫描功能。以下是关于如何使用该插件的详细介绍。

插件信息

插件版本与赞助

• Pub Package
• GitHub Sponsors

截图展示

视频演示	界面截图

平台支持

功能支持

平台特定设置

Android

默认情况下，此包使用捆绑版MLKit Barcode-scanning for Android。要使用非捆绑版，请在/android/gradle.properties文件中添加以下行：

dev.steenbakker.mobile_scanner.useUnbundled=true

iOS

需要在Info.plist文件中添加以下键值对：

<key>NSCameraUsageDescription</key>
<string>本应用需要相机权限以扫描二维码</string>

<key>NSPhotoLibraryUsageDescription</key>
<string>本应用需要相册权限以从照片库获取二维码</string>

macOS

确保在XCode -> Signing & Capabilities中授予了相机权限。

Web

无需手动添加脚本，首次使用时会自动加载。

使用示例

下面是一个完整的示例代码，展示了如何在Flutter应用中集成并使用ai_barcode_scanner插件进行条形码扫描。

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

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  String barcode = 'Tap to scan';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Barcode Scanner'),
      ),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            ElevatedButton(
              child: const Text('Scan Barcode'),
              onPressed: () async {
                await Navigator.of(context).push(
                  MaterialPageRoute(
                    builder: (context) => AiBarcodeScanner(
                      onDispose: () {
                        /// This is called when the barcode scanner is disposed.
                        /// You can write your own logic here.
                        debugPrint("Barcode scanner disposed!");
                      },
                      hideGalleryButton: false,
                      controller: MobileScannerController(
                        detectionSpeed: DetectionSpeed.noDuplicates,
                      ),
                      onDetect: (BarcodeCapture capture) {
                        final String? scannedValue =
                            capture.barcodes.first.rawValue;
                        debugPrint("Barcode scanned: $scannedValue");

                        final Uint8List? image = capture.image;
                        debugPrint("Barcode image: $image");

                        final Object? raw = capture.raw;
                        debugPrint("Barcode raw: $raw");

                        final List<Barcode> barcodes = capture.barcodes;
                        debugPrint("Barcode list: $barcodes");

                        setState(() {
                          barcode = scannedValue ?? 'No barcode found';
                        });
                      },
                      validator: (value) {
                        if (value.barcodes.isEmpty) {
                          return false;
                        }
                        if (!(value.barcodes.first.rawValue
                                ?.contains('flutter.dev') ??
                            false)) {
                          return false;
                        }
                        return true;
                      },
                    ),
                  ),
                );
              },
            ),
            Text(barcode),
          ],
        ),
      ),
    );
  }
}

在这个示例中，我们创建了一个简单的Flutter应用程序，其中包含一个按钮用于启动条形码扫描页面。当扫描到条形码时，它会在界面上显示扫描结果。此外，还设置了验证器来确保只接受包含特定字符串（如’flutter.dev’）的条形码。

希望这些信息能帮助您更好地理解和使用ai_barcode_scanner插件！如果有任何问题或需要进一步的帮助，请随时提问。