代码之家  ›  专栏  ›  技术社区  ›  Jaimin Modi

Flutter中的二维码扫描仪-未打开二维码扫描仪视图

  •  0
  • Jaimin Modi  · 技术社区  · 3 年前

    我正在使用下面的puglin在flutter中打开QR扫描仪:

    https://pub.dev/packages/qr_code_scanner

    我已经从插件示例中添加了必要的类,但当我按下按钮时,什么也没发生。

    以下是公共规范:

    qr_code_scanner: ^1.0.1
    

    我添加了以下类:

    class QRViewExample extends StatefulWidget {
      const QRViewExample({Key? key}) : super(key: key);
    
      @override
      State<StatefulWidget> createState() => _QRViewExampleState();
    }
    
    class _QRViewExampleState extends State<QRViewExample> {
      Barcode? result;
      QRViewController? controller;
      final GlobalKey qrKey = GlobalKey(debugLabel: 'QR');
    
      // In order to get hot reload to work we need to pause the camera if the platform
      // is android, or resume the camera if the platform is iOS.
      @override
      void reassemble() {
        super.reassemble();
        if (Platform.isAndroid) {
          controller!.pauseCamera();
        }
        controller!.resumeCamera();
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Column(
            children: <Widget>[
              Expanded(flex: 4, child: _buildQrView(context)),
              Expanded(
                flex: 1,
                child: FittedBox(
                  fit: BoxFit.contain,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      if (result != null)
                        Text(
                            'Barcode Type: ${describeEnum(result!.format)}   Data: ${result!.code}')
                      else
                        const Text('Scan a code'),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
                          Container(
                            margin: const EdgeInsets.all(8),
                            child: ElevatedButton(
                                onPressed: () async {
                                  await controller?.toggleFlash();
                                  setState(() {});
                                },
                                child: FutureBuilder(
                                  future: controller?.getFlashStatus(),
                                  builder: (context, snapshot) {
                                    return Text('Flash: ${snapshot.data}');
                                  },
                                )),
                          ),
                          Container(
                            margin: const EdgeInsets.all(8),
                            child: ElevatedButton(
                                onPressed: () async {
                                  await controller?.flipCamera();
                                  setState(() {});
                                },
                                child: FutureBuilder(
                                  future: controller?.getCameraInfo(),
                                  builder: (context, snapshot) {
                                    if (snapshot.data != null) {
                                      return Text(
                                          'Camera facing ${describeEnum(snapshot.data!)}');
                                    } else {
                                      return const Text('loading');
                                    }
                                  },
                                )),
                          )
                        ],
                      ),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
                          Container(
                            margin: const EdgeInsets.all(8),
                            child: ElevatedButton(
                              onPressed: () async {
                                await controller?.pauseCamera();
                              },
                              child: const Text('pause',
                                  style: TextStyle(fontSize: 20)),
                            ),
                          ),
                          Container(
                            margin: const EdgeInsets.all(8),
                            child: ElevatedButton(
                              onPressed: () async {
                                await controller?.resumeCamera();
                              },
                              child: const Text('resume',
                                  style: TextStyle(fontSize: 20)),
                            ),
                          )
                        ],
                      ),
                    ],
                  ),
                ),
              )
            ],
          ),
        );
      }
    
      Widget _buildQrView(BuildContext context) {
        // For this example we check how width or tall the device is and change the scanArea and overlay accordingly.
        var scanArea = (MediaQuery.of(context).size.width < 400 ||
            MediaQuery.of(context).size.height < 400)
            ? 150.0
            : 300.0;
        // To ensure the Scanner view is properly sizes after rotation
        // we need to listen for Flutter SizeChanged notification and update controller
        return QRView(
          key: qrKey,
          onQRViewCreated: _onQRViewCreated,
          overlay: QrScannerOverlayShape(
              borderColor: Colors.red,
              borderRadius: 10,
              borderLength: 30,
              borderWidth: 10,
              cutOutSize: scanArea),
          onPermissionSet: (ctrl, p) => _onPermissionSet(context, ctrl, p),
        );
      }
    
      void _onQRViewCreated(QRViewController controller) {
        setState(() {
          this.controller = controller;
        });
        controller.scannedDataStream.listen((scanData) {
          setState(() {
            result = scanData;
          });
        });
      }
    
      void _onPermissionSet(BuildContext context, QRViewController ctrl, bool p) {
        if (!p) {
          ScaffoldMessenger.of(context).showSnackBar(
            const SnackBar(content: Text('no Permission')),
          );
        }
      }
    
      @override
      void dispose() {
        controller?.dispose();
        super.dispose();
      }
    }
    

    最后,如下所示:

    InkWell(
              onTap: () {
                         QRViewExample();
                        },
              child: Image.asset(...),
       );
    

    但什么也没发生。即使在日志中我也找不到任何东西。可能是什么问题?

    1 回复  |  直到 3 年前
        1
  •  2
  •   pmatatias    3 年前

    您应该将其作为新屏幕进行导航。它不是一种方法或功能。它是 statefullwidget 。所以您必须将其用作Widget。

    这样地:

    InkWell(
      onTap: () {
      Navigator.push(context,
          MaterialPageRoute(
             builder: (context) => const QRViewExample()));
      }
      child: Image.asset(...),
       );