Flutter - Listview.builder inside another Listview

Adding shrinkWrap: true, physics: ScrollPhysics(), inside the listview.builder, in this case the listview.builder need an expanded parent. The physics: ScrollPhysics() will allow it to maintain its state without scrolling back to the first items. Also, you can use physics: NeverScrollableScrollPhysics(), if you don't want the listview.builder to be scrolled by the user.


I had this issue when I used two ListViews, one inside another. Nothing has worked for me except this workaround.

In the nested Listview, cover it with a ConstrainedBox and give it some large height. and use 'shrinkWrap: true' both ListViews. Since the shrinkwrap will trim the extra space, that extra height won't be an issue.

Flexible(
  child: ListView(
    children: <Widget>[
      //other Widgets here ...
      ConstrainedBox(
        constraints: BoxConstraints(maxHeight: 1000), // **THIS is the important part**
        child: ListView.builder(
          shrinkWrap: true,
          itemBuilder: (context, index) => _buildRow(index),
          itemCount: _elements.length,
        ),
      ),
    ],
  ),
),

Add shrinkWrap: true in listView.builder & Remove the top most Container or replace it with Column.


I want my screen to be scrollable so I put everything in a Listview.

I think you should use a CustomScrollView with slivers instead.

If it's the first time your hear about slivers, or if they seem a little bit scary, I suggest you to read this excellent article written by Emily Fortuna.

In your case, I would do something like this:

return CustomScrollView(
  slivers: <Widget>[
    SliverToBoxAdapter(
      // Put here all widgets that are not slivers.
      child: Container(),
    ),
    // Replace your ListView.builder with this:
    SliverList(
      delegate: SliverChildBuilderDelegate(
        (BuildContext context, int index) {
          return ListTile();
        },
      ),
    ),
  ],
);