简体   繁体   English

如果 flutter 中没有互联网,如何保持启动画面并显示警报对话框?

[英]How to hold the splash screen and show alert dialogue if there is no internet in flutter?

I am a newbie, and I am facing a problem beyond my little knowledge.我是一个新手,我面临着一个超出我所知的问题。 I am making a test project, where I want to use a splashscreen, as a newbie, I used flutter_native_splash to create splash screen;我正在制作一个测试项目,我想在其中使用闪屏,作为新手,我使用flutter_native_splash创建闪屏; it is working fine, but now I want to hold the splash screen and show an AlertDialog about internet connectivity.它工作正常,但现在我想按住初始屏幕并显示一个关于互联网连接的 AlertDialog。 I don't know how to use it:(我不知道如何使用它:(

extra Q. is there any way to use an button to the AlertDialog, which will reopen / resume the process if the internet connection restore?额外问:有没有办法使用 AlertDialog 的按钮,如果互联网连接恢复,它将重新打开/恢复进程?

Try this package data_connection_checker试试这个 package data_connection_checker

class InitialScreen extends StatefullWidget {

 @override
 _InitialScreenState createState() => _InitialScreenState();

}

class _InitialScreenState extends State<InitialScreen> {

 bool hasConnection;

 void initState() {
  super.initState();
  WidgetsBinding.instance.addPostFrameCallback((_) async {
   setState(() {
    hasConnection = await DataConnectionChecker().hasConnection;
   });
  });
 }

 @override
 Widget build(BuildContext) {
  if(hasConnection) {
   return Text('hasConnection');
  } else {
   return Text('Connection error');
  }
 }

}

Hours of researching with noob knowledge, I maybe found a solution of my problem -->用菜鸟知识研究了几个小时,我可能找到了我的问题的解决方案 -->

import 'dart:async';
import 'dart:io';
import 'package:flutter/material.dart';

class SplashScreen extends StatefulWidget {
  SplashScreen({Key key}) : super(key: key);

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

class _SplashScreenState extends State<SplashScreen> {
  int internetValue = 0;
  
  Future<bool> asyncNetCheck() async {
  final result = await InternetAddress.lookup('google.com');
  if (result.isNotEmpty && result[0].rawAddress.isNotEmpty) {
        return Future<bool>.value(true); 
    } 
  }

  @override
  void initState () {
    super.initState();    
    new Future.delayed(const Duration(seconds: 3),(){
      setState(() {
        internetValue = 2;
        asyncNetCheck().then((value) {
          internetValue = 1;
          Navigator.pushReplacement(
            context,
            MaterialPageRoute(builder: (context) => HomePage()),
          );
        });
      });
    });
  }



  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: GlobalColor.splashColorFill,
      body: Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage("assets/splash.png"),
          ),
        ),
        child: internetValue == 0 ? Container(): internetValue == 2? Container(child: Center(child: Text("checking Internet..."),),) : Container() 
      )
    );
  }
}

but still there is a problem though, if internet connection is slow or the process is slowing the thread;但是仍然存在问题,如果互联网连接速度很慢或进程正在减慢线程; the "checking internet..." text splash for a few moment, hope I can fix that too,and to my extra question, I will place an button in space of text, and will call the initstate, hope that will cover at least minimum area! “检查互联网...”文本飞溅了一会儿,希望我也能解决这个问题,对于我的额外问题,我将在文本空间中放置一个按钮,并调用 initstate,希望至少能涵盖最小面积!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM