如何判断NetworkImage何时完成加载？

Question

我有一个NetworkImage,我想知道它何时完成加载.我怎么做？

Answer 1

你可以resolve得到一个ImageStream与addListener到ImageStream

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  State createState() => new MyAppState();
}

class MyAppState extends State<MyApp> {
  Image _image = new Image.network(
    'https://flutter.io/images/flutter-mark-square-100.png',
  );
  bool _loading = true;

  @override
  void initState() {
    _image.image.resolve(new ImageConfiguration()).addListener((_, __) {
      if (mounted) {
        setState(() {
          _loading = false;
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        body: new Center(
          child: _loading ? new Text('Loading...') : _image,
        ),
      ),
    );
  }
}

Answer 2

您可以使用 ImageStreamListener 来实现。ImageStreamListener 的第一个参数是 ImageListener 回调，当图像完全加载时调用它。

 var _image = NetworkImage("URL");

 _image.resolve(ImageConfiguration()).addListener(
    ImageStreamListener(
      (info, call) {
        print('Networkimage is fully loaded and saved');
        // do something
      },
    ),
  );

Answer 3

我在flutter官方demo\xef\xbc\x8c中找到了这个方法希望对你有帮助。

\n\n

import \'dart:async\';\nimport \'package:flutter/material.dart\';\n\nvoid _imageLoad() async {\n\n    String imageName = "";\n\n    Image downloadImage = new Image.network(imageName);\n\n    final ImageStream stream = downloadImage.image.resolve(ImageConfiguration.empty);\n    final Completer<void> completer = Completer<void>();\n    stream.addListener((ImageInfo info, bool syncCall) => completer.complete());\n    await completer.future;\n    if (mounted) {\n      //do sth\n    }\n}\n

\n