dart - 如何使 FadeInImage 变成圆形？

Question

我正在使用 FadeInImage 小部件在我的应用程序中显示网络图像。因为我想使用 FadeInImage 的占位符属性，所以我不能使用 NetworkImage 或 Image.Network Widget。

现在我想使 FadeInImage 循环，所以我尝试使用以下选项。

1. 我尝试将 FadeInImage 包裹在 Container 中以使其成为圆形，但 DecorationImage 属性不允许 FadeInImage
2. 我尝试使用 CircleAvatar 但 CircleAvatar 的 backgroundImage 属性不允许 FadeInImage
3. 我尝试使用 flutter 的 cached_network_image 库，但遇到了同样的问题
4. 我尝试的最后一个选项是使用 ClipRRect 使其成为圆形，但它仍然不起作用

以下是我的代码

Container(
      width: 50.0,
      height: 50.0,
      child: ClipRRect(
        borderRadius: BorderRadius.circular(25.0),
        child: FadeInImage(
            placeholder: AssetImage("images/alex.jpg"),
            image: NetworkImage(
                "https://cdn1.thr.com/sites/default/files/imagecache/scale_crop_768_433/2018/02/gettyimages-862145286_copy_-_h_2018.jpg")),
      ),
    );

Answer 1

设置 FadeInImage 的宽度和高度属性，它应该可以工作。

ClipOval(
  child: CachedNetworkImage(
      fit: BoxFit.cover,
      width: 50,
      height: 50,
      placeholder: AssetImage("images/alex.jpg"),
      imageUrl:"https://cdn1.thr.com/sites/default/files/imagecache/scale_crop_768_433/2018/02/gettyimages-862145286_copy_-_h_2018.jpg",
  ),
)