flutter - 当我在 FutureBuilder 中调用 ListView.builder 时，总是崩溃
问题描述
我正在使用 cloud_firestore，并尝试显示用户信息列表。当我打电话ListView.builder时FutureBuilder，它总是崩溃。
List<dynamic> infoList = <dynamic>[];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: originAppBar(context, pageNames.discovery),
body: Center(
child: FutureBuilder<DocumentSnapshot>(
future: FirebaseFirestore.instance
.collection("users")
.doc(FirebaseAuth.instance.currentUser!.uid)
.get(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.hasData && snapshot.data!.exists) {
return ListView.builder(
shrinkWrap: true,
itemCount: infoList.length,
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
return Text(infoList[index]);
});
}
return const Center(child: LinearProgressIndicator());
},
),
));
}
我检查了数据是否正确获取。这样;
if (snapshot.hasData && snapshot.data!.exists) {
for (int i = 0; i < infoList; i++) {
print(infoList[i].ToString());
}
}
此 print() 正确显示字符串。
有错误显示；
════════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during performResize():
Horizontal viewport was given unbounded height.
Viewports expand in the cross axis to fill their container and constrain their children to match their extent in the cross axis. In this case, a horizontal viewport was given an unlimited amount of vertical space in which to expand.
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
When the exception was thrown, this was the stack
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 251:49 throw_
packages/flutter/src/rendering/viewport.dart 1424:15 <fn>
packages/flutter/src/rendering/viewport.dart 1435:14 computeDryLayout
packages/flutter/src/rendering/box.dart 2331:12 performResize
packages/flutter/src/rendering/object.dart 1837:9 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/proxy_box.dart 116:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/layout_helper.dart 56:10 layoutChild
packages/flutter/src/rendering/flex.dart 829:43 [_computeSizes]
packages/flutter/src/rendering/flex.dart 931:32 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/shifted_box.dart 437:7 performLayout
packages/flutter/src/rendering/object.dart 1858:7 layout
packages/flutter/src/rendering/custom_layout.dart 171:10 layoutChild
packages/flutter/src/material/scaffold.dart 1097:7 performLayout
packages/flutter/src/rendering/custom_layout.dart 240:7 [_callPerformLayout]
packages/flutter/src/rendering/custom_layout.dart 404:14 performLayout
packages/flutter/src/rendering/object.dart 1713:7 [_layoutWithoutResize]
packages/flutter/src/rendering/object.dart 885:17 flushLayout
packages/flutter/src/rendering/binding.dart 453:19 drawFrame
packages/flutter/src/widgets/binding.dart 883:13 drawFrame
packages/flutter/src/rendering/binding.dart 319:5 [_handlePersistentFrameCallback]
packages/flutter/src/scheduler/binding.dart 1143:15 [_invokeFrameCallback]
packages/flutter/src/scheduler/binding.dart 1080:9 handleDrawFrame
packages/flutter/src/scheduler/binding.dart 996:5 [_handleDrawFrame]
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/platform_dispatcher.dart 1003:13 invoke
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/platform_dispatcher.dart 157:5 invokeOnDrawFrame
C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine.dart 440:45 <fn>
The following RenderObject was being processed when the exception was fired: RenderViewport#5d88f NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
RenderObject: RenderViewport#5d88f NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
needs compositing
parentData: <none> (can use size)
constraints: BoxConstraints(0.0<=w<=1536.0, 0.0<=h<=Infinity)
size: MISSING
axisDirection: right
crossAxisDirection: down
offset: ScrollPositionWithSingleContext#747a0(offset: 0.0, range: null..null, viewport: null, ScrollableState, ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#220b1, ScrollDirection.idle)
anchor: 0.0
center child: RenderSliverPadding#d7763 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: paintOffset=Offset(0.0, 0.0)
constraints: MISSING
geometry: null
padding: EdgeInsets.zero
textDirection: ltr
child: RenderSliverList#e6b26 NEEDS-LAYOUT NEEDS-PAINT
parentData: paintOffset=Offset(0.0, 0.0)
constraints: MISSING
geometry: null
no children current live
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderViewport#5d88f NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderViewport#5d88f NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderIgnorePointer#e49f5 relayoutBoundary=up8 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderSemanticsAnnotations#2b185 relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderPointerListener#7224c relayoutBoundary=up6 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderSemanticsGestureHandler#62790 relayoutBoundary=up5 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderPointerListener#ef0e5 relayoutBoundary=up4 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: _RenderScrollSemantics#d53de relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE"
The relevant error-causing widget was
Column Column:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:18:20
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
hasSize
"RenderBox was not laid out: RenderViewport#5d88f NEEDS-PAINT"
The relevant error-causing widget was
ListView ListView:file:///D:/FlutterProjects/TestProject/lib/discovery.dart:27:35
════════════════════════════════════════════════════════════════════════════════
有谁知道解决方案？
谢谢你。
附加的
最后，这段代码运行良好！我将在这里为未来的我以及对这个问题感到恼火的人编写最终代码。
List<dynamic> infoList = <dynamic>[];
body: Center(
child: FutureBuilder<DocumentSnapshot>(
future: FirebaseFirestore.instance
.collection("users")
.doc(FirebaseAuth.instance.currentUser!.uid)
.get(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.hasData && snapshot.data!.exists) {
Map<String, dynamic> data =
snapshot.data!.data() as Map<String, dynamic>;
infoList = data["info"];
return ListView.builder(
shrinkWrap: true,
itemCount: infoList.length,
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
return Text(infoList[index]);
});
}
return const Center(child: LinearProgressIndicator());
},
),
)
解决方案
加入. shrinkWrap: true,_ListView.builder
由于您listview没有界限，flutter 无法理解它将渲染多少空间，要对其进行界限，您可以使用 aSizedbox或Container with height 。但它引发了另一个问题，它可以滚动或再次渲染框溢出错误！所以最好的方法是使用shrinkWrapinListView.builder来将列表视图用作动态小部件。
body: Center(
child: Column(
children: [
FutureBuilder<DocumentSnapshot>(
future: FirebaseFirestore.instance
.collection("users")
.doc(FirebaseAuth.instance.currentUser!.uid)
.get(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
print(snapshot.data!.exists);
if (snapshot.hasData && snapshot.data!.exists) {
return ListView.builder(
shrinkWrap: true, // here this is
itemCount: infoList.length,
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
return Text(infoList[index].ToString());
});
}
return const Center(child: LinearProgressIndicator());
},
),
],
))
推荐阅读
- ethereum - 在安全帽合同中导入 openzeppelin 错误
- debugging - CLion 调试缺少断点
- jquery - 正常的 Bootstrap 弹出窗口和 Angular 应用程序在一页中 - 弹出窗口不起作用
- dropwizard - Dropwizard ScheduledReporter 速率单位
- django - 如何在django中不同应用程序的models.py文件中登录用户数据（用户名）？
- oracle - ORA-00936: 缺少表达式 | ASP .NET CORE 3.1 MVC | 文件作为 | NPoco
- sql - CASE sql查询选择加密
- python - 遍历服务器中的所有用户
- r - 如何根据时间限制或服务器错误响应重试循环迭代？
- reactjs - webpack external 可以使用 importmap 吗？