如何去除Flutter中图片和文字之间的space

Question

我想在图像（fb 图标）正下方显示文本 (Facebook)，没有任何间距。以下是截至目前的代码：

@override   Widget build(BuildContext context) {
    return Scaffold(
      // prevent pixel overflow when typing
      resizeToAvoidBottomPadding: false,
      body: Container(
        decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage(
                  "assets/login_background.png",
                ),
                fit: BoxFit.cover)),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          //  mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[

           Image(
              image: AssetImage("assets/fb_icon.png"),
              width: 180.0,
              height: 250.0,
            ),
            new Text('Facebook.',
                style: TextStyle(
                    fontStyle: FontStyle.italic,
                    color: Colors.white,)),
            _textFields(),
            _signInButton(),
            _socialMediaSignIns(),
            _accountButtons()
          ],
        ),
      ),
    );
   }
 }

目前，我是这样看的，想去掉图片和文字之间的space。

Answer 1

Image(
  image: AssetImage("assets/fb_icon.png"),
),
Text('Facebook.',
    style: TextStyle(
      fontStyle: FontStyle.italic,
      color: Colors.white,))

在这种情况下必须没有填充。您可以通过以下方式在 png 文件中准确检查填充：

Image(
  image: AssetImage("assets/fb_icon.png"),
  color: Colors.red,
  colorBlendMode: BlendMode.multiply,
),

这将显示图片的真实边界

Answer 2

实际上，您应该使用 BoxFit.cover 来查看效果，因为图像的物理高度小于分配给它的物理高度。

这是解决方案

       Image(
          image: AssetImage("assets/fb_icon.png"),
          width: 180.0,
          height: 250.0,
          fit: BoxFit.cover,
        ),

您可以试试其他的BoxFit，看看哪个更适合您。

如何去除Flutter中图片和文字之间的space

How to remove space between image and text in Flutter

flutter

flutter-layout