Flutter ListView 的自定义 Widget 包括 ListView 给出错误

Question

我正在尝试创建一个显示列表中多个项目的小部件，使用其他小部件（包括自定义小部件）来显示这些项目

结构如下：

TriesWidget
-- Container
------ TryWidget
-------- Row
---------- IconButton
---------- CombinationWidget
------------ Row
-------------- ListView
---------------- ... (Container)

这是应用程序的工作代码，只有一项（最后一项）

TriesWidget

class TriesWidget extends StatefulWidget {

  final Mastermind mastermind;

  TriesWidget({Key key, @required this.mastermind}) : super(key: key);

  @override
  _TriesWidgetState createState() => _TriesWidgetState();
}

class _TriesWidgetState extends State<TriesWidget> {

  void _handleButtonPressed(bool newValue) {
    setState(() {
      widget.mastermind.checkLastTry();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: TryWidget(
          tryModel: widget.mastermind.tries.last,
          onChanged: _handleButtonPressed
      ),
    );
  }
}

TryWidget

class TryWidget extends StatelessWidget {

  TryWidget({Key key, @required this.tryModel, @required this.onChanged}) : super(key: key);

  final ValueChanged<bool> onChanged;
  final Try tryModel;

  void _handlePressed() {
    onChanged(true);
  }

  Widget build(BuildContext context) {
    return Row(
      children: <Widget>[
        CombinationWidget( combination: tryModel.tryCode),
        IconButton(
          iconSize: 50,
          onPressed: _handlePressed,
          icon: Icon(Icons.check_circle, color: Colors.lightGreen,),
        ),
      ],
    );
  }
}

组合小部件

class CombinationWidget extends StatefulWidget {

  final Combination combination;

  CombinationWidget({Key key, @required this.combination}) : super(key: key);

  @override
  _CombinationWidgetState createState() => _CombinationWidgetState();
}

class _CombinationWidgetState extends State<CombinationWidget> {

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        ListView.builder(
            shrinkWrap: true,
            itemCount: Settings.codeLength,
            scrollDirection: Axis.horizontal,
            itemBuilder: (context, position)
            {
              return GestureDetector(
                onTap: () => _modifyCode(position),
                child: new PegItem(pegModel: widget.combination[position]),
              );
            }
        ),
      ],
    );
  }

  void _modifyCode(int position)
  {
    setState(()
    {
      Mastermind.modifyCode(widget.combination, position);
    });
  }

}

这是应该产生我预期结果的一段代码（显示所有项目）：

TriesWidget

class TriesWidget extends StatefulWidget {

  final Mastermind mastermind;

  TriesWidget({Key key, @required this.mastermind}) : super(key: key);

  @override
  _TriesWidgetState createState() => _TriesWidgetState();
}

class _TriesWidgetState extends State<TriesWidget> {

  void _handleButtonPressed(bool newValue) {
    setState(() {
      widget.mastermind.checkLastTry();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      height: double.maxFinite,
      child: ListView.builder(
          itemCount: widget.mastermind.tries.length,
          shrinkWrap: true,
          itemBuilder: (BuildContext context, int index) {
            return new TryWidget(
                tryModel: widget.mastermind.tries.elementAt(index),
                onChanged: _handleButtonPressed
            );
          }
      ),
    );
  }
}

以及它产生的错误：

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
The following assertion was thrown during performLayout():
'package:flutter/src/rendering/viewport.dart': Failed assertion: line 1634 pos 16: 'constraints.hasBoundedHeight': is not true.


Either the assertion indicates an error in the framework itself, or we should provide substantially more information in this error message to help you determine and fix the underlying cause.
In either case, please report this assertion by filing a bug on GitHub:
  https://github.com/flutter/flutter/issues/new?template=BUG.md

User-created ancestor of the error-causing widget was: 
  ListView file:///C:/Users/TBG/Repositories/CPE-S7_MPA_Mastermind/FlutterTest/flutter_app/lib/widgets/combination.widget.dart:25:18
When the exception was thrown, this was the stack: 
#2      RenderShrinkWrappingViewport.performLayout (package:flutter/src/rendering/viewport.dart:1634:16)
#3      RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
#4      RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
#5      RenderObject.layout (package:flutter/src/rendering/object.dart:1701:7)
#6      RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
...
The following RenderObject was being processed when the exception was fired: RenderShrinkWrappingViewport#f596e relayoutBoundary=up28 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
...  needs compositing
...  parentData: <none> (can use size)
...  constraints: BoxConstraints(unconstrained)
...  size: MISSING
...  axisDirection: right
...  crossAxisDirection: down
...  offset: ScrollPositionWithSingleContext#ee282(offset: 0.0, range: null..null, viewport: null, ScrollableState, ClampingScrollPhysics, IdleScrollActivity#4b904, ScrollDirection.idle)
RenderObject: RenderShrinkWrappingViewport#f596e relayoutBoundary=up28 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
  needs compositing
  parentData: <none> (can use size)
  constraints: BoxConstraints(unconstrained)
  size: MISSING
  axisDirection: right
  crossAxisDirection: down
  offset: ScrollPositionWithSingleContext#ee282(offset: 0.0, range: null..null, viewport: null, ScrollableState, ClampingScrollPhysics, IdleScrollActivity#4b904, ScrollDirection.idle)
...  child 0: RenderSliverPadding#5928b NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
...    parentData: layoutOffset=0.0
...    constraints: MISSING
...    geometry: null
...    padding: EdgeInsets.zero
...    textDirection: ltr
...    child: RenderSliverList#44c1f NEEDS-LAYOUT NEEDS-PAINT
...      parentData: paintOffset=Offset(0.0, 0.0)
...      constraints: MISSING
...      geometry: null
...      no children current live
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ (2) Exception caught by rendering library ═════════════════════════════════════════════════
RenderBox was not laid out: RenderShrinkWrappingViewport#f596e relayoutBoundary=up28 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was: 
  ListView file:///C:/Users/TBG/Repositories/CPE-S7_MPA_Mastermind/FlutterTest/flutter_app/lib/widgets/combination.widget.dart:25:18
════════════════════════════════════════════════════════════════════════════════════════════════════

[...]

════════ (28) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderConstrainedBox#ac5d6 relayoutBoundary=up2 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was: 
  Scaffold file:///C:/Users/TBG/Repositories/CPE-S7_MPA_Mastermind/FlutterTest/flutter_app/lib/widgets/mastermind.widget.dart:21:12
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ (29) Exception caught by rendering library ════════════════════════════════════════════════
RenderBox was not laid out: RenderFlex#faa61 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
User-created ancestor of the error-causing widget was: 
  Scaffold file:///C:/Users/TBG/Repositories/CPE-S7_MPA_Mastermind/FlutterTest/flutter_app/lib/widgets/mastermind.widget.dart:21:12
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ (30) Exception caught by rendering library ════════════════════════════════════════════════
The method '>' was called on null.
Receiver: null
Tried calling: >(1e-10)
User-created ancestor of the error-causing widget was: 
  Scaffold file:///C:/Users/TBG/Repositories/CPE-S7_MPA_Mastermind/FlutterTest/flutter_app/lib/widgets/mastermind.widget.dart:21:12
════════════════════════════════════════════════════════════════════════════════════════════════════

我在网上尝试了很多解决方案（添加收缩、约束、固定高度、使用扩展，...），但我找不到问题，它的解决方案

Answer 1

您收到“viewport hasBoundedHeight”错误的原因是您在 ListView 中使用了 ListView。您可能需要考虑使用 CustomScrollView 和 SliverList。 here.