A Flutter ListView in which items can be grouped into sections

grouped  listview package for flutter

a flutter list view in which list items can be grouped to sections.

getting started

add the package to your pubspec.yaml:

grouped_list: ^1.3.1

in your dart file, import the library:

import 'package:grouped_list/grouped_list.dart';

instead of using a listview create a groupedlistview widget:

 groupedlistview(
   elements: _elements,
   groupby: (element) => element['group'],
   groupseparatorbuilder: _buildgroupseparator,
   itembuilder: (context, element) => text(element['name']),
   order: groupedlistorder.asc,
 ),

you can also use most fields from the listview.builder constructor.

required parameters:

• elements: a list of the data you want to display in the list.
• groupby: function which maps an element to its grouped value.
• itembuilder: function which returns an widget which defines the item.
• groupseparator: function which returns an widget which defines the section separator.

widget _buildgroupseparator(dynamic groupbyvalue) {
  return text('$groupbyvalue');
}

the parameter groupbyvalue has the return type of the defined groupby function.

optional parameters:

• order: by default it’s groupedlistorder.asc. change to groupedlistorder.desc for reversing the group sorting.
• separator: a widget which defines a separator between items inside a section.
• sort: a bool which defines if the passed data should be sorted by the widget. by default it’s true.

notice:

• the item builder functions only creates the actual list items. for seperator items use the separator parameter.
• other than the itembuilder function of the listview.builder constructor the function provides the specific element instead of the index as parameter.
• the elements need to be sorted according to the groupby return value. the widgets sorts the elements by default. disable the sorting only if your list is sorted beforehand.