列中展开的listview会占用额外空间
我在一列中有两个列表视图。我希望第一个列表视图占用尽可能少的空间。因此,如果列表中有一项,则包含listview的框的大小应为一项高。 我曾尝试为ListView使用容器,但后来我收到一个错误,告诉我使用FitFit.lose时使用Expanded或Flexible。使用它们的问题在于,它们都会导致ListView有额外的填充 在这个屏幕截图中,您可以在第一个请求下看到一点红色。这是包含我的ListView的扩展视图的一部分 这是我的代码: 这是我的朋友建议视图: }在FutureBuilder下,您应该使用灵活的容器,而不是扩展的容器,以防止孩子占用过多的空间。在生成请求ListView时,还需要将属性设置为true。但是,请注意文件的最后一段: 收缩包装滚动视图的内容比扩展到允许的最大大小要昂贵得多 更新: 根据提供的其他信息,以下是如何防止建议与请求重叠 在FutureBuilder下,您应该使用灵活的容器而不是扩展的容器,以防止孩子占用过多的空间。在生成请求ListView时,还需要将属性设置为true。但是,请注意文件的最后一段: 收缩包装滚动视图的内容比扩展到允许的最大大小要昂贵得多 更新: 根据提供的其他信息,以下是如何防止建议与请求重叠列中展开的listview会占用额外空间,listview,flutter,Listview,Flutter,我在一列中有两个列表视图。我希望第一个列表视图占用尽可能少的空间。因此,如果列表中有一项,则包含listview的框的大小应为一项高。 我曾尝试为ListView使用容器,但后来我收到一个错误,告诉我使用FitFit.lose时使用Expanded或Flexible。使用它们的问题在于,它们都会导致ListView有额外的填充 在这个屏幕截图中,您可以在第一个请求下看到一点红色。这是包含我的ListView的扩展视图的一部分 这是我的代码: 这是我的朋友建议视图: }在FutureBuild
我也有同样的问题,在做了一些研究之后,我找到了一个适合我的解决方案:
必须为padding属性指定EdgeInsets.zero 我也有同样的问题,在做了一些研究之后,我找到了一个适合我的解决方案:
必须为padding属性指定EdgeInsets.zero 这通常会从listview中删除额外的顶部填充:
MediaQuery.removePadding(
context:context,
removeTop: true,
child ListView.Builder(
itemCount:2,
itemBuilder(context,index){
});
这通常会从listview中删除额外的顶部填充:
MediaQuery.removePadding(
context:context,
removeTop: true,
child ListView.Builder(
itemCount:2,
itemBuilder(context,index){
});
如果第一个列表内容大于屏幕剩余高度,会发生什么情况?@tomwyr第一个列表内容上应该有一个最大高度。提供一些指导如果第一个列表内容大于屏幕剩余高度,应该怎么办?@tomwyr第一个列表内容上应该有一个最大高度。提供一些指导我尝试了你的建议并编辑了OP。当有0-2个建议时,它会非常有效。然而,这些建议扩展到整个视图,与请求重叠。这里有一个图库,希望能更好地解释一下:如果请求和建议中都有多个项目,您能详细说明一下您希望布局的行为方式吗?也就是说,两个列表视图都应该是可见和可滚动的,或者说,所有请求都应该先滚动,建议紧跟其后?两个视图都应该是可见和可滚动的,即请求的最大高度,建议的最大高度。@MikeBellika我更新了答案,请看一看,让我知道这是否正确。我还删除了几行代码以尽可能保持简短。这几乎可以奏效,但是当只有一个朋友请求时,建议不会占用剩余的空间:我尝试了你的建议并编辑了OP。当有0-2个建议时,它可以完美地工作。然而,这些建议扩展到整个视图,与请求重叠。这里有一个图库,希望能更好地解释一下:如果请求和建议中都有多个项目,您能详细说明一下您希望布局的行为方式吗?也就是说,两个列表视图都应该是可见和可滚动的,或者说,所有请求都应该先滚动,建议紧跟其后?两个视图都应该是可见和可滚动的,即请求的最大高度,建议的最大高度。@MikeBellika我更新了答案,请看一看,让我知道这是否正确。我还删除了几行代码以尽可能保持简短。这几乎可以做到,但是当只有一个朋友请求时,建议不会占用剩余的空间:谢谢,伙计,它为我工作gr8,伙计,它为我工作gr8
@override
Widget build(BuildContext context) {
return Scaffold(
..., // other scaffold properties
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.max,
children: [
..., // search field widget
Expanded(
child: LayoutBuilder(
builder: (context, constraints) => Column(children: [
LimitedBox(
maxHeight: constraints.maxHeight / 2,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
..., // requests header widget
FutureBuilder<FriendRequests>(
future: fetchFriendRequests(),
builder: (context, snapshot) {
if (snapshot.hasData &&
snapshot.data.friendRequests.length > 0) {
return Flexible(
child: Container(
..., // box decoration
child: new ListView.builder(
shrinkWrap: true,
..., // item count and builder
),
),
);
} else ... // handle other data states
},
),
],
),
),
Expanded(
child: Column(
children: [
..., // suggestions header widget
FutureBuilder<FriendSuggestions>(
future: fetchSuggestions(),
builder: (context, snapshot) {
if (snapshot.hasData &&
snapshot.data.friendSuggestions.length > 0) {
return Expanded(
child: new ListView.builder(
..., // item count and builder
),
);
} else ... // handle other data states
},
),
],
),
),
]),
),
),
],
),
);
}
MediaQuery.removePadding(
context:context,
removeTop: true,
child ListView.Builder(
itemCount:2,
itemBuilder(context,index){
});