Flutter - Reorderable List with a Listview nested inside expansiontile

2,106

I was able to solve the above issue with the new release of Flutter 1.17 which introduced the following

Change log for Flutter 1.17.0

49148 Exposed optional scrollController property in ReorderableListView

By adding a scroll controller in my reorderablelistview, I no longer encounter the multiple scroll views error above when a list view is nested inside a reorderablelistview widget

 ReorderableListView(
          scrollController: ScrollController(initialScrollOffset: 50),
Share:
2,106
noobiekes
Author by

noobiekes

Updated on December 20, 2022

Comments

  • noobiekes
    noobiekes over 1 year

    I am trying to build a sample with reorderable listview that has expansion tile as its child. Upon expanding the tile, it will present a listview to the user as follow Expanded tile with listview nested inside

    When all expansion tile are collapsed, i have no issue reordering the tiles by long pressing and moving it. But if one of the tiles are expanded, and user try to reorder the tiles, flutter will throw the following error and the expanded tile will not be able to collapse until hot reload

    ScrollController attached to multiple scroll views.
    'package:flutter/src/widgets/scroll_controller.dart':
    Failed assertion: line 111 pos 12: '_positions.length == 1'
    

    Not Collapsible listview

    How should I go about fixing it? The issue seems to stem from having a scroll controller nested in another scroll controller. Is there a way of forcing all expansion tile to collapse upon long pressing it? Thanks in advance

    List<int> a = [1, 2, 3];
    
      class _BlankPageState extends State<BlankPage> {
    @override
    Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
          body: Padding(
            padding: EdgeInsets.all(10),
            child: ReorderableListView(
                onReorder: (oldIndex, newIndex) {
                  print('now');
                  setState(
                    () {
                      if (newIndex > oldIndex) {
                        newIndex -= 1;
                      }
                      final int item = a.removeAt(oldIndex);
                      a.insert(newIndex, item);
                    },
                  );
                },
                children: a.map((index) {
                  return ExpansionTile(
                    backgroundColor: Colors.grey,
                    key: Key('$index'),
                    title: Text('Tile' + '${index.toString()}'),
                    children: <Widget>[
                      Container(
                        height: 100,
                        child: ListView(children: <Widget>[
                          Text('This is a test' + '$index'),
                          Text('This is a test' + '$index'),
                        ]),
                      )
                    ],
                  );
                }).toList()),
          ),
        ),
      );