Flutter：使用barcode_scan插件后Snackbar不显示

Posted 2023-02-23

【中文标题】Flutter：使用barcode_scan插件后Snackbar不显示

【英文标题】：Flutter: Snackbar does not show up after using barcode_scan plugin

【发布时间】：2018-09-24 16:19:21

【问题描述】：

在我的 Flutter 应用中，我想扫描一些条形码。扫描条形码后，我想显示一个小吃店。该应用应在 android 设备上运行。

很遗憾，小吃店从未出现。 两种功能（条码扫描和显示快餐栏）分别工作正常。

在调试期间，会发生以下情况：

相机打开 条码被扫描 条形码存储在变量中 屏幕变黑 小吃店的代码已执行。小吃店不显示。 离开该方法后，将再次呈现要在其上显示小吃店的视图/小部件。

条形码扫描由0.0.3版本的flutter插件barcode_scan处理。

这里是匹配代码：

final GlobalKey<ScaffoldState> keyScaffold = new GlobalKey<ScaffoldState>();

[...]

@override
Widget build(BuildContext context) 
  return new Scaffold(
    key: keyScaffold,
    [...]


Future scan() async 
  String snackBarMessage = "No error";

  try 
    String barcode = await BarcodeScanner.scan();
    setState(() => _barcodeController.text = barcode);
    snackBarMessage = barcode;
   on PlatformException catch (e) 
    if (e.code == BarcodeScanner.CameraAccessDenied) 
      snackBarMessage = 'The user did not grant the camera permission!';
     else 
      snackBarMessage = 'Unknown error: $e';
    
   on FormatException 
    snackBarMessage =
        'null (User returned using the "back"-button before scanning anything. Result)';
   catch (e) 
    snackBarMessage = 'Unknown error: $e';
  

  keyScaffold.currentState.showSnackBar(new SnackBar(
    content: new Text(snackBarMessage),
    duration: new Duration(seconds: 5),
  ));

【参考方案1】：

在我的 Flutter 原型应用程序（flutter 版本 0.5.1 beta）上，我同时使用了snackbar 和barcode_scan 插件（版本0.0.4）并且snackbar 确实出现了（扫描结果为字符串)。所有学分都归于 Wahib Ul Haq，以便于小吃店编辑：

Display SnackBar in Flutter

就我而言，有两件事值得注意。

我根本不使用 keyScaffold。我将 BuildContext 声明为一个变量（我称之为支架上下文）来保存 Scaffold 的主体。

我声明并初始化了一个新的 Scaffold。对于它的主体，我编写了一个 Builder。在构建器内部，我将 scaffoldContext 初始化为构建器的上下文。

这是我的代码以便于理解：

import 'package:flutter/material.dart';
import 'package:barcode_scan/barcode_scan.dart';
import 'package:flutter/services.dart';
[...]

void main() 
  runApp(MyApp());


class MyApp extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      [...],
      home: MyHomePage(),
    );
  


class MyHomePage extends StatefulWidget 
  MyHomePage(Key key) : super(key: key);

  @override
  _MyHomePageState createState() => new _MyHomePageState();


class _MyHomePageState extends State<MyHomePage>   
  //This is what I meant in note #1.
  BuildContext scaffoldContext;

  String barcode;

  @override
  initState() 
    super.initState();
  


  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text('MyApp'),
      ),
      //This is what I meant in note #2.
      body: Builder(builder: (BuildContext context) 
        scaffoldContext = context;
        return Center(
            child: Column(children: <Widget>[
              ListTile(
              [...]
              ),
              ListTile(
              [...]
              ),
              [...]
            ]

    ));),

      floatingActionButton: FloatingActionButton(
        mini: true,
        child: Icon(Icons.crop_free), onPressed: fabPressed),
    );

  void createSnackBar(String message) 
    final snackBar = new SnackBar(content: new Text(message),
        backgroundColor: Colors.black

    );

    Scaffold.of(scaffoldContext).showSnackBar(snackBar);
  

  void fabPressed() async 
    barcode = "";

    try 
    barcode = await BarcodeScanner.scan();
    setState(() => this.barcode = barcode);

    createSnackBar(barcode);
    
    on PlatformException catch (e) 
      if (e.code == BarcodeScanner.CameraAccessDenied) 
        setState(() 
          this.barcode = 'The user did not grant the camera permission!';
        );
         else 
          setState(() => this.barcode = 'Unknown error: $e');
      
    
    on FormatException 
      setState(() =>
  this.barcode = 'null (User returned using the "back"-button before scanning anything. Result)');
    
    catch (e) 
      setState(() => this.barcode = 'Unknown error: $e');