add:td_table增加自定义表尾属性 (Tencent#776)

Author: leenc123

tdesign-component/example/lib/page/td_table_page.dart

@@ -81,6 +81,7 @@ class TDTablePage extends StatelessWidget {
         ExampleItem(desc: '空数据表格', builder: _emptyTable),
         ExampleItem(desc: '加载动画表格', builder: _loadingTable),
         ExampleItem(desc: '可选表格+默认选中', builder: _selectTable),
+        ExampleItem(desc: '自定义表尾组件', builder: (context) => ShowFooterTable()),
       ],
     );
   }
@@ -381,3 +382,73 @@ class TDTablePage extends StatelessWidget {
     );
   }
 }
+class ShowFooterTable extends StatefulWidget {
+  const ShowFooterTable({super.key});
+
+  @override
+  State<ShowFooterTable> createState() => _ShowFooterTableState();
+}
+
+class _ShowFooterTableState extends State<ShowFooterTable> {
+  var _hasMore = true;
+  var _data = [];
+  var _pageIndex = 1;
+
+  @override
+  void initState() {
+    super.initState();
+    _fetchData();
+  }
+
+  Future<void> _fetchData() async {
+    setState(() {
+      _hasMore = _pageIndex <= 2;
+    });
+    if (!_hasMore) {
+      return;
+    }
+    setState(() {
+      _data.addAll(_getData(10));
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return _showFooterTable(context);
+  }
+
+  @Demo(group: 'table')
+  Widget _showFooterTable(BuildContext context) {
+    return TDTable(
+      height: 100,
+      footerWidget: _hasMore ? TDText('加载更多...') : TDText('没有更多数据了'),
+      onScroll: (controller) {
+        if (controller.position.pixels == controller.position.maxScrollExtent &&
+            _hasMore) {
+          _pageIndex += 1;
+          _fetchData();
+        }
+      },
+      data: _data,
+      columns: [
+        TDTableCol(title: '标题', colKey: 'title1'),
+        TDTableCol(title: '标题', colKey: 'title2'),
+        TDTableCol(title: '标题', colKey: 'title3'),
+        TDTableCol(title: '标题', colKey: 'title4')
+      ],
+    );
+  }
+
+  List<dynamic> _getData(int index) {
+    var data = <dynamic>[];
+    for (var i = 0; i < 10; i++) {
+      data.add({
+        'title1': '内容',
+        'title2': '内容',
+        'title3': '内容',
+        'title4': '内容',
+      });
+    }
+    return data;
+  }
+}

tdesign-component/lib/src/components/table/td_table.dart

@@ -21,6 +21,7 @@ class TDTable extends StatefulWidget {
     this.loading = false,
     this.loadingWidget,
     this.showHeader = true,
+    this.footerWidget,
     this.stripe = false,
     this.backgroundColor,
     this.width,
@@ -58,6 +59,9 @@ class TDTable extends StatefulWidget {
   /// 是否显示表头
   final bool? showHeader;
 
+  /// 自定义表尾
+  final Widget? footerWidget;
+
   /// 斑马纹
   final bool? stripe;
 
@@ -204,6 +208,9 @@ class TDTableState extends State<TDTable> {
         child: Row(children: row),
       ));
     }
+    if (widget.footerWidget != null){
+      cells.add(widget.footerWidget!);
+    }
     return Column(
       children: cells,
     );