QRCode Scanner 项目教程

最新推荐文章于 2025-04-08 11:10:43 发布

周屹隽

最新推荐文章于 2025-04-08 11:10:43 发布

阅读量386

点赞数 3

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/gitblog_00583/article/details/141214684

QRCode Scanner 项目教程

qrcode_scanner🛠 Flutter QR code scanner plugin.项目地址:https://gitcode.com/gh_mirrors/qr/qrcode_scanner

项目介绍

qrcode_scanner 是一个用于 Flutter 应用的二维码扫描库。它能够在 Android 和 iOS 平台上原生嵌入二维码扫描功能，提供无缝的 Flutter 集成体验。该项目使用 zxing 库在 Android 上进行二维码解析，而在 iOS 上则使用 MTBBarcodeScanner。尽管底层框架不再维护，但该项目仍处于维护模式，仅接受错误修复和小幅增强。

项目快速启动

安装依赖

首先，在您的 Flutter 项目的 pubspec.yaml 文件中添加 qrcode_scanner 依赖：

dependencies:
  flutter:
    sdk: flutter
  qr_code_scanner: ^1.0.1

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

添加权限

在 Android 和 iOS 项目中添加必要的权限：

Android

在 android/app/build.gradle 文件中设置最小 SDK 版本：

android {
    defaultConfig {
        minSdkVersion 20
    }
}

在 android/app/src/main/AndroidManifest.xml 文件中添加权限：

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

iOS

在 ios/Runner/Info.plist 文件中添加权限：

<key>NSCameraUsageDescription</key>
<string>我们需要使用您的相机来扫描二维码</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>我们需要访问您的相册来保存二维码图片</string>

编写扫描页面

创建一个新的 Dart 文件 scan_page.dart，并添加以下代码：

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

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

class _ScanPageState extends State<ScanPage> {
  final GlobalKey qrKey = GlobalKey(debugLabel: 'QR');
  QRViewController controller;
  Barcode result;

  @override
  void reassemble() {
    super.reassemble();
    if (Platform.isAndroid) {
      controller.pauseCamera();
    } else if (Platform.isIOS) {
      controller.resumeCamera();
    }
  }

  void _onQRViewCreated(QRViewController controller) {
    this.controller = controller;
    controller.scannedDataStream.listen((scanData) {
      setState(() {
        result = scanData;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('扫描二维码')),
      body: Column(
        children: <Widget>[
          Expanded(
            flex: 5,
            child: QRView(
              key: qrKey,
              onQRViewCreated: _onQRViewCreated,
            ),
          ),
          Expanded(
            flex: 1,
            child: Center(
              child: (result != null) ? Text('扫描结果: ${result.code}') : Text('请扫描二维码'),
            ),
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    controller?.dispose();
    super.dispose();
  }
}

在您的应用中导航到 ScanPage 即可开始扫描二维码。