最近在已有的项目中使用Flutter重构一个已有的简单的页面,在一个普通的安卓原生页面嵌入一个FlutterFragment页面,但是发现安卓原生页面如果做了沉浸式的话(没有沉浸式的话是没问题的),Flutter页面里面的ListView前面总会有一段多出来的空白高度,目测应该是statusbar的高度。如下图:
image.png
包一个SafeArea也不行,还是有空白,但是这个空白不是在ListView里面,通过Flutter Devtools分析布局。
image.png
发现ListView竟然多了一个SliverPadding,25应该刚好就是statusbar的高度,看了下ListView源码也没看出所以然,本着有问题找谷歌的方针,谷歌输入关键字Flutter ListView SliverPadding Top。第一个结果就是要找的。
image.png
解决方案:
Widget _myListView(){
return MediaQuery.removePadding(
context: context,
removeTop: true,
child: ListView.builder(
.......
)
);
}
Reference:https://github.com/flutter/flutter/issues/14842
注:虽然看起来解决起来很快,但是其实至少花了几个小时,包括尝试各种方案,看源码。
网友评论