CODEWITHSUNDEEP
flutter
A.A
A.A

Reputation: 4161

FadeInImage in CircleAvatar

How can I have a fade in effect in CircleAvatar? Type of backgroundImage of CircleAvatar is ImageProvider and FadeInImage is not a ImageProvider

Upvotes: 3

Views: 1610

Answers (1)

Shirsh Shukla
Shirsh Shukla

Reputation: 5993

Use Clip react, for image loading i use CachedNetworkImage(cached_network_image: 2.3.3)

       ClipRRect(
                borderRadius: BorderRadius.circular(25.0),
                child: CachedNetworkImage(
                    fit: BoxFit.cover,
                    width: 50,
                    height: 50,
                    placeholder: (context, url) => Image.asset('loadder.gif'),
                    imageUrl:
                        "https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRLe5PABjXc17cjIMOibECLM7ppDwMmiDg6Dw&usqp=CAU"),
              ),

this is user loader image or gif(example).

placeholder: (context, url) => Image.asset('loadder.gif'),

this is your main image(example).

imageUrl:"https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRLe5PABjXc17cjIMOibECLM7ppDwMmiDg6Dw&usqp=CAU"),

Upvotes: 3

Related Questions