源码：
1、实现 抽象类 DataTableSource 的几个方法
DataRow getRow //获取行数据
int get rowCount //获取总行数
bool get isRowCountApproximate //数据源行数是否确定
int get selectedRowCount //获取选中行数
selectOne //扩展单选功能
selectAll //扩展全选功能
import ‘package:flutter/material.dart‘; class MyTable extends DataTableSource { List<Shop> _shops = <Shop>[ Shop(‘小米6x‘, 100, ‘手机‘, 1699.0), Shop(‘华为P20‘, 50, ‘手机‘, 4999.0), Shop(‘华硕a61‘, 50, ‘电脑‘, 5700.0), Shop(‘iphone7plus耳机‘, 9999, ‘耳机‘, 60.0), Shop(‘iphone7plus256g‘, 1, ‘手机‘, 4760.0), Shop(‘金士顿8g内存条‘, 66, ‘内存条‘, 399.0), Shop(‘西门子洗衣机9.0kg‘, 890, ‘家电‘, 10399.0), Shop(‘三星66寸液晶智能电视‘, 800, ‘家电‘, 20389.0), ]; int _selectCount = 0; //当前选中的行数 int qty=0; bool _isRowCountApproximate = false;//行数确定 @override DataRow getRow(int index) { if (index>_shops.length|| index<0){FlutterError(‘数据错误！‘);} final Shop shop = _shops[index]; return DataRow.byIndex( index:index,cells: <DataCell>[ DataCell(Text(shop.name)), DataCell(Text(‘${shop.price}‘)), //数据加减功能 DataCell(Row( children: <Widget>[ IconButton(icon: Icon(Icons.arrow_left), onPressed: (){ shop.number+=1; notifyListeners(); }), Text(‘${shop.number}‘), IconButton(icon: Icon(Icons.arrow_right), onPressed: (){ shop.number+=1; notifyListeners(); }), ], )), DataCell(Text(shop.type)), ], selected: shop.selected, onSelectChanged: (isselected){ selectOne(index,isselected); } ); } //选中单个 void selectOne(int index,bool isSelected){ Shop shop=_shops[index]; if (shop.selected != isSelected) { //如果选中就选中数量加一，否则减一 _selectCount = _selectCount += isSelected ? 1 : -1; shop.selected = isSelected; //更新 notifyListeners(); } } //选中全部 void selectAll(bool checked) { for (Shop _shop in _shops) { _shop.selected = checked; } _selectCount = checked ? _shops.length : 0; notifyListeners(); //通知监听器去刷新 } //排序, void sort<T>(Comparable<T> getField(Shop shop),bool b){ _shops.sort((Shop s1,Shop s2){ if(!b){//两个项进行交换 final Shop temp=s1; s1=s2; s2=temp; } final Comparable<T> s1Value=getField(s1); final Comparable<T> s2Value=getField(s2); return Comparable.compare(s1Value, s2Value); }); notifyListeners(); } @override int get rowCount=>_shops.length ; @override bool get isRowCountApproximate=>_isRowCountApproximate; @override int get selectedRowCount=>_selectCount; } class Shop{ final String name; int number; final String type; final double price; bool selected=false;//默认为未选中 Shop(this.name, this.number, this.type, this.price,); }
2、展示效果
import ‘package:flutter/cupertino.dart‘; import ‘package:flutter/material.dart‘; import ‘package:flutter_bn_card/page/Widget/MyTable.dart‘; class QueryPage extends StatefulWidget { @override QueryPageState createState() => new QueryPageState(); } class QueryPageState extends State<QueryPage> { static TextStyle Titlesty = TextStyle(color: Colors.red,fontSize: 18); static TextStyle bodyesty = TextStyle(); List<DataColumn> lcol= [ new DataColumn(label: Text(‘商品名‘,style: Titlesty,)), new DataColumn(label: Text(‘条码‘,style: Titlesty,)), new DataColumn(label: Text(‘价格‘,style: Titlesty,)), new DataColumn(label: Text(‘数量‘,style: Titlesty,)), ]; List<DataRow> lrow= [ new DataRow(cells:[new DataCell(Text(‘香蕉‘)), DataCell(Text(‘10123‘)),DataCell(Text(‘12.8‘)),DataCell(Text(‘2‘)) ] ), new DataRow(cells:[new DataCell(Text(‘苹果‘)), DataCell(Text(‘00123‘)),DataCell(Text(‘12.8‘)),DataCell(Text(‘2‘)) ] ), DataRow(cells:[new DataCell(Text(‘笔记本电脑‘,overflow: TextOverflow.ellipsis,)), DataCell(Container( child: Text(‘291267209960000005‘,overflow: TextOverflow.clip,softWrap: true,),),), DataCell(Text(‘1234567.8‘)),DataCell(Text(‘1‘),onTap: (){ }) ] ), ]; //--------------------PaginatedDataTable------------------------------ //默认的行数 int _defalutRowPageCount = PaginatedDataTable.defaultRowsPerPage; int _sortColumnIndex; bool _sortAscending=true; MyTable table = MyTable(); //排序关联_sortColumnIndex,_sortAscending void _sort<T>(Comparable<T> getField(Shop s),int index,bool b){ table.sort(getField, b); setState(() { this._sortColumnIndex=index; this._sortAscending=b; }); } List<DataColumn> getColumn() { return [ DataColumn(label: Text(‘商品名‘),onSort: (i,b){_sort<String>((Shop p) =>p.name, i, b);}), DataColumn(label: Text(‘价格‘),onSort: (i,b){_sort<num>((Shop p) =>p.price, i, b);}), DataColumn(label: Text(‘库存‘),onSort: (i,b){_sort<num>((Shop p) =>p.number, i, b);}), DataColumn(label: Text(‘类型‘),onSort: (i,b){_sort<String>((Shop p) =>p.type, i, b);}), ]; } Widget getPaginatedDataTable(){ return SingleChildScrollView( child: PaginatedDataTable( rowsPerPage: _defalutRowPageCount, onRowsPerPageChanged: (value) { setState(() { _defalutRowPageCount = value; }); }, sortColumnIndex: _sortColumnIndex, initialFirstRowIndex: 0, sortAscending: _sortAscending, availableRowsPerPage: [ 5,10 ], onPageChanged: (value){ print(‘$value‘); }, onSelectAll: table.selectAll, header: Text(‘商品库存‘), columns: getColumn(), source: table, ), ); } @override Widget build(BuildContext context) { return new Scaffold( body: Column( children: <Widget>[ DataTable(columns: lcol, rows: lrow, sortColumnIndex: 1, ), Expanded( child: getPaginatedDataTable(), ) ], ) ); } @override void initState() { // TODO: implement initState super.initState(); } @override void dispose() { // TODO: implement dispose super.dispose(); } @override void didUpdateWidget(QueryPage oldWidget) { // TODO: implement didUpdateWidget super.didUpdateWidget(oldWidget); } @override void didChangeDependencies() { // TODO: implement didChangeDependencies super.didChangeDependencies(); } }
3、界面图：
Flutter 表格组件（DataTable和PaginatedDataTable）Demo
原文：https://www.cnblogs.com/stroll/p/12395978.html
