Flutter Image监听加载状态，加载成功后使用淡入动画显示

参考：
https://stackoverflow.com/questions/46326584/how-do-i-tell-when-a-networkimage-has-finished-loading
.
https://book.flutterchina.club/chapter14/image_and_cache.html#_14-5-1-imageprovider

动画部分就不赘述了，这里简要记录下如何监听Image.network的加载状态并设置淡入。

（省略动画以及部分代码）

  ...
  
  Image? _image = null;//Image对象
  bool _loading = true;//图片加载状态，加载中则为true
  
  ...
  
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    //初始化动画
    _initAnimation();
    //获取图片URL并初始化Image和设置Image的加载状态监听器
    _fetchImageUrl();
  }

  @override
  Widget build(BuildContext context) {
    //当Image加载中，显示loading控件 ； 当加载完成，显示Image
    return _loading? loadingview() : Opacity(opacity: animationValue, child: _image);
  }

  ...
  
  _fetchImageUrl(){
  	...// 从API获取图片URL
  	
  	//获取到图片的URL后初始化Image
	_image = new Image.network(imgUrl, fit: BoxFit.cover);
	//并设置加载状态监听器
    _image!.image.resolve(new ImageConfiguration()).addListener(
    	
    	ImageStreamListener((ImageInfo info, bool syncCall) {
    	  //当加载完成
      	  if (mounted) {
             setState(() {
               //显示Image
               _loading = false;
               //开始动画
               controller.reset();
               controller.forward();});
      	  }
        })
     );
  }