Flutter Network Image does not fit in Circular Avatar

I am getting images from an API call. I want the images to be displayed in Circular profile form so I am using CircleAvatar Widget, but I keep getting images in square format. Here is a screenshot of images.

Here is the code I am using.

ListTile(leading: CircleAvatar(child: Image.network("${snapshot.data.hitsList[index].previewUrl}",fit: BoxFit.scaleDown,)),),

I tried using all the properties of BoxFit like cover, contain, fitWidth, fitHeight etc but none of them works.

You need to use backgroundImage: property in order to fit it in Circle.

              radius: 30.0,
              backgroundImage: NetworkImage("${snapshot.data.hitsList[index].previewUrl}"),
              backgroundColor: Colors.transparent,
1 Like

@pkrawat1 thanks for your reply.

If you don’t want to use CircleAvatar , here is how you can do it too.

  child: Image.network(
    width: 100,
    height: 100,
    fit: BoxFit.cover,
1 Like