Add CircularProgressIndicator() when Image.network download

Hello,

I would like to add a CircularProgressIndicator() when my image download.
I dont know where and how can I add in it.
Could you help me please. Thank you a Lot

Container(
height: 400,
child: Card(
elevation: 10.3,
color: Colors.red,
semanticContainer: true,
clipBehavior: Clip.antiAliasWithSaveLayer,
child: Image.network(
https://cdn.pixabay.com/photo/2020/07/06/14/35/beach-5377244_1280.jpg’,
fit: BoxFit.fill,
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15.0),
),
margin: EdgeInsets.all(10),
),
),

Hey, check out this package (https://pub.dev/packages/extended_image), I think it can do pretty much everything with images :wink:

1 Like

use this plugin :
Example :

CachedNetworkImage(
    imageUrl: "http://via.placeholder.com/350x150",
    placeholder: (context, url) => new CircularProgressIndicator(),
    errorWidget: (context, url, error) => new Icon(Icons.error),
    ),

or

Image(image: CachedNetworkImageProvider(url))

1 Like