如何在flutter中适当地将图像装入圆形按钮中?

Question

我添加的图像不适合圆形。这是供参考的图片

这是参考

的代码

Container(
child:Material(
shape: CircleBorder(),
clipBehavior: Clip.antiAliasWithSaveLayer,
child: InkWell(
splashColor: Colors.black26,
onTap: (){},
child: Ink.image(
image: AssetImage('assets/'+ Name),
height: 60 ,
width: 60,
),
),
)
),Text(String),

Answer 1

使用Ink.child的fit属性

第一种方法:使用fit: BoxFit。封面，用于中间裁剪的图像

或者

第二个方法:使用fit: BoxFit。填充，用于拉伸图像

Container(
child:Material(
shape: CircleBorder(),
clipBehavior: Clip.antiAliasWithSaveLayer,
child: InkWell(
splashColor: Colors.black26,
onTap: (){},
child: Ink.image(
image: AssetImage('assets/'+ Name),
fit: BoxFit.cover, //Add this line for center crop or use 2nd way
height: 60 ,
width: 60,
),
),
)
),Text(String),

Answer 2

我想你可以用CircleAvatar

下面是演示代码

CircleAvatar(
radius: 20.0,
child: ClipOval(
child: Image.network(
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS0sCAvrW1yFi0UYMgTZb113I0SwtW0dpby8Q&usqp=CAU')),
),

虽然我不能打开你的例子图像，我想如果你使用圆形头像它将工作