flutter - 为什么 showModalBottomSheet 覆盖bottomNavigationBar，而showBottomSheet 按位置显示在其顶部？

Question

我有一个看起来像这样的应用程序（简化）：
工作 dartpad 示例： https ://dartpad.dev/cc4e524315e104c272cd06aa7037aa10

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
        bottomNavigationBar: BottomWidget(),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Text('Hello, World!');
  }
}

class BottomWidget extends StatelessWidget {
  Widget build(BuildContext context) {
    return BottomAppBar(
      child: InkWell (
        child: Container(
          height:100,
          color: Colors.pink,
          child: Center(
            child: Text('this is a bottom navigation bar')
          ),
        ),
        onTap: () {
          showModalBottomSheet(
            context: context,
            builder: (context) => Container(),
          );
        }
      ),
    );
  }
}

我的问题是，我想使用 showModalBottomSheet 来阻止用户与屏幕交互，但我需要 bottomNavigationBar 显示如下：

现在它只涵盖了包括底部导航栏在内的所有内容：

如果我将其更改为 showBottomSheet，它的效果就像第一张图片一样。

为什么他们的行为不同？
如何使用 showModalBottomSheet 获得我想要的结果？

Answer 1

showModalBottomSheet在所有小部件和图层的顶部显示底部表，如果要在下面显示它，bottomNavigationBar则应Stack在父级中使用并在其中使用单个子级。采样不容易，重现伪代码需要很长时间