如何在Flutter中调整图标/图标按钮的大小？

Question

我有两个问题。

1. 如何扩展我们的图标？我的意思是不是Flutter的默认图标。但是当你变成一个图像。我有一个带有这样图像的图标按钮：

Row(
                        mainAxisSize: MainAxisSize.max,
                        children: <Widget>[
                          IconButton(
                            icon: new Image.asset("images/IG.png"),
                          ),
                          IconButton(
                            icon: new Image.asset("images/Twitter.png"),
                          ),
                          IconButton(
                            icon: new Image.asset("images/Fb.png"),
                          ),
                        ],
                      )

它只有3个图标。当我添加更多图标时，它会将布局分解成砖黄黑色。如何让它们变小？

2. 以上问题适用于IconButton。如何用图像更改图标？这是代码： Icon(Icons.star, color: Colors.red)

如何用Image.asset更改'qazxsw poi'？没有任何推荐到其他链接，只显示图标。

Answer 1

您可以将star属性用于size。

Icon

而对于

Icon(
  Icons.radio_button_checked,
  size: 12,
),

你可以使用

IconButton

Answer 2

对于第一个问题，你可以使用大小的盒子来包含IconButton，如果它在添加更多时断开，可以使用滚动或减小尺寸框的宽度和高度相对于孩子。

Transform.scale(
  scale: 0.5,
  child: IconButton(
    onPressed: (){},
    icon: new Image.asset("images/IG.png"),
  ),
),

对于第二个问题你可以使用

new SizedBox(
   height: /*calculate from width and no:of child*/,
   width: /*calculate from width and no:of child*/,
   child: new IconButton(
      padding: new EdgeInsets.all(0.0),
      icon: new Image.asset("images/IG.png"),
      onPressed: null,
   )
)

你可以参考AssetImage('icons/heart.png', package: 'my_icons')

Answer 3

我将基于所有Suhu答案在这里回答我的问题，并根据我的经验询问叔叔谷歌。

1. 如何扩展我们的图标？我的意思是不是Flutter的默认图标。但是当你变成一个图像。 ？

@CopsOnRoad先生已在评论栏中给出答案。它确实有效。谢谢:)我的回答：

Doc

我使用图像资源并给它们一个大小来调整大小。但这只是愚蠢的方式。你可以看到先生的好方法。警察回答上面。

2. 如何用图像更改图标？这是代码：

   Row(
                           mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                           children: <Widget>[
                             Image.asset("images/line.png", width: 30,),
                             SizedBox(width: 5,),
                             Image.asset("images/Wa.png", width: 30,),
                             SizedBox(width: 5,),
                             Image.asset("images/IG.png", width: 30,),
                             SizedBox(width: 5,),
                             Image.asset("images/Twitter.png", width: 30,),
                             SizedBox(width: 5,),
                             Image.asset("images/Fb.png", width: 30,),
   
                           ],

我的回答是使用ImageIcon。它使图像就像一个图标。这里的代码。

Icon(Icons.star, color: Colors.red)

因为我仍然无法将“星”变成图像资源，所以我使用了ImageIcon。你也可以改变大小。通过在第一个“）”后面添加“size”。

希望这可以帮到你:)