Flutter中列内的展开列表视图
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Flutter中列内的展开列表视图相关的知识，希望对你有一定的参考价值。
我是Flutter的新手，现在已经在这里停留了一段时间。我试图在Flutter for Web中创建一个主屏幕，但是每次尝试将扩展属性应用于listview小部件时，我都会不断收到此错误。
这是代码，错误以及我要获取的内容：
[我正在尝试做的]： return Center(
child: Container(
height: MediaQuery. of(context). size. height,
width: MediaQuery. of(context). size. width,
alignment: Alignment.center,
child: Column(
children: <Widget>[
/*LEFT SIDE MENU*/
Expanded(
child: Column(
children: <Widget>[
ListView(
children: <Widget>[
Container(
color: Colors.red,
child: Text("RED"),
)
],
),
],
),
),
/*HORIZONTAL AND CENTRAL MENU*/
Column(
children: <Widget>[
/*HORIZONTAL MENU-ROW*/
Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
ListView(
children: <Widget>[
Container(
color: Colors.indigoAccent,
child: Text("BLUE"),
)
],
),
],
),
),
/*MAIN MENU-ROW*/
Expanded(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
color: Colors.green,
child: Text("GREEN"),
),
],
),
)
],
)
],
),
)
);
错误日志：
Launching lib\main.dart on Chrome in debug mode...
Syncing files to device Chrome...
Debug service listening on ws://127.0.0.1:62280/NmOsZXmtIqE=
Debug service listening on ws://127.0.0.1:62280/NmOsZXmtIqE=
══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
The following assertion was thrown during performLayout():
RenderFlex children have non-zero flex but incoming height constraints are unbounded.
When a column is in a parent that does not provide a finite height constraint, for example if it is
in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a
flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining
space in the vertical direction.
These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child
cannot simultaneously expand to fit its parent.
Consider setting mainAxisSize to MainAxisSize.min and using FlexFit.loose fits for the flexible
children (using Flexible rather than Expanded). This will allow the flexible children to size
themselves to less than the infinite remaining space they would otherwise be forced to take, and
then will cause the RenderFlex to shrink-wrap the children rather than expanding to fit the maximum
constraints provided by the parent.
If this message did not help you determine the problem, consider using debugDumpRenderTree():
https://flutter.dev/debugging/#rendering-layer
http://api.flutter.dev/flutter/rendering/debugDumpRenderTree.html
The affected RenderFlex is:
RenderFlex#f5e21 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE(creator: Column ← Column ← Align ← ConstrainedBox ← Container ← Center ← MainScreen ← _BodyBuilder ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ← AnimatedBuilder ← ⋯, parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size), constraints: BoxConstraints(0.0<=w<=929.0, 0.0<=h<=Infinity), size: MISSING, direction: vertical, mainAxisAlignment: start, mainAxisSize: max, crossAxisAlignment: center, verticalDirection: down)
The creator information is set to:
Column ← Column ← Align ← ConstrainedBox ← Container ← Center ← MainScreen ← _BodyBuilder ←
MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ← AnimatedBuilder ← ⋯
The nearest ancestor providing an unbounded width constraint is: RenderFlex#62f2b relayoutBoundary=up1 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE:
creator: Column ← Align ← ConstrainedBox ← Container ← Center ← MainScreen ← _BodyBuilder ←
MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ← AnimatedBuilder ←
DefaultTextStyle ← ⋯
parentData: offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(0.0<=w<=929.0, 0.0<=h<=876.0)
size: MISSING
direction: vertical
mainAxisAlignment: start
mainAxisSize: max
crossAxisAlignment: center
verticalDirection: down
See also: https://flutter.dev/layout/
If none of the above helps enough to fix this problem, please don't hesitate to file a bug:
https://github.com/flutter/flutter/issues/new?template=BUG.md
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:46:13
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 196:49 throw_
package:flutter/src/rendering/flex.dart 693:11 <fn>
package:flutter/src/rendering/flex.dart 717:15 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/flex.dart 746:14 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/shifted_box.dart 394:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 265:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/shifted_box.dart 394:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/custom_layout.dart 171:10 layoutChild
package:flutter/src/material/scaffold.dart 484:7 performLayout
package:flutter/src/rendering/custom_layout.dart 240:7 [_callPerformLayout]
package:flutter/src/rendering/custom_layout.dart 399:14 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/proxy_box.dart 1247:11 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/proxy_box.dart 3224:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/widgets/overlay.dart 700:14 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/proxy_box.dart 110:13 performLayout
package:flutter/src/rendering/object.dart 1767:7 layout
package:flutter/src/rendering/view.dart 167:48 performLayout
package:flutter/src/rendering/object.dart 1630:7 [_layoutWithoutResize]
package:flutter/src/rendering/object.dart 887:17 flushLayout
package:flutter/src/rendering/binding.dart 401:19 drawFrame
package:flutter/src/widgets/binding.dart 884:13 drawFrame
package:flutter/src/rendering/binding.dart 283:5 [_handlePersistentFrameCallback]
package:flutter/src/scheduler/binding.dart 1108:15 [_invokeFrameCallback]
package:flutter/src/scheduler/binding.dart 1047:9 handleDrawFrame
package:flutter/src/scheduler/binding.dart 856:7 <fn>
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/isolate_helper.dart 50:19 internalCallback
The following RenderObject was being processed when the exception was fired: RenderFlex#f5e21 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE:
creator: Column ← Column ← Align ← ConstrainedBox ← Container ← Center ← MainScreen ← _BodyBuilder ←
MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ← AnimatedBuilder ← ⋯
parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(0.0<=w<=929.0, 0.0<=h<=Infinity)
size: MISSING
direction: vertical
mainAxisAlignment: start
mainAxisSize: max
crossAxisAlignment: center
verticalDirection: down
This RenderObject had the following descendants (showing up to depth 5):
child 1: RenderFlex#9da6e NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child 1: RenderRepaintBoundary#b779b NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child: RenderCustomPaint#67333 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child: RenderRepaintBoundary#89099 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child: _RenderScrollSemantics#0b273 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child 2: RenderFlex#fb6ad NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child 1: _RenderColoredBox#0acb4 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
child: RenderParagraph#61e06 NEEDS-LAYOUT NEEDS-PAINT
text: TextSpan
════════════════════════════════════════════════════════════════════════════════════════════════════
Another exception was thrown: Assertion failed: file:///C:/flutter/packages/flutter/lib/src/rendering/box.dart:1694:12
Another exception was thrown: Assertion failed: file:///C:/flutter/packages/flutter/lib/src/rendering/shifted_box.dart:322:12
Another exception was thrown: NoSuchMethodError: '<Unexpected Null Value>'
════════ Exception caught by rendering library ═════════════════════════════════════════════════════
The following NoSuchMethodError was thrown during paint():
'<Unexpected Null Value>'
method not found
Receiver: null
Arguments: []
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
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 196:49 throw_
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 37:3 throwNullValueError
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 450:39 _notNull
package:flutter/src/rendering/flex.dart 475:38 get [_hasOverflow]
package:flutter/src/rendering/flex.dart 949:10 paint
...
The following RenderObject was being processed when the exception was fired: RenderFlex#62f2b relayoutBoundary=up1
... needs compositing
... parentData: offset=Offset(0.0, 0.0) (can use size)
... constraints: BoxConstraints(0.0<=w<=929.0, 0.0<=h<=876.0)
... size: MISSING
... direction: vertical
... mainAxisAlignment: start
... mainAxisSize: max
... crossAxisAlignment: center
... verticalDirection: down
RenderObject: RenderFlex#62f2b relayoutBoundary=up1
needs compositing
parentData: offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(0.0<=w<=929.0, 0.0<=h<=876.0)
size: MISSING
direction: vertical
mainAxisAlignment: start
mainAxisSize: max
crossAxisAlignment: center
verticalDirection: down
... child 1: RenderFlex#6be7a NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: offset=Offset(0.0, 0.0); flex=1; fit=FlexFit.tight
... constraints: MISSING
... size: MISSING
... direction: vertical
... mainAxisAlignment: start
... mainAxisSize: max
... crossAxisAlignment: center
... verticalDirection: down
... child 1: RenderRepaintBoundary#15c70 NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: offset=Offset(0.0, 0.0); flex=null; fit=null
... constraints: MISSING
... size: MISSING
... usefulness ratio: no metrics collected yet (never painted)
... child: RenderCustomPaint#79694 NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: <none>
... constraints: MISSING
... size: MISSING
... child: RenderRepaintBoundary#81e95 NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: <none>
... constraints: MISSING
... size: MISSING
... usefulness ratio: no metrics collected yet (never painted)
... child 2: RenderFlex#f5e21 relayoutBoundary=up2 NEEDS-PAINT
... needs compositing
... parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size)
... constraints: BoxConstraints(0.0<=w<=929.0, 0.0<=h<=Infinity)
... size: MISSING
... direction: vertical
... mainAxisAlignment: start
... mainAxisSize: max
... crossAxisAlignment: center
... verticalDirection: down
... child 1: RenderFlex#9da6e NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: offset=Offset(0.0, 0.0); flex=1; fit=FlexFit.tight
... constraints: MISSING
... size: MISSING
... direction: horizontal
... mainAxisAlignment: spaceEvenly
... mainAxisSize: max
... crossAxisAlignment: center
... textDirection: ltr
... verticalDirection: down
... child 1: RenderRepaintBoundary#b779b NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: offset=Offset(0.0, 0.0); flex=null; fit=null
... constraints: MISSING
... size: MISSING
... usefulness ratio: no metrics collected yet (never painted)
... child: RenderCustomPaint#67333 NEEDS-LAYOUT NEEDS-PAINT
... needs compositing
... parentData: <none>
... constraints: MISSING
... size: MISSING
... child 2: RenderFlex#fb6ad NEEDS-LAYOUT NEEDS-PAINT
... parentData: offset=Offset(0.0, 0.0); flex=1; fit=FlexFit.tight
... constraints: MISSING
... size: MISSING
... direction: horizontal
... mainAxisAlignment: spaceEvenly
... mainAxisSize: max
... crossAxisAlignment: center
... textDirection: ltr
... verticalDirection: down
... child 1: _RenderColoredBox#0acb4 NEEDS-LAYOUT NEEDS-PAINT
... parentData: offset=Offset(0.0, 0.0); flex=null; fit=null
... constraints: MISSING
... size: MISSING
... behavior: opaque
... child: RenderParagraph#61e06 NEEDS-LAYOUT NEEDS-PAINT
... parentData: <none>
... constraints: MISSING
... size: MISSING
... textAlign: start
... textDirection: ltr
... softWrap: wrapping at box width
... overflow: clip
... locale: en_US
... maxLines: unlimited
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (2) Exception caught by rendering library ═════════════════════════════════════════════════
RenderFlex children have non-zero flex but incoming height constraints are unbounded.
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:46:13
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (3) Exception caught by rendering library ═════════════════════════════════════════════════
Assertion failed: file:///C:/flutter/packages/flutter/lib/src/rendering/box.dart:1694:12
hasSize
"RenderBox was not laid out: RenderFlex#f5e21 relayoutBoundary=up2 NEEDS-PAINT"
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (4) Exception caught by rendering library ═════════════════════════════════════════════════
Assertion failed: file:///C:/flutter/packages/flutter/lib/src/rendering/shifted_box.dart:322:12
child.hasSize
is not true
The relevant error-causing widget was:
Container file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:21:14
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (5) Exception caught by rendering library ═════════════════════════════════════════════════
'<Unexpected Null Value>'
method not found
Receiver: null
Arguments: []
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (6) Exception caught by rendering library ═════════════════════════════════════════════════
Assertion failed: file:///C:/flutter/packages/flutter/lib/src/rendering/box.dart:1694:12
hasSize
"RenderBox was not laid out: RenderFlex#f5e21 relayoutBoundary=up2 NEEDS-PAINT"
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (7) Exception caught by rendering library ═════════════════════════════════════════════════
Assertion failed: file:///C:/flutter/packages/flutter/lib/src/rendering/shifted_box.dart:322:12
child.hasSize
is not true
The relevant error-causing widget was:
Container file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:21:14
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (8) Exception caught by rendering library ═════════════════════════════════════════════════
'<Unexpected Null Value>'
method not found
Receiver: null
Arguments: []
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (9) Exception caught by rendering library ═════════════════════════════════════════════════
'<Unexpected Null Value>'
method not found
Receiver: null
Arguments: []
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
════════════════════════════════════════════════════════════════════════════════════════════════════
════════ (10) Exception caught by rendering library ════════════════════════════════════════════════
'<Unexpected Null Value>'
method not found
Receiver: null
Arguments: []
The relevant error-causing widget was:
Column file:///C:/Users/Jorge%20Antelo/Desktop/Flutter/hotelmanager/lib/mainContainer.dart:25:16
════════════════════════════════════════════════════════════════════════════════════════════════════
Application finished.
答案
发生此错误是因为您尝试无限制地进行扩展。 Expanded Widget与尺寸受限制的父级一起使用。由于您直接将其用作列中的子项之一，因此无法推断出该采取哪种措施。
默认情况下，Expanded展开以填充父级的尺寸，因此您必须提供一个父级，例如容器，填充或sizeBoxed
以上是关于Flutter中列内的展开列表视图的主要内容，如果未能解决你的问题，请参考以下文章
除了最后一个单元格中的第一个之外，每行的倒数第二列内的下拉列表不起作用[重复]