Flutter中部分Container占满屏幕高度的原因及解决办法

核心现象：不同位置的Container高度表现不同 #

同样是空的Container()，在Column中不会占满屏幕高度，但放在Scaffold的bottomNavigationBar中却会占满屏幕，甚至覆盖body内容。

示例代码对比 #

1. Column中的Container（不会占满高度）：

@override
Widget build(BuildContext context) {
  return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
          body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text("This is Text 1"),
          Container(), // 高度为0，不占空间
          Text("This is Text 2 ")
        ],
      )));
}

2. bottomNavigationBar中的Container（占满屏幕高度）：

@override
Widget build(BuildContext context) {
  return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
          body: Text("Hello"),
          bottomNavigationBar: Container() // 占满屏幕高度，导致body内容被覆盖
          ));
}

原因：父组件的布局约束不同 #

Flutter的布局逻辑是父组件传递约束给子组件，子组件根据约束决定自身尺寸，空Container的高度完全由父约束决定：

• Column中的Container：
  Column属于Flex布局组件，它在垂直方向上给子组件的约束是无上限（unbounded）——允许子组件自行决定垂直尺寸。空的Container没有设置宽高，也没有子元素，因此会收缩到最小尺寸（高度为0），不会占满屏幕。

• bottomNavigationBar中的Container：
  Scaffold对bottomNavigationBar的布局约束是：水平方向必须填满屏幕宽度，垂直方向的约束是尽可能填充可用空间（因为Scaffold的bottomNavigationBar区域默认没有固定高度限制）。空的Container在没有明确尺寸、也没有子元素的情况下，会遵循父约束尽可能扩展，最终占满整个屏幕高度，导致body的内容被覆盖。

原始问题场景 #

当在bottomNavigationBar中通过BlocBuilder返回空Container()时：

body: Text("Hello"),
bottomNavigationBar: BlocBuilder<UserCubit, UserState>(
        builder: (context, state) {
          if (state.userModel?.cartTotalDiscountedPrice != 0) {
            return Material(...);
          }
          return Container();
        },

此时Container()占满屏幕高度，完全覆盖了body中的Text("Hello")，导致内容无法显示。

解决方案 #

要让bottomNavigationBar返回的组件不占满高度，只需将空Container()替换为SizedBox.shrink()——这个组件会强制收缩到最小尺寸（宽高为0），不会占用任何空间：

bottomNavigationBar: BlocBuilder<UserCubit, UserState>(
        builder: (context, state) {
          if (state.userModel?.cartTotalDiscountedPrice != 0) {
            return Material(...);
          }
          return SizedBox.shrink(); // 替换为这个组件
        },

内容的提问来源于stack exchange，提问作者krishnaacharyaa