【笔记】Flutter扫描二维码

发表于 更新于 阅读次数：

前言

Flutter扫描二维码

通过qr_code_scanner扫描二维码

下载依赖

1
flutter pub add qr_code_scanner

引入依赖

1
import 'package:qr_code_scanner/qr_code_scanner.dart';

扫描二维码

连续扫码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
import 'package:flutter/material.dart';
import 'package:qr_code_scanner/qr_code_scanner.dart';

main() async {
  runApp(
    const MaterialApp(
      home: App(),
    ),
  );
}

class App extends StatefulWidget {
  final Function(Barcode? result)? completed;

  const App({
    Key? key,
    this.completed,
  }) : super(key: key);

  @override
  AppState createState() => AppState();
}

class AppState extends State<App> {
  final GlobalKey qrKey = GlobalKey();
  QRViewController? _controller;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("文本内容")),
      body: Column(
        children: [
          SizedBox(
            width: 192,
            height: 108,
            child: QRView(
              key: qrKey,
              onQRViewCreated: (QRViewController controller) {
                _controller = controller;
                controller.scannedDataStream.listen((result) {
                  print(result.code);
                });
              },
            ),
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    _controller!.dispose();
    super.dispose();
  }
}

扫码后停止

_controller!.stopCamera()：停止扫码
_controller!.pauseCamera()：暂停扫码，画面也会静止
_controller!.resumeCamera()：继续扫码，恢复被暂停的画面
_controller!.flipCamera()：翻转摄像头

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
import 'package:flutter/material.dart';
import 'package:qr_code_scanner/qr_code_scanner.dart';

main() async {
  runApp(
    const MaterialApp(
      home: App(),
    ),
  );
}

class App extends StatefulWidget {
  final Function(Barcode? result)? completed;

  const App({
    Key? key,
    this.completed,
  }) : super(key: key);

  @override
  AppState createState() => AppState();
}

class AppState extends State<App> {
  final GlobalKey qrKey = GlobalKey();
  QRViewController? _controller;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("文本内容")),
      body: Column(
        children: [
          SizedBox(
            width: 192,
            height: 108,
            child: QRView(
              key: qrKey,
              onQRViewCreated: (QRViewController controller) {
                _controller = controller;
                controller.scannedDataStream.listen((result) {
                  print(result.code);
                  _controller!.stopCamera();
                });
              },
            ),
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    _controller!.dispose();
    super.dispose();
  }
}

完成

参考文献

稀土掘金——剪刀石头布啊