当使用下面的代码时,我希望得到一个圆形的头像图像,但得到的是一个椭圆形。我在Container上尝试了不同的参数,比如宽度和高度,但都没有帮助。
appBar: AppBar(
backgroundColor: Colors.white,
leading: IconButton(
icon: new Icon(Icons.star_border, color: Colors.black),
onPressed: () => {},
),
actions: <Widget>[
Container(
//height: 25.0,
// width: 25.0,
child: CircleAvatar(
backgroundImage: NetworkImage('https://lh3.googleusercontent.com/a-/AAuE7mChgTiAe-N8ibcM3fB_qvGdl2vQ9jvjYv0iOOjB=s96-c'),
)
/*
decoration: BoxDecoration(
shape: BoxShape.circle,
image: DecorationImage(
fit: BoxFit.fill,
image: NetworkImage(
'https://lh3.googleusercontent.com/a-/AAuE7mChgTiAe-N8ibcM3fB_qvGdl2vQ9jvjYv0iOOjB=s96-c')),
),*/
),
],
发布于 2020-02-17 18:33:06
您收到的是一个椭圆形,因为您使用的是高度有限的Appbar
小部件中的CircleAvatar
小部件。
尝试在CircleAvatar
小部件中添加一个参数radius
,它将返回您想要的图像的圆形。
根据需要,尝试更改半径大小值。
CircleAvatar(
backgroundImage: NetworkImage('https://lh3.googleusercontent.com/a-/AAuE7mChgTiAe-N8ibcM3fB_qvGdl2vQ9jvjYv0iOOjB=s96-c'),
radius: 15.0
)
发布于 2020-02-17 18:37:40
我在过去遇到过这个问题,我发现将AvatarCircle包装在一个宽度为58的容器中可以解决圆周半径比问题,使其成为合适的圆周形状。增加或减少一个像素可能适合您的喜好。试试这个:
appBar: AppBar(
backgroundColor: Colors.white,
leading: IconButton(
icon: new Icon(Icons.star_border, color: Colors.black),
onPressed: () => {},
),
actions: <Widget>[
Container(
width: 58.0,
child: CircleAvatar(
backgroundImage: NetworkImage('https://lh3.googleusercontent.com/a-/AAuE7mChgTiAe-N8ibcM3fB_qvGdl2vQ9jvjYv0iOOjB=s96-c'),
)
),
],
发布于 2020-08-06 21:46:30
我使用这个代码,并与各种大小的图像一起工作。
CircleAvatar(
child: ClipOval(
child: Image.network(items.logo, fit: BoxFit.fill),
),
backgroundColor: Colors.transparent,
radius: 30,
)
https://stackoverflow.com/questions/60260423
复制相似问题