Flutter BUG 关于RenderBox was not laid out: RenderViewport#680c1 NEEDS-LAYOUT NEEDS-PAINT

使用了ListView.builder 布局空白,log提示RenderBox was not laid out: RenderViewport#680c1 NEEDS-LAYOUT NEEDS-PAINT的问题.

在进行Flutter布局绘制时,不可避免的使用ListView.builder().
但是这个很大概率在使用上会嵌套在Row或者Column组件内.
就会出现预期的页面一片空白,Log日志会提示:

I/flutter ( 3616): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter ( 3616): The following assertion was thrown during performResize():
I/flutter ( 3616): Vertical viewport was given unbounded height.
.
.
.
This RenderObject had the following descendants (showing up to depth 5):
I/flutter ( 3616):   RenderSliverPadding#0d3d4 NEEDS-LAYOUT NEEDS-PAINT
I/flutter ( 3616):     RenderSliverList#6716e NEEDS-LAYOUT NEEDS-PAINT
I/flutter ( 3616): ════════════════════════════════════════════════════════════════════════════════════════════════════
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderViewport#680c1 NEEDS-LAYOUT NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderViewport#680c1 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderIgnorePointer#4730f relayoutBoundary=up24 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderSemanticsAnnotations#61c50 relayoutBoundary=up23 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderPointerListener#0febd relayoutBoundary=up22 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderSemanticsGestureHandler#81c5b relayoutBoundary=up21 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderPointerListener#d8e60 relayoutBoundary=up20 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: _RenderScrollSemantics#4cd4e relayoutBoundary=up19 NEEDS-PAINT
I/flutter ( 3616): Another exception was thrown: RenderBox was not laid out: RenderRepaintBoundary#39958 relayoutBoundary=up18 NEEDS-PAINT

具体原因就是:

在Flutter 的Column或者Row内使用ListView.builder()需要对改ListView的大小进行指定.

具体的解决办法就是 在该ListView.builder()外嵌套一个SizeBox或者Container即可…

比如:

 @override
  Widget build(BuildContext context) {
    return ListView.builder(
        itemCount: 3,
        itemBuilder: (context, index) => showRecommendItem(index));
  }

就不行,直接整个页面白屏,然后log提示RenderBox 相关的信息,
但是在外面嵌套一个SizeBox,指定一下高度,就可以了.

 @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: ScreenUtil().setHeight(900.0),
      child: ListView.builder(
          itemCount: 3,
          itemBuilder: (context, index) => showRecommendItem(index)),
    );
  }