我有以下源代码:
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
controller: scrollController,
slivers: <Widget>[
SliverList(
delegate: SliverChildBuilderDelegate(
(context, cardIndex) {
return Container(
color: Colors.white,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
'Main Course',
style: kRestaurantMenuTypeStyle,
),
ListView.builder(
itemCount: menuCards[cardIndex].menuItems.length,
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
scrollDirection: Axis.vertical,
itemBuilder: (context, itemIndex) {
return RestaurantMenuItem(
menuItem: menuCards[cardIndex].menuItems[itemIndex],
);
},
),
],
),
);
},
childCount: menuCards.length,
),
),
],
),
);
}
不幸的是,ListView.builder()
会自动在顶部创建这个额外的空间。这如下图所示。这是“主菜”和“Pancit Malabon”文本之间的大白色。
我不明白为什么ListView
要这样做。我怎么删除空格?
5条答案
按热度按时间wbgh16ku1#
要避免listview的这种行为,用zero**[padding]覆盖**padding属性
bgibtngc2#
看一下你的屏幕截图,
ListView
滚动到屏幕顶部附近,默认情况下,ListView
添加了一个填充,以避免阻碍系统UI。所以零填充将删除多余的空间。默认情况下,ListView将自动填充列表的可滚动端点,以避免MediaQuery的填充所指示的部分障碍。若要避免此行为,请使用零填充属性进行重写。
来源:ListView
dvtswwa33#
我通过在列表视图中添加一个
padding
来解决这个问题,如下所示:我不明白为什么这个解决方案有效。如果有人能解释这个错误,我可以接受他们的正确答案。
lskq00tm4#
您可以使用
MediaQuery.removePadding
Package 您的列表视图w8f9ii695#