如何在颤动纸幅中适配IconButton尺寸？图标大小在行视图外部呈现

Question

我正在用flutter web制作一个文件夹。我创建了社交句柄的iconButtons。但当我尝试点击iconButtons时，填充并不正确。

我试着用添加填充，分隔行来修复它，但是它不起作用。你可以看到下面的图片，作为我想说的内容的参考。click here to see the web view debug paint image

这是我在其中添加了这些iconButton的行小部件-

   class IntroductionRow extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 90.0,
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          ContactIcon(iconData: FontAwesomeIcons.github, onPress: kLaunchGithubURL,),
          // SizedBox(width: 30.0,),
          ContactIcon(iconData: FontAwesomeIcons.linkedin, onPress: kLaunchLinkedInURL,),
          // SizedBox(width: 30.0,),
          ContactIcon(iconData: Icons.mail, onPress: kLaunchMailURL,),
          // SizedBox(width: 30.0,),
          ContactIcon(iconData: FontAwesomeIcons.telegram, onPress: kLaunchTelegramURL, ),
          // SizedBox(width: 30.0,),
          ContactIcon(iconData: FontAwesomeIcons.code, onPress: kLaunchLeetCodeURL,),
        ],
      ),
    );
  }
}


//This is the widget of iconButton- 
class ContactIcon extends StatelessWidget {

  final IconData iconData;
  final Function onPress;
  final bool isMobile;

  ContactIcon({@required this.iconData, this.onPress, this.isMobile = false});

  @override
  Widget build(BuildContext context) {
    return IconButton(
      padding: EdgeInsets.symmetric(horizontal: 30.0),
      hoverColor: Colors.blueAccent,
        focusColor: Colors.blueAccent,
        icon:
        Center(
          child: Icon(
              iconData,
              size: isMobile ? 30.0 : 60.0 ,
              color: Colors.white),
        ),
        onPressed: onPress);
  }
}

我最近开始了flutter，这就是为什么我对所有的小部件都不太了解--如果你发现任何其他错误，请告诉我。

Answer 1

我找到了我问题的解决方案。我只需要在我的IconButton中添加约束

约束:BoxConstraints.expand(宽度: 80，高度: 80)，

而且，我必须使用sizedBox，而不是填充。