我正在使用Flutter制作关于电影的信息列表。现在我想在左边的封面图像是一个圆角图片。我做了下面的事情,但是没有用。谢谢!
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,
);
}
如下
试试这个,用CircleAvatar和CachedNetworkImage加载图像。
CircleAvatar(
radius: 45,
child: ClipOval(
child: CachedNetworkImage(
imageUrl: "https:// your image url path",
fit: BoxFit.cover,
width: 80,
height: 80,
),
),
),
如果你也想要边框,然后添加
backgroundColor: Colors.deepOrangeAccent,
在这个
CircleAvatar(
radius: 45,
backgroundColor: Colors.deepOrangeAccent,
child: ClipOval(
child: CachedNetworkImage(
imageUrl: "https:// your image url path",
fit: BoxFit.cover,
width: 80,
height: 80,
),
),
),
有了新版本的颤振和材质主题,你需要使用“填充”小部件,以便有一个图像,不填满它的容器。
例如,如果你想在AppBar中插入一个圆角图像,你必须使用填充,否则你的图像将永远和AppBar一样高。
希望这能帮助到一些人
InkWell(
onTap: () {
print ('Click Profile Pic');
},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: ClipOval(
child: Image.asset(
'assets/images/profile1.jpg',
),
),
),
),
用于扑动中的圆形图像
ClipRRect(
child: Image.asset(
"assets/images/ic_cat.png",
width: 80,
height: 80,
),
borderRadius: BorderRadius.circular(50),
))
如果你只想要图像的角落,然后简单地改变边界半径。像下面这样的圆形
ClipRRect(
child: Image.asset(
"assets/images/ic_cat.png",
width: 80,
height: 80,
),
borderRadius: BorderRadius.circular(20),
))