对于给定的场景,我怎样才能只使受限框可滚动或任何其他类型的框

How can I make only the constrained box scrollable or any other kind of box for the given scenario

问题的现状

UI:

Make this Yellow Boxes Scroll

代码:

This is the Code

如何只制作黄色方框...并保持红色方框原样定位。

或任何其他替代方案,因为我在底部使用自定义导航容器并且无法滚动。

谢谢。

请参考以下代码

class YellowBox extends StatefulWidget {
  const YellowBox({Key key}) : super(key: key);

  @override
  _YellowBoxState createState() => _YellowBoxState();
}

class _YellowBoxState extends State<YellowBox> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text("Hello World"),
      ),
      bottomNavigationBar: Container(
        height: 80.0,
        width: ScreenUtil().screenWidth,
        color: Colors.red,
      ),
      body: Column(
        children: [
          Container(
            height: 80.0,
            width: ScreenUtil().screenWidth,
            color: Colors.red,
          ),
          Expanded(
            child: ListView.builder(
              itemCount: 10,
              itemBuilder: (BuildContext ctx, int index) {
                return Container(
                  margin:
                      EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
                  height: 80.0,
                  width: 100.0,
                  color: Colors.yellow,
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}