Flitter中图片的路径获取有好几种,现仅讨论网络图片。
图片圆角通常使用的有两种,一种是四角圆弧图片,还有一种圆形图片,在Swift中直接使用layer中的cornerRadius设置圆角,在flutter中我目前接触的分为两种:
直接使用圆形控件设置网络图片为背景图片
CircleAvatar(
radius: 圆弧数值,
backgroundImage: NetworkImage(imageUrl),
)
展示
可设置矩形图片宽高和圆角半径,这种方法也可以实现上面一种的展示,但是代码量较多,如需要代码高度复用时可使用
ClipRRect(
borderRadius: BorderRadius.circular(圆角半径),
child: FadeInImage.assetNetwork(
placeholder: '图片加载失败时展示的图片',
image: imageUrl,
width: 宽度,
height: 高度,
fit: BoxFit.cover,
),
)
展示
建议使用第二种,将其封装后使用,因为有placeholder,属通用型。
网友评论