Can Flutter efficiently layout nested lists?

谁说胖子不能爱 提交于 2019-12-21 22:29:13

问题


Can a layout like this be achieved and rendered efficiently in Flutter?

Example:

Yellow and blue blocks can both be around 30 elements, so I guess something like ListView.builder should be used.

I have tried nesting 2 ListView.builder, the inner with shrinkWrap = true. The yellow block is being built just when is needed, but the blue list, although it has an itemBuilder, it builds all children elements at once, causing performance problems.

new ListView.builder(
  itemCount: 20,
  itemBuilder: (BuildContext context, int blockIdx) {
    print("Building block $blockIdx");
    return new Column(
      children: [
        Padding(
          child: Text("Block $blockIdx"),
          padding: EdgeInsets.all(8.0)
        ),
        ListView.builder(
          shrinkWrap: true,
          physics: ClampingScrollPhysics(),
          itemCount: 30,
          itemBuilder: (BuildContext context, int childIdx) {
            print("Building block $blockIdx child $childIdx");
            return Padding(
              child: Text("Child $childIdx"),
              padding: EdgeInsets.only(left: 20.0, right: 8.0, top: 8.0, bottom: 8.0),
            );
          },
        );
      ],
    );
  },
);

Thanks in advance.

来源:https://stackoverflow.com/questions/54034978/can-flutter-efficiently-layout-nested-lists

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!