【笔记】Flutter生成二维码

发表于 更新于 阅读次数：

前言

Flutter生成二维码

通过qr_flutter

下载依赖

1
flutter pub add qr_flutter

引入依赖

1
import 'package:qr_flutter/qr_flutter.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
import 'package:flutter/material.dart';
import 'package:qr_flutter/qr_flutter.dart';

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

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

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

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("文本内容")),
      body: Column(
        children: [
          QrImageView(
            data: '1',
            version: QrVersions.auto,
            size: 200.0,
          )
        ],
      ),
    );
  }
}

生成带logo的二维码

  • 在项目根目录创建一个images目录用于存放图片
1
2
3
+ 项目名
  + images
    - 图片名.jpg
在配置文件中加载静态资源
pubspec.yaml
1
2
3
flutter:
  assets:
    - images/图片名.jpg
生成带logo的二维码

images/图片名.jpg：指定图片保存的路径

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
import 'package:flutter/material.dart';
import 'package:qr_flutter/qr_flutter.dart';

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

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

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

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("文本内容")),
      body: Column(
        children: [
          QrImageView(
            data: '1',
            version: QrVersions.auto,
            size: 200.0,
            gapless: false,
            embeddedImage: AssetImage("images/图片名.jpg"),
            embeddedImageStyle: QrEmbeddedImageStyle(
              size: Size(80, 80),
            ),
          )
        ],
      ),
    );
  }
}

完成

参考文献

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