如何将CachedNetworkImage转换为ImageProvider？

Question

我想在CircleAvatar小部件中显示CachedNetworkImage，但是backgroundImage参数需要ImageProvider。

Answer 1

请使用 CachedNetworkImage 中的 imageBuilder

 CachedNetworkImage(
      placeholder: (context, url) => CircularProgressIndicator(),
      errorWidget: (context, url, error) => new Icon(Icons.error),
      fit: BoxFit.contain,
      imageUrl: imagePath,
      imageBuilder: (context, imageProvider) { // you can access to imageProvider
        return CircleAvatar( // or any widget that use imageProvider like (PhotoView)
          backgroundImage: imageProvider,
        );
      },
    )

Answer 2

如果你想要的只是一个圆形CachedNetworkImage，你可以使用ClipOval：

    ClipOval(
        child: CachedNetworkImage(
            width: 32,
            height: 32,
            fit: BoxFit.cover,
            imageUrl: 'BLA.jpg',
            placeholder: CircularProgressIndicator(),
        ),
    ),

Answer 3

使用CachedNetworkImageProvider

创建一个ImageProvider，使用比例尺从URL加载图像。当图像无法加载时，将调用errorListener。