flutter设置圆角图片
程序员文章站
2022-07-13 23:26:18
...
需求: 图片加圆角
1. 在网上看了许多的文章,都是使用如下代码 ,然而无效…
Center(
child: Container(
decoration: BoxDecoration(
borderRadius:BorderRadius.circular(10)
),
child: Image.network(
imagePath,
width: 250,
height: 150,
fit: BoxFit.cover,
),
),
),
2.使用装饰器可以实现圆角效果,但是如果我们需要加一个占位图呢?
Center(
child: Container(
width: 250,
height: 150,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
image: DecorationImage(
image: NetworkImage(imagePath),
fit: BoxFit.cover,
)
),
),
)
3.完美实现我的需求,既有圆角,又有占位图
Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Container(
width: 250,
height: 150,
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: FadeInImage.assetNetwork(
placeholder: "images/ic_device_image_default.png",
image: imagePath,
fit: BoxFit.cover,
),
),
)));
如下动图