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

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

quick_scanner_plus 是一个用于 Flutter 的跨平台(Windows/macOS)扫描插件。此插件允许你轻松地将扫描功能集成到你的 Flutter 应用程序中,使用户能够利用连接的扫描仪完成各种任务。

特性

  • 开始和停止监控可用扫描仪。
  • 获取已连接扫描仪的列表。
  • 扫描文件并获取其路径。

使用

import 'package:quick_scanner_plus/quick_scanner_plus.dart';
import 'package:path_provider/path_provider.dart';

// 开始监控可用扫描仪
QuickScannerPlus.startWatch();

// 获取已连接扫描仪的列表
var _scanners = await QuickScannerPlus.getScanners();

// 获取应用程序的文档目录
var directory = await getApplicationDocumentsDirectory();

// 使用第一个可用扫描仪扫描文件
var scannedFile = await QuickScannerPlus.scanFile(_scanners.first.id, directory.path);

// 停止监控扫描仪
QuickScannerPlus.stopWatch();

此外,完整的示例代码可以在 example 目录下的 lib/main.dart 文件中找到,或者在 pub.dartlang.org 的 ‘Example’ 标签页查看。

完整示例代码

import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart';
import 'dart:io';

import 'package:quick_scanner_plus/quick_scanner_plus.dart';

void main() {
  // 应用程序入口点
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  // 用于保存可用扫描仪的列表
  List<ScannerInfo> _scanners = [];
  // 当前选中的扫描仪
  ScannerInfo? _selectedScanner;
  // 扫描文件的路径
  String? _scannedFilePath;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('扫描器示例应用'), // 应用程序标题
        ),
        body: Padding(
          padding: const EdgeInsets.all(16.0), // 身体部分的内边距
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  ElevatedButton(
                    child: Text('开始监控'), // 按钮以开始监控扫描仪
                    onPressed: () async {
                      await QuickScannerPlus.startWatch();
                    },
                  ),
                  ElevatedButton(
                    child: Text('停止监控'), // 按钮以停止监控扫描仪
                    onPressed: () async {
                      await QuickScannerPlus.stopWatch();
                    },
                  ),
                ],
              ),
              SizedBox(height: 20), // 在行之间添加间距
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  ElevatedButton(
                    child: Text('获取扫描仪'), // 按钮以获取可用扫描仪列表
                    onPressed: () async {
                      // 获取扫描仪列表并更新状态
                      var list = await QuickScannerPlus.getScanners();
                      setState(() {
                        _scanners = list;
                        if (_scanners.isNotEmpty) {
                          _selectedScanner = _scanners.first; // 设置第一个扫描仪为默认选择
                        }
                      });
                    },
                  ),
                  DropdownButton<ScannerInfo>(
                    hint: Text('选择扫描仪'), // 下拉菜单提示
                    value: _selectedScanner, // 当前选择的扫描仪
                    items: _scanners.map((scanner) {
                      return DropdownMenuItem(
                        value: scanner,
                        child: Text(scanner.name), // 显示扫描仪名称
                      );
                    }).toList(),
                    onChanged: (value) {
                      // 更新选中的扫描仪
                      setState(() {
                        _selectedScanner = value;
                      });
                    },
                  ),
                ],
              ),
              SizedBox(height: 20), // 在行之间添加间距
              ElevatedButton(
                child: Text('扫描'), // 按钮以启动扫描
                onPressed: _selectedScanner == null
                    ? null // 如果没有选择扫描仪,则禁用按钮
                    : () async {
                        // 获取应用程序的文档目录
                        var directory = await getApplicationDocumentsDirectory();
                        // 使用选定扫描仪的ID扫描文件
                        var scannedFile = await QuickScannerPlus.scanFile(
                            _selectedScanner!.id,
                            directory.path); // 使用选定的扫描仪ID
                        setState(() {
                          _scannedFilePath = scannedFile; // 更新扫描文件路径
                        });
                      },
              ),
              SizedBox(height: 20), // 在行之间添加间距
              if (_scannedFilePath != null) ...[
                Text('扫描图像:'),
                SizedBox(height: 10),
                Image.file(
                  File(_scannedFilePath!), // 显示扫描图像
                  height: 200,
                ),
              ],
            ],
          ),
        ),
      ),
    );
  }
}

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

1 回复

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


quick_scanner_plus 是一个用于 Flutter 应用的二维码扫描插件。它基于 ML KitZXing 库,支持 Android 和 iOS 平台。使用该插件可以轻松地在 Flutter 应用中实现二维码扫描功能。

1. 添加依赖

首先,在 pubspec.yaml 文件中添加 quick_scanner_plus 依赖:

dependencies:
  flutter:
    sdk: flutter
  quick_scanner_plus: ^1.0.0  # 请检查最新版本

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

2. 配置权限

为了使用摄像头进行扫描,你需要在 Android 和 iOS 平台上配置相应的权限。

Android

AndroidManifest.xml 文件中添加以下权限:

<uses-permission android:name="android.permission.CAMERA" />

iOS

Info.plist 文件中添加以下权限:

<key>NSCameraUsageDescription</key>
<string>我们需要访问您的相机以扫描二维码</string>

3. 使用插件

下面是一个简单的示例,展示如何使用 quick_scanner_plus 进行二维码扫描。

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: QRScannerScreen(),
    );
  }
}

class QRScannerScreen extends StatefulWidget {
  [@override](/user/override)
  _QRScannerScreenState createState() => _QRScannerScreenState();
}

class _QRScannerScreenState extends State<QRScannerScreen> {
  String _scanResult = 'Scan a QR code';

  Future<void> _scanQRCode() async {
    try {
      final qrCode = await QuickScannerPlus.scan();
      if (qrCode != null) {
        setState(() {
          _scanResult = qrCode;
        });
      }
    } catch (e) {
      setState(() {
        _scanResult = 'Failed to scan QR code: $e';
      });
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('QR Code Scanner'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(_scanResult),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _scanQRCode,
              child: Text('Scan QR Code'),
            ),
          ],
        ),
      ),
    );
  }
}
回到顶部