Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter Image.network is not showing when using loadingBuilder?

I'm using Image.network to load image from network. When I simply pass the url the image works fine. It will be displayed after few seconds. But when I use loadingBuilder and errorBuilder the images are loaded but not displayed. The circular progress I created inside the loadingBuilder completes and disappears but image is not shown.

Here code

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")),
          ],
        );
      },
    ),

How can I tell the widget to display the image after its loaded? Thank you.

like image 718
coder_86 Avatar asked Jul 21 '26 10:07

coder_86


1 Answers

Returning child from loadingBuilder when loadingProgress is null will work. Sample:

loadingBuilder: (context, child, loadingProgress) {
        if(loadingProgress == null)
          return child;

        return Center(
          child: CircularProgressIndicator(
            value: (loadingProgress != null)
                ? (loadingProgress.cumulativeBytesLoaded /
                    loadingProgress.expectedTotalBytes)
                : 0,
          ),
        );
      },
like image 182
sh_ark Avatar answered Jul 23 '26 00:07

sh_ark



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!