как сгруппировать список виджетов в серебряный список?

#flutter #dart

#flutter #dart

Вопрос:

у меня есть список виджетов, которые я хотел бы сгруппировать по дате: это код :

         SliverList(
          delegate: (homeSection == "list")
              ? SliverChildBuilderDelegate(
                  (BuildContext context, int index) {
                  List<prefix3.Transaction> transactions =
                      getTransactionsToDisplay(queryString, vm);
                  return (transactions.length > index)
                      ? Column(
                          children: <Widget>[
                            InkWell(
                              onTap: () {
                                Navigator.push(
                                  context,
                                  MaterialPageRoute(
                                    builder: (context) =>
                                        MMpataTransactionDetails(
                                      transaction: transactions[index],
                                    ),
                                  ),
                                );
                              },
                              child: Container(
                                margin: EdgeInsets.only(left: 10),
                                child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: <Widget>[
                                      // ignore: unrelated_type_equality_checks
                                      (int.parse(transactions[index]
                                                  .getDate2()) ==
                                              DateTime.now().day)
                                          ? Text(
                                              'Aujourd'hui',
                                              style: TextStyle(
                                                fontSize: 17.0,
                                                color: transactions[index]
                                                    .getBgColor(),
                                              ),
                                            )

                                          // ignore: unrelated_type_equality_checks
                                          : (int.parse(transactions[index]
                                                      .getDate2()) ==
                                                  DateTime.now().day - 1)
                                              ? Text(
                                                  'Hier',
                                                  style: TextStyle(
                                                    fontSize: 17.0,
                                                    color:
                                                        transactions[index]
                                                            .getBgColor(),
                                                  ),
                                                )
                                              : Text(
                                                  transactions[index]
                                                      .getDate4(),
                                                  style: TextStyle(
                                                    fontSize: 17.0,
                                                    color:
                                                        transactions[index]
                                                            .getBgColor(),
                                                  ),
                                                ),
                                      colorCard2(
                                        transactions[index].getLetter(),
                                        transactions[index].getLibelle(),
                                        transactions[index].getSubtitle(),
                                        transactions[index].getAmount(),
                                        transactions[index].getDate3(),
                                        context,
                                        Colors.white,
                                        transactions[index].getBgColor(),
                                      )
                                    ]),
                              ),
                            ),
                          ],
                        )
                      : null;
                })
 

и виджет colorCard2 :

     Widget colorCard2(String letter, String text, String subtext, 
  String amount,
  String date, BuildContext context, Color color, Color color2) {
final _media = MediaQuery.of(context).size;
return Container(
  margin: EdgeInsets.only(right: 10, top: 10, bottom: 10),
  padding: EdgeInsets.only(right: 5, top: 25),
  height: screenAwareSize(100, context),
  width: _media.width,
  decoration: BoxDecoration(
    color: color,
    borderRadius: BorderRadius.circular(5),
  
  ),
  child: Column(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: <Widget>[
      ListTile(
        leading: new CircleAvatar(
            backgroundColor: color2,
            child: new Text(
              letter,
              style: TextStyle(
                color: color,
                fontSize: 17.0,
                fontWeight: FontWeight.bold,
              ),
            )),
        title: Text(
          'Transfert',
          style: TextStyle(fontSize: 15),
        ),
        subtitle: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            SizedBox(height: 2.0),
            Text(
              subtext,
              style: TextStyle(
                fontSize: 12.0,
              ),
            ),
            SizedBox(height: 2.0),
            Text(
              date,
              style: TextStyle(
                fontSize: 12.0,
              ),
            ),
            SizedBox(height: 2.0),
          ],
        ),
        trailing: Container(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              new Text(
                amount,
                style:
                    TextStyle(fontSize: 13.0, fontWeight: FontWeight.bold),
              ),
              SizedBox(height: 5.0),
            ],
          ),
        ),
      ),
    ],
  ),
);
 

}

в соответствии с этим я хотел бы сгруппировать список транзакций с одинаковой датой, и для этого я использовал collection пакет dart, но он не работает. я также пытался найти функцию dart, которая может это сделать, но я ее не нашел. вот фактический результат : введите описание изображения здесь

как я уже сказал, я хотел бы сгруппировать виджеты с одинаковой датой.

Ответ №1:

Что, если вы используете flutter_sticky_header для разделения по дате:

 CustomScrollView(
              physics: AlwaysScrollableScrollPhysics(),
              slivers: _sliverListContentList(),
            ),
...

List<SliverStickyHeader> _sliverListContentList(){
  List<SliverStickyHeader> list = [];

  for(int i=0; i>transcations.length; i  ){
    list.add(_sliverListSubContent(/* transactions where has same day*/);
  }

  return list;
}

...

SliverStickyHeader _sliverListSubContent(/* list of same day transactions*/){
  return SliverStickyHeader(
      header: //TODO your Date container
      sliver: SliverList(
        delegate: SliverChildBuilderDelegate(
          (context, i) {
            //TODO list of same day transactions content
          },
          childCount: /* count of your same day transactions*/,
        ),
      ),
    );
}