Flutter之：图片加载

一、ClipOval 实现圆形图片

需要设置图片宽高

ClipOval(
      child: Image.network(
        'img_url',
        fit: BoxFit.cover,
        width: 100,
        height: 100,
        // color: Colors.black
      ),
    );

二、使用cached_network_image缓存加载图片，提升体验

1、添加库

dependencies:
cached_network_image: ^2.1.0+1

2、使用介绍

CachedNetworkImage(
        imageUrl: ('img_url' ?? ''), // 防止null
        placeholder: (context, url) => CircularProgressIndicator(),
        errorWidget: (context, url, error) => Icon(Icons.error),
     ),