флаттер: как использовать DataTable с Listview.builder

#flutter #material-ui #flutter-layout

Вопрос:

недавно я разработал приложение, использующее flutter и sqflite. для отображения данных в табличной форме я использую виджет DataTable, но проблема, с которой я сталкиваюсь, когда я использую DataTable с ListView.builder, но он не отображает данные так, как я хотел бы отобразить. я имею в виду, что для красных данных из базы данных я использую listview.builder, он повторяет строки и столбцы каждый раз, когда получает запись из базы данных. но я хочу, чтобы столбцы отображались один раз, а строки повторялись для каждой записи, существующей в базе данных. я пытаюсь обернуть только строку с помощью listview.builder, но это невозможно с помощью DataTable. может ли кто — нибудь подсказать мне, как я могу решить эту проблему. а также данные могут быть разбиты на страницы или нет

Ответ №1:

       List<Cells> cellsList =[];
      List<DataCell> list =[];


      Widget dataTable(list) {
          for (int i = 0; i < list.length; i  ) {
            var split = list[i]["created_at"].toString().split("T");
            cellsList.add(Cells([
              DataCell(dataCells(context, (i   1).toString())),
              DataCell(dataCells(context, list[i]["ticket_no"].toString())),
              DataCell(dataCells(context, split[0])),
            ]));
          }
    
        return Padding(
          padding: const EdgeInsets.symmetric( vertical: 20),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                "My Active Tickets",
                style: boldText(context),
              ),
              SizedBox(
                height: 10,
              ),
              Flexible(
                child: Card(
    
                  color: Theme.of(context).primaryColor,elevation: 0,shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(15),
    
                    side: BorderSide(
                        color: Theme.of(context).primaryTextTheme.bodyText1.color)),
                  child: CardlessHeadlessPaginatedDataTable(
                    footer: list.length >=5? true:false,
                    rowsPerPage:list.length ==0?1:list.length,
                    columns: <DataColumn>[
                      DataColumn(label: currencyTabs("Serial No.")),
                      DataColumn(label: currencyTabs("Ticket No.")),
                      DataColumn(label: currencyTabs("Buy Time")),
                    ],
                    source: DataSource(context,cellsList),
                  ),
                ),
              ),
            ],
          ),
        );
      }



    class Cells{
      Cells(this.cells);
      List<DataCell> cells = [];
    }



 Widget currencyTabs(,title) {
      return Text(
        title,textAlign: TextAlign.center,
        style: TextStyle(
          color: Colors.black,
          fontWeight: FontWeight.bold,
          fontSize: 15,
        ),
      );
    }



    import 'package:flutter/material.dart';
    import 'package:rio/Model/dataTableModel.dart';
    import 'package:rio/widgets/widgets.dart';
    class DataSource extends DataTableSource {
      final list,cellsList;
      DataSource(this.context,this.cellsList) {
    
        // _rows = list;
      }
    
      final BuildContext context;
    
    
      int _selectedCount = 0;
    
      @override
      DataRow getRow(int index) {
        assert(index >= 0);
    
    
            if(cellsList.length != index)
              {
                if(index%2 ==0) {
                  return DataRow(
    
                    color: MaterialStateProperty.all(Theme
                        .of(context)
                        .primaryColor),
                    cells: [
                      for(int j = 0; j < cellsList[index].cells.length; j  )
                        cellsList[index].cells[j],
    
                    ],
                  );
                }else{
                  return DataRow(
                    color: MaterialStateProperty.all(Theme
                        .of(context)
                        .bottomAppBarColor),
                    cells: [
                      for(int j = 0; j < cellsList[index].cells.length; j  )
                        cellsList[index].cells[j],
    
                    ],
                  );
                }
              }
      }
    
      @override
      int get rowCount => cellsList.length;
    
      @override
      bool get isRowCountApproximate => false;
    
      @override
      int get selectedRowCount => _selectedCount;
    }