Flutter Hive: GroupBy the list By Date

Question

I'm working with Hive Flutter. I have a result list like this, but I want GroupBy the List By the Date.

Result what I want, something like this:

Monday, December 9,2019

ggh
ggh
ggh
ggh

I already research and I found some package: Collection Package. I try to groupby the list using this script, but the print is not what I want:

var groupData = groupBy(historyList, (obj) => historyList);
                  print(historyList);

Result

I/flutter (23894): {2019-12-09 01:08:56.328: [Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive']}
I/flutter (23894): {2019-12-09 00:57:22.455: [Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive']}
I/flutter (23894): {2019-12-09 00:57:01.274: [Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive']}
I/flutter (23894): {2019-12-09 00:56:56.992: [Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive']}
I/flutter (23894): {2019-12-09 00:56:47.549: [Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive', Instance of 'HistoryModelHive']}

This is my Model:

WatchBoxBuilder(
          box: Hive.box("history_box"),
          builder: (ctx, boxx) {
            final historyList = boxx.values.toList().cast<HistoryModelHive>();
            historyList.sort((first, end) =>
                end.dateHistoryCreate.compareTo(first.dateHistoryCreate));
            if (historyList.isEmpty) {
              return Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Image.asset(
                    "assets/images/empty2.png",
                    fit: BoxFit.cover,
                    height: 250,
                  ),
                  Text(
                    'Your History Empty',
                    textAlign: TextAlign.center,
                    style: textTheme.display1,
                  )
                ],
              );
            } else {
              return ListView.builder(
                itemCount: boxx.length,
                itemBuilder: (BuildContext context, int i) {
                  final historyData = historyList[i];
                  var groupData = groupBy(
                      historyList, (obj) => historyData.dateHistoryCreate);
                  print(groupData);
                  return ListViewHistory(
                    id: historyData.id,
                    receiverName: historyData.receiverName,
                    amountDebt: historyData.amountDebt,
                    amountLack: historyData.amountLack,
                    amountSubstract: historyData.amountSubstract,
                    dateHistoryCreate: historyData.dateHistoryCreate,
                    imageReceiver: historyData.imageReceiver,
                    imageSignature: historyData.imageSignature,
                    nameAction: historyData.nameAction,
                  );
                },
              );
            }
          },
        )),

score 3 · Accepted Answer · answered Dec 09 '19 at 07:44

You can use package https://pub.dev/packages/grouped_listview
You can copy paste run full code below

code snippet

List<History> historyList = [History("Monday, December 9,2019", "gghh"), History("Monday, December 11,2019", "1"), History("Monday, December 10,2019", "2"), History("Monday, December 9,2019", "gghh"),History("Monday, December 9,2019", "gghh"),History("Monday, December 10,2019", "5") ];

  @override
  Widget build(BuildContext context) {
    return GroupedListView<History, String>(
      collection: historyList,
      groupBy: (History g) => g.dateHistoryCreate,
      listBuilder: (BuildContext context, History g) => ListTile(title: Text(g.amountDebt.toString())),
      groupBuilder: (BuildContext context, String name) => Text(name),
    );
  }

demo

full code

import 'package:flutter/material.dart';
import 'package:grouped_listview/grouped_listview.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(        
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {      
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {   
    return Scaffold(
      appBar: AppBar(        
        title: Text(widget.title),
      ),
      body: Center(        
        child: Column(          
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(flex: 1, child: ExampleWidget()),
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), 
    );
  }
}

class History {
  String dateHistoryCreate;
  String amountDebt;

  History(this.dateHistoryCreate, this.amountDebt);
}

class ExampleWidget extends StatelessWidget {
  List<History> historyList = [History("Monday, December 9,2019", "gghh"), History("Monday, December 11,2019", "1"), History("Monday, December 10,2019", "2"), History("Monday, December 9,2019", "gghh"),History("Monday, December 9,2019", "gghh"),History("Monday, December 10,2019", "5") ];
  @override
  Widget build(BuildContext context) {
    return GroupedListView<History, String>(
      collection: historyList,
      groupBy: (History g) => g.dateHistoryCreate,
      listBuilder: (BuildContext context, History g) => ListTile(title: Text(g.amountDebt.toString())),
      groupBuilder: (BuildContext context, String name) => Text(name),
    );
  }
}

The newer and better-managed package would be: https://pub.dev/packages/grouped_list — Shashwat Aditya, Aug 19 '20 at 14:33

Flutter Hive: GroupBy the list By Date

1 Answers1