| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- import 'package:flutter/material.dart';
- import 'package:tdesign_flutter/tdesign_flutter.dart';
- import '../../core/i18n/app_localizations.dart';
- /// 列表底部「没有更多了」提示,仅在列表有数据且已全部加载完成时显示。
- ///
- /// ## 用法
- ///
- /// 放在 [ListView.builder] 末尾,作为最后一项:
- ///
- /// ```dart
- /// ListView.builder(
- /// itemCount: items.length + 1, // +1 给 footer 留位置
- /// itemBuilder: (_, i) {
- /// if (i == items.length) {
- /// return ListFooter(
- /// itemCount: items.length,
- /// hasMore: page < totalPages, // 分页时传真实状态
- /// );
- /// }
- /// return _buildItem(items[i]);
- /// },
- /// );
- /// ```
- ///
- /// ## 显示逻辑
- ///
- /// | itemCount | hasMore | 结果 |
- /// |-----------|---------|------|
- /// | > 0 | false | 显示「没有更多了」 |
- /// | > 0 | true | 不显示(还有下一页) |
- /// | 0 | 任意 | 不显示(空列表) |
- class ListFooter extends StatelessWidget {
- /// 当前列表中的项数。用于判断列表是否为空。
- final int itemCount;
- /// 是否还有更多数据待加载。
- ///
- /// 默认 `false`(全量数据已加载完成)。分页场景下传入 `true` 可避免过早显示。
- final bool hasMore;
- const ListFooter({super.key, required this.itemCount, this.hasMore = false});
- @override
- Widget build(BuildContext context) {
- // 仅在「有数据」且「无更多」时显示
- if (itemCount == 0 || hasMore) return const SizedBox.shrink();
- final l10n = AppLocalizations.of(context);
- return Padding(
- padding: const EdgeInsets.symmetric(vertical: 20),
- child: Row(
- mainAxisAlignment: MainAxisAlignment.center,
- children: [
- Icon(
- TDIcons.component_divider_horizontal,
- size: 14,
- color: TDTheme.of(context).textColorPlaceholder,
- ),
- const SizedBox(width: 6),
- Text(
- l10n.get('noMoreData'),
- style: TextStyle(
- fontSize: 12,
- color: TDTheme.of(context).textColorPlaceholder,
- ),
- ),
- ],
- ),
- );
- }
- }
|