最新消息:关注【太平洋学习网】微信公众号,可以获取全套资料,【全套Java基础27天】【JavaEE就业视频4个月】【Android就业视频4个月】

flutter:A RenderFlex overflowed by 740 pixels on the bottom错误

扩展 太平洋学习网 浏览 评论

我们使用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”错误。

QQ截图20181016211841.jpg

解决方案:

此时我们可以使用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这些类都是可以的,因为这些都是可以上下滑动屏幕的类。

QQ截图20181016214256.jpg


来源网站:太平洋学习网,转载请注明出处:http://www.tpyyes.com/a/kuozhan/778.html

与本文相关的文章

发表我的评论
取消评论

表情

您的回复是我们的动力!

  • 昵称 (必填)

网友最新评论