使用loadingBuilder时未显示Flutter Image.network?

问题描述

我正在使用Image.network从网络加载图像。当我简单地传递url时,图像工作正常。几秒钟后将显示。但是,当我使用loadingBuilder和errorBuilder时,图像已加载但未显示。我在loadingBuilder中创建的循环进度已完成并消失,但未显示图像。

此处代码

Image.network(
      widget._imgLink,loadingBuilder: (context,child,loadingProgress) {
        return Center(
          child: CircularProgressIndicator(
            value: (loadingProgress != null)
                ? (loadingProgress.cumulativeBytesLoaded /
                    loadingProgress.expectedTotalBytes)
                : 0,),);
      },errorBuilder: (context,error,stackTrace) {
        return Column(
          mainAxisAlignment: MainAxisAlignment.center,children: [
            Text("Error loading"),FlatButton(onpressed: () {},child: Text("Retry")),],

如何告诉窗口小部件在加载后显示图像? 谢谢。

解决方法

使用CachedNetworkImage加载图像,并提供错误和加载小部件。

dependencies:
  cached_network_image: ^2.3.3

代码:

CachedNetworkImage(
  imageUrl: "http://via.placeholder.com/200x150",imageBuilder: (context,imageProvider) => Container(
    decoration: BoxDecoration(
      image: DecorationImage(
          image: imageProvider,fit: BoxFit.cover,colorFilter:
              ColorFilter.mode(Colors.red,BlendMode.colorBurn)),),placeholder: (context,url) => CircularProgressIndicator(),errorWidget: (context,url,error) => Icon(Icons.error),