首页 > 解决方案 > 当 Provider 不为空时,Flutter 监听一个值并导航到另一个屏幕

问题描述

在这里,我有一个 QR 视图来扫描我的屏幕中的 qr 码,并且当我得到结果时我正在使用我想要的提供程序,因此 barCodeResult 不为空来导航到我尝试使用添加侦听器的结果屏幕,但我认为这很糟糕练习它可以工作,但有时我会收到一个错误说 context.read "Null Check Operator was called on Null"

实现这一目标的最佳方法是什么?

而且我在我的提供程序文件中声明了控制器,但我想处理它但是当我尝试这样做时,我也得到了同样的错误

这是我的 QRView 屏幕代码


class QRViewPage extends StatefulWidget {
  const QRViewPage({Key? key}) : super(key: key);

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

class _QRViewPageState extends State<QRViewPage> {
  final GlobalKey qrKey = GlobalKey(debugLabel: 'QR');

  @override
  void reassemble() {
    super.reassemble();
    if (Platform.isAndroid) {
      context.read<QRProvider>().controller?.pauseCamera();
    } else if (Platform.isIOS) {
      context.read<QRProvider>().controller?.resumeCamera();
    }
  }

  @override
  Widget build(BuildContext context) {
    final _qrProvider = context.watch<QRProvider>()
      ..addListener(() {
        try {
          if (context.read<QRProvider>().barCodeResult != null) {
            context.read<QRProvider>().controller?.pauseCamera();
            navigateTo(context, const ResultPage());
          } else {
            print('Null value !!!!');
          }
        } catch (error) {
          print(error);
        }
      });
    return Scaffold(
      body: Stack(
        alignment: AlignmentDirectional.bottomCenter,
        children: [
          QRView(
            key: qrKey,
            onQRViewCreated: _qrProvider.onQRViewCreated,
            overlay: QrScannerOverlayShape(
              borderColor: kPrimaryColor,
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(bottom: 50),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                ControllerButton(
                  icon: Icons.flip_camera_ios,
                  onTap: () async {
                    await _qrProvider.flipCamera();
                  },
                ),
                const SizedBox(width: 20),
                ControllerButton(
                  icon: Icons.flash_off,
                  onTap: () async {
                    await _qrProvider.toggleFlash();
                  },
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

以及 QRView 小部件的 onCreated 方法

  onQRViewCreated(qr.QRViewController qrController) {
    _controller = qrController;
    _controller?.scannedDataStream.listen((scanData) {
      _barCodeResult = scanData;
      notifyListeners();
    });
  }

标签: flutterdartqr-codebarcodebarcode-scanner

解决方案


推荐阅读