Is it possible to use ListView.builder inside of CustomScrollView?

Question

Is it possible to use ListView.builder (or something similar) inside of a CustomScrollView? I have a CustomScrollView like this:

return Scaffold(
  body: CustomScrollView(
    slivers: [
      SliverAppBar(...),
      SliverList(delegate: SliverChildListDelegate(children))
    ],
  ),
);

This works great, but in my actual scenario the list could have thousands of items, so I do not want to pass them all in to SliverChildListDelegate. I want to use ListView.builder (or something similar) to build the items as they are scrolled into view. I was expecting there to be a .builder constructor on either SliverList or SliverChildListDelegate but I don't see anything like that. Am I missing something?

Answer 1

The delegate argument of SliverList is not necessarily a SliverChildListDelegate.

You can also use SliverChildBuilderDelegate to achieve the builder effect of ListView.builder

SliverList(delegate: SliverChildBuilderDelegate((context, index) {
  return Container();
}));

Answer 2

You can use List.generate as example below

return Scaffold(
 body: CustomScrollView(
    slivers: [
      SliverAppBar(...),
      SliverList(delegate: SliverChildListDelegate(
          List.generate(yourList.length, (idx) {
                return Padding(
                  padding: const EdgeInsets.only(left: 8.0, right: 8.0),
                  child: Card(
                    child: ListTile(
                      leading: Icon(null),
                      title: Text(yourList[idx]),
                      onTap: null,
                    ),
                  ),
                );
              })
      ))
    ],
  ),
);

Answer 3

I'm not sure how it is done in CustomScrollView but you can try this:

Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(...),
          ];
        },
        body: ListView.builder(..),)
);