flutter loading images over network

AP answered on September 16, 2021 Popularity 9/10 Helpfulness 9/10

answer flutter loading images over network

flutter loading images over network

Comment

// 1st approach: Circular Progress Indicator with actual bytes loaded
Image.network(imgURL,fit: BoxFit.fill,
  loadingBuilder:(BuildContext context, Widget child,ImageChunkEvent loadingProgress) {
  if (loadingProgress == null) return child;
    return Center(
      child: CircularProgressIndicator(
      value: loadingProgress.expectedTotalBytes != null ? 
             loadingProgress.cumulativeBytesLoaded / loadingProgress.expectedTotalBytes
             : null,
      ),
    );
  },
),

// 2nd approach: Package: cached_network_image:
CachedNetworkImage(
   imageUrl: "http://via.placeholder.com/350x150",
   placeholder: (context, url) => new CircularProgressIndicator(),
   errorWidget: (context, url, error) => new Icon(Icons.error),
 ),
 
 // 3rd approach: FadeInImage 
FadeInImage.assetNetwork(
        placeholder: 'assets/loading.gif',
        image: 'https://picsum.photos/250?image=9',
      ),

Popularity 9/10 Helpfulness 9/10 Language dart

Source: stackoverflow.com

Tags: dart flutter

Link to this answer
Share Copy Link

Contributed on Sep 16 2021

0 Answers Avg Quality 2/10

flutter loading images over network

Contents

More Related Answers

flutter loading images over network

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.