flutterimageflutter-layoutrounded-corners

How to do Rounded Corners Image in Flutter


I am using Flutter to make a list of information about movies. Now I want the cover image on the left to be a rounded corners picture. I did the following, but it didn’t work. Thanks!

    getItem(var subject) {
    var row = Container(
      margin: EdgeInsets.all(8.0),
      child: Row(
        children: <Widget>[
          Container(
            width: 100.0,
            height: 150.0,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.all(Radius.circular(8.0)),
              color: Colors.redAccent,
            ),
            child: Image.network(
              subject['images']['large'],
              height: 150.0,
              width: 100.0,
            ),
          ),
        ],
      ),
    );
    return Card(
      color: Colors.blueGrey,
      child: row,
    );
  }

as follows

enter image description here


Solution

  • Use ClipRRect it will work perfectly.

    ClipRRect(
        borderRadius: BorderRadius.circular(8.0),
        child: Image.network(
            subject['images']['large'],
            height: 150.0,
            width: 100.0,
        ),
    )