脚手架在底部显示出一个不该存在的条

时间:2020-02-14 07:14:59

标签: flutter flutter-layout

我的脚手架在底部像这样显示一个栏:image
我没有放在那儿(我知道那是脚手架,因为当我将其卸下时,栏消失了。但是我不能不用脚手架就能做到)这是我的代码:

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    SystemChrome.setEnabledSystemUIOverlays([]);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.red,
      body: Column(
        children: <Widget>[
          Center(
            child: Text('Scaffold Bar test'),
          ),
          Container(
            height: MediaQuery.of(context).size.height - 88,
            child: ListView.builder(itemBuilder: (BuildContext context,int index) {
              return Container(
                height: 40.0,
                width: MediaQuery.of(context).size.width,
                color: index % 2 == 0 ? Colors.blue : Colors.orange,
              );
            }),
          ),
        ],
      ),
    );
  }
}

1 个答案:

答案 0 :(得分:1)

resizeToAvoidBottomPadding: false中设置Scaffold

然后将MediaQuery.removePaddingremoveTop: true一起使用,以除去ListView.builder顶部不必要的填充。

使用Expanded而不是从MediaQuery获取高度。

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    SystemChrome.setEnabledSystemUIOverlays([]);
  }

  @override
  Widget build(BuildContext context) {
    return MediaQuery.removePadding(
      context: context,
      removeTop: true,
      child: Scaffold(
        backgroundColor: Colors.red,
        resizeToAvoidBottomPadding: false,
        body: Column(
          children: <Widget>[
            Center(
              child: Text('Scaffold Bar test'),
            ),
            Expanded(
              child: ListView.builder(itemBuilder: (BuildContext context,int index) {
                return Container(
                  height: 40.0,
                  width: MediaQuery.of(context).size.width,
                  color: index % 2 == 0 ? Colors.blue : Colors.orange,
                );
              }),
            ),
          ],
        ),
      ),
    );
  }
}