如何消除 Flutter 中两个容器之间的空间？

我在 Column 小部件内有两个高度 250 的容器。这两个容器小部件之间没有任何其他小部件，但我仍然可以看到两个容器之间的空间很小。

这是我的代码...

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: Example(),
    );
  }
}

class Example extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    double height = 250;
    TextStyle containerTextStyle = TextStyle(color: Colors.white, fontSize: 24);

    return Scaffold(
      body: Column(
        children: <Widget>[
          Container(
            height: height,
            color: Colors.black,
            child: Center(
              child: Text('Container 1', style: containerTextStyle),
            ),
          ),
          Container(
            height: height,
            color: Colors.black,
            child: Center(
              child: Text('Container 2', style: containerTextStyle),
            ),
          ),
        ],
      ),
    );
  }
}

我不知道为什么，但如果我将此容器的高度设置为 100 或 400，它不会显示容器之间的任何空间。没有尝试使用许多不同的高度值，但空间对于某些值可见，而对于其他值不可见。

这是我手机的屏幕截图...

Both Containers height is equal to 250

Both Containers height is equal to 400

用这个替换你的脚手架：

return Scaffold(
  body: Column(
    children: <Widget>[
      Container(
        height: height,
        decoration: BoxDecoration(
          border: Border.all(width: 0, color: Colors.black),
          color: Colors.black,
        ),
        child: Center(
          child: Text('Container 1', style: containerTextStyle),
        ),
      ),
      Container(
        height: height,
        decoration: BoxDecoration(
          border: Border.all(width: 0, color: Colors.black),
          color: Colors.black,
        ),
        child: Center(
          child: Text('Container 2', style: containerTextStyle),
        ),
      ),
    ],
  ),
);