Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Round CachedNetworkImage in Flutter

Tags:

flutter

dart

new Container(

                  width: 80.0,
                  height: 80.0,
                  decoration: new BoxDecoration(

                      shape: BoxShape.circle,
                      image: new DecorationImage(
                          fit: BoxFit.fill,
                          image: new NetworkImage(widget.profile_picture)))),

At the moment I have a NetworkImage however I wold like to have a round CachedNetworkImage instead.

like image 505
heyr Avatar asked Jun 13 '18 16:06

heyr


People also ask

How do you make a round image on Flutter?

To create a Circular Image in Flutter, use a widget called CircleAvatar. CircleAvatar is simply a widget used to display a user profile picture. In the absence of a user's profile picture, CircleAvatar can display the user's initials.

What is CachedNetworkImage in Flutter?

Cached network imageA flutter library to show images from the internet and keep them in the cache directory.

What is Cached_network_image?

CachedNetworkImage shows a network image using a caching mechanism. It also provides support for a placeholder, showing an error and fading into the loaded image. Next to that it supports most features of a default Image widget.


1 Answers

You can use

ClipRRect(borderRadius: BorderRadius.circular(10000.0),
child: CachedNetworkImage(...))

Since CachedNetworkImageProvider is not a Widget, it doesn't work in place of a CachedNetworkImage. Meaning it won't have the placeholder widget option.

like image 125
ThinkDigital Avatar answered Oct 30 '22 01:10

ThinkDigital