如何创建一个出现在所有屏幕上的小吃店？答案

【问题标题】：How to create a snack bar that appears in all screen?如何创建一个出现在所有屏幕上的小吃店？
【发布时间】：2020-02-21 05:06:55
【问题描述】：

我需要创建一个在没有连接时出现的小吃店，我创建了一个，但它只出现在一个屏幕中，我怎样才能让它在没有连接时在所有屏幕中可见。

在我的主屏幕中，我在 init 方法中将其称为 checkInternet(context);。它在主屏幕上完美运行，但是当我导航到其他屏幕时，它不显示小吃栏。

我的上网查功能：

import 'package:flushbar/flushbar.dart';

checkInternet(BuildContext context) async {

  // actively listen for status updates
  var listener = DataConnectionChecker().onStatusChange.listen((status) {
print('networrk status $status');
    switch (status) {
      case DataConnectionStatus.connected:
        shownewFlushBar(context,Colors.green,'You are Online',false);
        break;
      case DataConnectionStatus.disconnected:
        shownewFlushBar(context,Colors.red,'You are Offline',true);
        break;
    }
  });

  return await DataConnectionChecker().connectionStatus;
}

void shownewFlushBar(BuildContext context,Color bgcolor,String text,bool pindic)
{
  Flushbar(
    showProgressIndicator: pindic,
    message: text,
    backgroundColor: bgcolor,
    duration: Duration(seconds: 3),
    isDismissible: false,
  )..show(context);
}

谁能帮我解决这个问题。

【问题讨论】：

我为此使用了 pub.dev/packages/flashbar。由于您提到的原因，我发现小吃店很难使用
你的问题是你有很多脚手架和 Scaffold.of(context).showSnackBar(snackBar);使用起来很棘手吗？
我使用flushbar包。我的问题是，只要连接性发生变化，它就会在主屏幕中显示小吃栏，但是当我导航到其他屏幕然后连接性发生变化时，它不会出现。
我会更新我的问题

标签： flutter flutter-layout snackbar

【解决方案1】：

每当您重新访问另一个屏幕时，只需在您的 build 方法中检查互联网连接

依赖：connectivity: 0.4.3+6

1) 第一个选项

  @override
  Widget build(BuildContext context) {

       var isConnected = await isInternetConnected();
       if (isConnected != true) {
          // Snackbar show here
       }
  }

使用此方法检查Internet Connection

  Future<bool> isInternetConnected() async {
    var connectivityResult = await (Connectivity().checkConnectivity());
    if (connectivityResult == ConnectivityResult.mobile ||
        connectivityResult == ConnectivityResult.wifi) {
      return true;
    }
    return false;
  }

2) 第二种选择

在main.dart 文件的initState() 中添加监听器，这样每当连接发生变化时，您都会得到响应

  @override
  void initState() {
    super.initState();
    Connectivity().onConnectivityChanged.listen((ConnectivityResult result){
      if(result == ConnectivityResult.none){

          // use Future.delayed() if you want context in initState
          Future.delayed(Duration.zero,(){
            print(" Internet connection is lost");        
          });

      }
    });
  }

【讨论】：