2

I'm trying to have a ListView builder with approximatively 500 items in a SliverList inside a CustomScrollView.

Scaffold(
    appBar: AppBar(
      title: Text(
        'Test',
        style: TextStyle(fontFamily: 'Diogenes', fontSize: 30),
      ),
      actions: [
        // IconButton(icon: Icon(Icons.list)),
      ],
    ),
    body: CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(...),
        SliverToBoxAdapter(...),
        SliverList(
            delegate: SliverChildBuilderDelegate((context, index) =>
                getHistoricalFixtures(pythiePerformance)))
      ],
    ),
  );

Widget getHistoricalFixtures(data) {
return Padding(
  padding: EdgeInsets.fromLTRB(10, 0, 10, 10),
  child: Container(
    height: 2000,
    child: _buildFixtures(data),
  ),
);

}

Widget _buildFixtures(data) {
return new ListView.builder(
    itemCount: data.historicalFixtures.length,
    physics: NeverScrollableScrollPhysics(),
    itemBuilder: (context, index) {
      return Container(...)
    });

}

It's working fine when the ListView is embedded within a Container with a fixed size. But, obviously, I can't see all items in the list.

I tried to put the ListView inside an Expanded widget but got this error:

Any help would be very appreciate.

Thanks.

Valouf
  • 55
  • 1
  • 6
  • https://stackoverflow.com/questions/54973948/is-it-possible-to-use-listview-builder-inside-of-customscrollview/64779555 The question has been answered here. – Dangdat Apr 26 '21 at 17:14
  • Wrap the CustomScrollView in a Container and give it a width "MediaQuery.of(context).size.width"... this should work – Jerin May 21 '21 at 08:37

2 Answers2

0

You have to use SliverList (about add list view inside CustomScrollView) or use SliverGrid (about add grid view inside CustomScrollView) like following codes:

SliverList(
          delegate: SliverChildListDelegate(
            [
              BodyWidget(Colors.blue),
              BodyWidget(Colors.red),
              BodyWidget(Colors.green),
              BodyWidget(Colors.orange),
              BodyWidget(Colors.blue),
              BodyWidget(Colors.red),
            ],
          ),
        ),

OR

SliverGrid(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
          delegate: SliverChildListDelegate(
            [
              BodyWidget(Colors.blue),
              BodyWidget(Colors.green),
              BodyWidget(Colors.yellow),
              BodyWidget(Colors.orange),
              BodyWidget(Colors.blue),
              BodyWidget(Colors.red),
            ],
          ),
        ),

I hope this link will be useful :)

https://medium.com/codechai/flutter-listview-gridview-inside-scrollview-68b722ae89d4

Ehsan Kalali
  • 411
  • 6
  • 16
  • A link to a solution is welcome, but please ensure your answer is useful without it: [add context around the link](//meta.stackexchange.com/a/8259) so your fellow users will have some idea what it is and why it is there, then quote the most relevant part of the page you are linking to in case the target page is unavailable. [Answers that are little more than a link may be deleted.](/help/deleted-answers) – 4b0 Jul 02 '21 at 16:35
0

I've used SliverToBoxAdapter instead of SliverList

                SliverToBoxAdapter(
                  child: Container(
                    height: 1000,
                    child: ListView.builder( ...
jhenya-d
  • 399
  • 7
  • 19