dart 如何正确地将SVG图像约束在容器中?

uz75evzq  于 2023-03-27  发布在  其他
关注(0)|答案(1)|浏览(88)

屏幕中间有一个圆形的彩色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),
      ),
    );
  }
}
igetnqfo

igetnqfo1#

您应该使用fit:BoxFit.cover属性来覆盖整个容器并保持纵横比。
svgPicture.asset('assets/home.svg',fit:BoxFit.cover)

相关问题