我们使用google flutter的时候,界面报“A RenderFlex overflowed by 740 pixels on the bottom”错误,这是因为我们的app内容已经超出了手机底部,flutter并不像原生的android或ios那样直接被底部遮盖,而是会报这样的错误,一般出错的部分是这样的:
@override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text(widget.title), ), body: new Center( child: new Column( //假如此处是List列表等元素 ], ), ); }
因为new Column与new Padding等类包裹的内容都是固定长度的,所以超出屏幕的部分会报“A RenderFlex overflowed by 740 pixels on the bottom”错误。
解决方案:
此时我们可以使用new ScrollView相关的类来包裹app最外层的内容,做过android与ios开发的人都应该知道这个问题,一般的列表或界面显示都会用scrollview类来包裹最外层,这样就可以将超过屏幕的内容滑动显示了,android与ios是默认继承了ScrollView。
@override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text(widget.title), ), body: new Center( child: new CustomScrollView( shrinkWrap: true, slivers: <Widget>[ SliverPadding( padding: const EdgeInsets.all(10.0), sliver: SliverList( delegate: SliverChildListDelegate(<Widget>[ const Text('scrollview第一行'), const Text('scrollview第二行'), 。。。。。 ], ), ), ), ], ), ), ); }
当然了,SingleChildScrollView这些类都是可以的,因为这些都是可以上下滑动屏幕的类。