Flutter IndexedWidgetBuilder with ListView.builder具有动态的项目数？

Question

说我要从API检索一些数据，我想将它们放入ListView.builder中。我想进行延迟加载，因为在任何时候，屏幕上只会显示三个项目。假设数据看起来像这样，我们不能保证会得到所有标头，而且我们也不知道contents中有多少个项目。

header: HeaderOne
contents: [ItemOne, ItemTwo, ItemThree]

header: HeaderTwo
contents: [ItemOne]

header: HeaderThree // don't display this because contents is empty
contents: [] // don't display this because contents is empty

header: HeaderFour
contents: [ItemOne, ItemTwo]

如果您滚动浏览，UI中的ListView将看起来像这样：

HeaderOne
ItemOne
ItemTwo
ItemThree
HeaderTwo
ItemOne
HeaderFour
ItemOne
ItemTwo

我在ListView.builder（）中的itemBuilder属性变得有些可怕。这是一些伪代码：

itemBuilder: (BuildContext context, index i) {
  if (i == 0 && data.hasHeaderOne) { return _buildHeaderOne(); }
  else if (i == 0 && !data.hasHeaderOne) { return _buildHeaderTwo(); }
  else if (i == 1 && data.hasHeaderOne { return _buildContents(headerOneContents[0]); }
  else if (i == (1 + data.headerOneContents.length) && data.hasHeaderOne && data.hasHeaderTwo) { return _buildContents(headerTwoContents[i+someNumberIHaveToCalculate]); }
  ...
}

绝对有更好的方法可以做到这一点！我考虑过嵌套ListView.builder（），但不确定如何影响性能或滚动。

目标是在我不知道每个项目的索引时使用构建器。我可以计算项目总数（在此示例中为9），但是如果不编写复杂的if-else代码，我看不出有什么帮助。

Answer 1

我最终这样做的方式是创建一个小部件构建器列表，而不是小部件。例如。类似于：

typedef WidgetBuilder Widget Function();

...

final itemBuilder = <WidgetBuilder>[
if (data.hasHeaderOne) () => _buildHeaderOne(),
for (item in data.headerOneContents) () => _buildContents(item),
...
];

return ListView.builder(
  itemCount: itemBuilder.length, 
  itemBuilder: (_, item) => itemBuilder[item](),
);