我想控制配置文件图像的大小,并得到它圆形,而不是椭圆形,如下所示。
改变高度和/或宽度值不会影响大小和比例,奇怪的是当我改变边距参数时,椭圆形的半径也会改变。
new UserAccountsDrawerHeader(
decoration: BoxDecoration(color: Colors.white),
currentAccountPicture: new Container(
margin: const EdgeInsets.only(bottom: 40.0),
width: 10.0,
height: 10.0,
decoration: new BoxDecoration(
shape: BoxShape.circle,
image: new DecorationImage(
fit: BoxFit.fill,
image: new NetworkImage(
"https://example.com/assets/images/john-doe.jpg",
),
),
),
),
accountName: new Container(
...
),
accountEmail: new Container(
...
),
onDetailsPressed: () {
...
},
),
我哪里做错了?
- 更新**:上述方法是CircleAvatar的一种变通方法,该方法无法控制图像大小。如果您尝试用其他方法控制CircleAvatar的图像大小,请分享该方法以获得帮助。
8条答案
按热度按时间4ioopgfo1#
网络映像使用此代码:
将此用于资产图像:
n53p2ov02#
如果你使用backgroundImage作为CircleAvatar的图像提供者,那么改变radius属性实际上没有任何效果。从源代码
circle_avatar.dart
可以观察到图像被渲染为BoxFit。coverDecorationImage(image: backgroundImage, fit: BoxFit.cover)
-在user_accounts_drawer_header.dart
中currentAccountPicture
被硬编码为72.0像素的SizedBox,所以图像的尺寸总是72.0px。https://github.com/flutter/flutter/blob/master/packages/flutter/lib/src/material/user_accounts_drawer_header.dart#L57
https://github.com/flutter/flutter/blob/master/packages/flutter/lib/src/material/circle_avatar.dart#L203
希望Flutter团队在未来能在这方面增加一些控制水平。
不是答案,只是更多的信息,希望能帮助别人。
t5fffqht3#
试试这个:
这是输出的屏幕截图:
cgfeq70w4#
将你的图片 Package 在CircleAvatar小工具中,它就是为了这个目的而设计的。
ny6fqffe5#
您将边距放在图像的容器内,而您必须使用UserAccountDrawerHeader的margin参数,这就是为什么您的图像变成椭圆形:
xbp102n06#
您可以创建自己的标题:
i7uq4tfw7#
**我找到了解决办法!**至少这对我有效
7cjasjjr8#
这对我很有效: