android 如何在抖动中改变svg图像大小?

ktca8awb  于 2023-02-02  发布在  Android
关注(0)|答案(9)|浏览(193)

我用flutter_svg: ^0.18.0在我的项目中使用SVG图像。但是我找不到一个合适的方法来改变它的大小。
这是我的密码

body: SafeArea(
    child: Center(
      child: SvgPicture.asset('assets/images/morelights.svg'),
    ),
  ),
vjhs03f7

vjhs03f71#

关键提示是使用fit属性,如下所示:

SvgPicture.asset(
      'assets/svg/notification.svg',
      height: 5, width: 5,
      fit: BoxFit.scaleDown
        )
q7solyqu

q7solyqu2#

我找到了解决这个问题的办法:)

    • 步骤**

1.将svg图标 Package 在容器中。(容器应该是一个子部件)
1.将容器的颜色设置为透明。
1.更改容器的大小。(Svg图标继承父窗口小部件的大小。)
注意:您也可以使用IconButton小部件。容器在我的情况下工作得更好:)

    • 示例**

1sbrub3j

1sbrub3j3#

您可以使用IconButton Package SvgPicture小部件

IconButton(
  onPressed: (){},
  icon: SvgPicture.asset(
      icDate,
      height: 24,
      width: 24,
  ),
),
xkftehaa

xkftehaa4#

你只需要使用属性宽度和高度的svg图片.

SvgPicture.asset(
        'assets/images/bm-icon1.svg',
         width: 18.0,
         height: 18.0,
      ),
kkih6yb8

kkih6yb85#

我偶然发现了解决方案。用Container小工具 Package SvgPicture并添加对齐方式
这样,您就可以自由地更改SvgPicture的宽度和高度

Container(
  height: 100,
  width: 100,
  alignment: Alignment.center, // <---- The magic
  padding: const EdgeInsets.all(12),
  child: SvgPicture.asset(
     'assets/icons/svg-image.svg',
     semanticsLabel: 'Image',
     height: 50,
     width: 50,
  ),
),

希望这对你的情况有效

snz8szmq

snz8szmq6#

asset()将始终采用父级的全部可用高度或宽度。您可以调整Container小部件的高度和宽度,以获得您想要的SVG大小。

Container(
                  child: SvgPicture.asset('assets/images/morelights.svg'),
                  height: 100,
                ),
wj8zmpe1

wj8zmpe17#

    • 编辑:**您可以使用SizedBox轻松实现这一点:
SizedBox(
  width: 100.0,
  height: 150.0,
  child: SvgPicture.asset('assets/images/morelights.svg',),
)
    • 原始答复:**

可以在资源构造器本身中指定高度和宽度:

SvgPicture.asset('assets/images/morelights.svg', height: 100, width: 150)

阅读本文档中的所有可用属性:SvgPicture.asset

ndh0cuux

ndh0cuux8#

可以使用SvgPicture.assetheightwidth参数:

Center(child: SvgPicture.asset(icon, height: 20, width: 20))
brgchamk

brgchamk9#

您可以使用IconButton Package SvgPicture.asset小工具,此属性具有覆盖此问题的行为。示例代码如下所示。

IconButton(
           icon: SvgPicture.asset('assets/svg_images/ic_plane.svg',
              color:  const Color(0xffFF5D2A),
              height: 20,
              width: 20,
            ), onPressed: () {  },
           ),

相关问题