首页 > 解决方案 > Flutter,如何解决“RenderBox 未布置:...NEEDS-PAINT”

问题描述

我正在尝试使用GridView.builder并在每一行中显示一个孩子来显示一个列表......这是代码的一部分:

SafeArea(
        child: Column(
          children: [
            Header(),
            SizedBox(height: 20),
            Expanded(child: SingleChildScrollView(child: Konten())),

          ],
        ),
      )

和代码Konten()

Padding(
      padding: const EdgeInsets.all(10),
      child: GridView.builder(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: data.length,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 1,
            crossAxisSpacing: 16,
            mainAxisSpacing: 16,
            childAspectRatio:
                10
            ),
        itemBuilder: (context, index) => Container(
          alignment: Alignment.center,
          child: Text(data[index]["API"]),
          decoration: BoxDecoration(
              color: Colors.amber, borderRadius: BorderRadius.circular(15)),
        ),
      ),
    )

但我收到此错误:

════════ Exception caught by rendering library ═════════════════════════════════
Assertion failed:
../…/rendering/box.dart:1930
hasSize
"RenderBox was not laid out: RenderRepaintBoundary#0992d relayoutBoundary=up3 NEEDS-PAINT"

The relevant error-causing widget was
Column
lib/screen_utama.dart:18
════════════════════════════════════════════════════════════════════════════════

我使用的列表data是来自 api 的数据...但是当我将数据更改为这个时,它不会显示错误:

List data=List.generate(10, (index) => {"id": index, "name": "Lowongan $index"})
      .toList();

有没有办法解决这个问题?

标签: flutterwidget

解决方案


认为当您的数据为空时会发生这种情况。当没有数据可用时,您可以通过显示一个空的占位符来简单地修复它。

对于您的Konten小部件,build函数可能如下所示:

@override
  Widget build(BuildContext context) {
    if (data.isEmpty){
      return Text('no content available');
    }

    return Padding(
      padding: const EdgeInsets.all(10),
      child: GridView.builder(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: data.length,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 1, crossAxisSpacing: 16, mainAxisSpacing: 16, childAspectRatio: 10, mainAxisExtent: 0),
        itemBuilder: (context, index) => Container(
          alignment: Alignment.center,
          child: Text(data[index]["API"]),
          decoration: BoxDecoration(color: Colors.amber, borderRadius: BorderRadius.circular(15)),
        ),
      ),
    );
  }

推荐阅读