在线时颤振重建/重新加载图像小部件

Question

该场景就像用户离线启动应用程序一样。 所以我试图在用户重新在线时重新加载图像。但由于某些有线原因，它不起作用！

class Test extends StatefulWidget {
  @override
  _TestState createState() => _TestState();
}

class _TestState extends State<Test> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Image.network('https://interactive-examples.mdn.mozilla.net/media/cc0-images/grapefruit-slice-332-332.jpg'),
          FlatButton(onPressed: () => setState(() {}), child: Text('REFRESH')),
        ],
      ),
    );
  }
}

Answer 1

您应该检查互联网连接并在互联网连接时重建图像小部件。为此，您可以使用connectivity 库。你的代码应该是这样的：

class _TestState extends State<Test> {
  var _isInternetConnected=false;

@override
void initState() {
    super.initState();
    _getConnectivity();
}
  _getConnectivity(){
   try {
    final result = await InternetAddress.lookup('google.com');
    if (result.isNotEmpty && result[0].rawAddress.isNotEmpty) {
      print('connected');
      setState(() {
        _isInternetConnected = true;
       });
     }
    } on SocketException catch (_) {
      print('not connected');
    }
  }

  Widget _showImage(){
    if(_isInternetConnected)
     return Image.network('https://interactive-examples.mdn.mozilla.net/media/cc0-images/grapefruit-slice-332-332.jpg');
   else
     return Image.asset('some image')

  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          __showImage(),
          FlatButton(onPressed: () => setState(() {}), child: Text('REFRESH')),
        ],
      ),
    );
  }
}