屏幕中间有一个圆形的彩色Container,尺寸固定为正方形,该容器有一个SvgPicture作为子容器,默认情况下SvgPicture取其父容器的尺寸,这不是预期的行为。
目标是使容器挤压SvgPicture,使图像始终小于其容器。
我尝试在SvgPicture周围使用Padding,但由于某种原因,使用这种方法时,所有内容都不成比例。
class SplashIcon extends StatelessWidget {
const SplashIcon({
super.key,
required this.imageSize,
required this.imagePath,
});
final double imageSize;
final String imagePath;
@override
Widget build(BuildContext context) {
return Container(
width: imageSize,
height: imageSize,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: AppColor.defaultStyle.primaryColor50,
),
child: Padding(
padding: const EdgeInsets.all(16),
child: SvgPicture.asset(imagePath),
),
);
}
}
1条答案
按热度按时间igetnqfo1#
您应该使用fit:BoxFit.cover属性来覆盖整个容器并保持纵横比。
svgPicture.asset('assets/home.svg',fit:BoxFit.cover)