feat(flutter): 增加榜单新剧分页与预约刷新

lib/pages/new_releases/new_releases_page.dart

@@ -10,9 +10,12 @@ import '../../core/data/models/drama.dart';
 import '../../core/data/services/catalog_controller.dart';
 import '../../core/formatting/count_format.dart';
 import '../../core/theme/app_colors.dart';
+import '../../core/widgets/app_pull_to_refresh.dart';
+import '../../core/widgets/paged_local_list.dart';
 import '../../core/widgets/remote_image.dart';
 import '../../core/widgets/subpage_header.dart';
 import '../../l10n/app_localizations.dart';
+import '../discover/widgets/drama_grid.dart';
 import '../player/open_player.dart';
 
 const int _moreLimit = 12;
@@ -21,18 +24,83 @@ const double _cardPadding = 8;
 const double _cardWidth = 124;
 const double _rowHeight = 204;
 const double _cardRadius = 12;
+const double _loadMoreThreshold = 200;
 
 /// 新剧页：暖色首映厅，今日首映大卡 + 横向更多新剧。
-class NewReleasesPage extends StatelessWidget {
+class NewReleasesPage extends StatefulWidget {
   const NewReleasesPage({super.key});
 
+  @override
+  State<NewReleasesPage> createState() => _NewReleasesPageState();
+}
+
+class _NewReleasesPageState extends State<NewReleasesPage> {
+  final ScrollController _scroll = ScrollController();
+  PagedLocalListController<Drama>? _pager;
+  bool _refreshing = false;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    if (_pager != null) return;
+    _pager = PagedLocalListController<Drama>(
+      items: _newest(context.read<CatalogController>().dramas),
+    )..addListener(_rebuild);
+  }
+
+  @override
+  void dispose() {
+    _pager
+      ?..removeListener(_rebuild)
+      ..dispose();
+    _scroll.dispose();
+    super.dispose();
+  }
+
+  void _rebuild() {
+    if (mounted) setState(() {});
+  }
+
+  List<Drama> _newest(List<Drama> source) {
+    return [...source]..sort((a, b) => b.id.compareTo(a.id));
+  }
+
+  Future<void> _refresh() async {
+    if (_refreshing) return;
+    _refreshing = true;
+    try {
+      final catalog = context.read<CatalogController>();
+      await catalog.refresh();
+      if (!mounted) return;
+      _pager!.replaceAll(_newest(catalog.dramas));
+      if (_scroll.hasClients) {
+        _scroll.jumpTo(_scroll.position.minScrollExtent);
+      }
+    } finally {
+      _refreshing = false;
+    }
+  }
+
+  bool _onScroll(ScrollNotification notification) {
+    if (notification.depth != 0 || _refreshing) return false;
+    final reachedBottom =
+        notification.metrics.extentAfter <= _loadMoreThreshold;
+    if (reachedBottom &&
+        (notification is ScrollUpdateNotification ||
+            notification is ScrollEndNotification ||
+            notification is OverscrollNotification)) {
+      unawaited(_pager!.loadMore());
+    }
+    return false;
+  }
+
   @override
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
-    final dramas = [...context.read<CatalogController>().dramas]
-      ..sort((a, b) => b.id.compareTo(a.id));
-    final hero = dramas.isEmpty ? null : dramas.first;
-    final more = dramas.skip(1).take(_moreLimit).toList();
+    final pager = _pager!;
+    final visible = pager.visibleItems;
+    final hero = visible.isEmpty ? null : visible.first;
+    final more = pager.items.skip(1).take(_moreLimit).toList();
     return AnnotatedRegion<SystemUiOverlayStyle>(
       value: SystemUiOverlayStyle.dark,
       child: Scaffold(
@@ -54,54 +122,93 @@ class NewReleasesPage extends StatelessWidget {
                   title: l10n.newReleasesTitle,
                   subtitle: l10n.newReleasesSubtitle,
                   backKey: const Key('new-releases-back'),
-                  actions: _countChip(l10n, dramas.length),
+                  actions: _countChip(l10n, pager.items.length),
                 ),
                 Expanded(
-                  child: hero == null
-                      ? Center(
-                          child: Text(
-                            l10n.noStories,
-                            key: const Key('new-releases-empty'),
-                            style: const TextStyle(color: AppColors.muted),
-                          ),
-                        )
-                      : ListView(
-                          padding: const EdgeInsets.only(bottom: 24),
-                          children: [
-                            Padding(
-                              padding: const EdgeInsets.symmetric(
-                                horizontal: 16,
-                              ),
-                              child: _heroCard(context, l10n, hero),
-                            ),
-                            const SizedBox(height: 14),
-                            const _FilmStrip(),
-                            const SizedBox(height: 14),
-                            if (more.isNotEmpty) ...[
-                              _moreHeader(l10n),
-                              const SizedBox(height: 10),
-                              SizedBox(
-                                height: _rowHeight,
-                                child: ListView.separated(
-                                  key: const Key('new-releases-row'),
-                                  scrollDirection: Axis.horizontal,
+                  child: NotificationListener<ScrollNotification>(
+                    onNotification: _onScroll,
+                    child: AppPullToRefresh(
+                      key: const Key('new-releases-refresh'),
+                      onRefresh: _refresh,
+                      child: ListView(
+                        key: const Key('new-releases-list'),
+                        controller: _scroll,
+                        physics: const AlwaysScrollableScrollPhysics(),
+                        padding: const EdgeInsets.only(bottom: 24),
+                        children: hero == null
+                            ? [
+                                SizedBox(
+                                  height: 420,
+                                  child: Center(
+                                    child: Text(
+                                      l10n.noStories,
+                                      key: const Key('new-releases-empty'),
+                                      style: const TextStyle(
+                                        color: AppColors.muted,
+                                      ),
+                                    ),
+                                  ),
+                                ),
+                              ]
+                            : [
+                                Padding(
                                   padding: const EdgeInsets.symmetric(
                                     horizontal: 16,
                                   ),
-                                  itemCount: more.length,
-                                  separatorBuilder: (_, _) =>
-                                      const SizedBox(width: 10),
-                                  itemBuilder: (context, index) => _moreCard(
-                                    context,
-                                    l10n,
-                                    more[index],
-                                    index,
+                                  child: _heroCard(context, l10n, hero),
+                                ),
+                                const SizedBox(height: 14),
+                                const _FilmStrip(),
+                                const SizedBox(height: 14),
+                                if (more.isNotEmpty) ...[
+                                  _moreHeader(l10n),
+                                  const SizedBox(height: 10),
+                                  SizedBox(
+                                    height: _rowHeight,
+                                    child: ListView.separated(
+                                      key: const Key('new-releases-row'),
+                                      scrollDirection: Axis.horizontal,
+                                      padding: const EdgeInsets.symmetric(
+                                        horizontal: 16,
+                                      ),
+                                      itemCount: more.length,
+                                      separatorBuilder: (_, _) =>
+                                          const SizedBox(width: 10),
+                                      itemBuilder: (context, index) =>
+                                          _moreCard(
+                                            context,
+                                            l10n,
+                                            more[index],
+                                            index,
+                                          ),
+                                    ),
+                                  ),
+                                ],
+                                const SizedBox(height: 20),
+                                _allHeader(l10n),
+                                const SizedBox(height: 10),
+                                DramaGrid(
+                                  key: const Key('new-releases-all-grid'),
+                                  l10n: l10n,
+                                  dramas: visible,
+                                  onOpen: (drama) => unawaited(
+                                    playDramaFromCatalog(context, drama),
                                   ),
                                 ),
-                              ),
-                            ],
-                          ],
-                        ),
+                                PagedLoadFooter(
+                                  loading: pager.loading,
+                                  hasMore: pager.hasMore,
+                                  hasItems: pager.items.isNotEmpty,
+                                  loadMoreKey: const Key(
+                                    'new-releases-load-more',
+                                  ),
+                                  noMoreKey: const Key('new-releases-no-more'),
+                                  noMoreLabel: l10n.noMore,
+                                ),
+                              ],
+                      ),
+                    ),
+                  ),
                 ),
               ],
             ),
@@ -267,6 +374,21 @@ class NewReleasesPage extends StatelessWidget {
     );
   }
 
+  Widget _allHeader(AppLocalizations l10n) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 16),
+      child: Text(
+        l10n.newReleasesAll,
+        key: const Key('new-releases-all-header'),
+        style: const TextStyle(
+          color: AppColors.onSurface,
+          fontSize: 16,
+          fontWeight: FontWeight.w800,
+        ),
+      ),
+    );
+  }
+
   Widget _moreCard(
     BuildContext context,
     AppLocalizations l10n,

lib/pages/ranking/ranking_page.dart

@@ -10,7 +10,9 @@ import '../../core/data/services/catalog_controller.dart';
 import '../../core/formatting/count_format.dart';
 import '../../core/theme/app_colors.dart';
 import '../../core/theme/app_theme.dart';
+import '../../core/widgets/app_pull_to_refresh.dart';
 import '../../core/widgets/empty_state.dart';
+import '../../core/widgets/paged_local_list.dart';
 import '../../core/widgets/plain_page_scaffold.dart';
 import '../../core/widgets/remote_image.dart';
 import '../../l10n/app_localizations.dart';
@@ -24,21 +26,87 @@ const double _rowGap = 12;
 const double _rankColumnWidth = 56;
 const double _listCoverWidth = 72;
 const double _listCoverHeight = 96;
+const double _loadMoreThreshold = 200;
 const Color _goldStart = Color(0xFFF3B34C);
 const Color _goldEnd = Color(0xFFD9A23A);
 const Color _bronzeStart = Color(0xFFCD7F32);
 const Color _bronzeEnd = Color(0xFFA9713A);
 
 /// 剧场榜单页：前三名横排领奖台，第 4 名起纵向列表。
-class RankingPage extends StatelessWidget {
+class RankingPage extends StatefulWidget {
   const RankingPage({super.key});
 
+  @override
+  State<RankingPage> createState() => _RankingPageState();
+}
+
+class _RankingPageState extends State<RankingPage> {
+  final ScrollController _scroll = ScrollController();
+  PagedLocalListController<Drama>? _pager;
+  bool _refreshing = false;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    if (_pager != null) return;
+    _pager = PagedLocalListController<Drama>(
+      items: _ranked(context.read<CatalogController>().dramas),
+    )..addListener(_rebuild);
+  }
+
+  @override
+  void dispose() {
+    _pager
+      ?..removeListener(_rebuild)
+      ..dispose();
+    _scroll.dispose();
+    super.dispose();
+  }
+
+  void _rebuild() {
+    if (mounted) setState(() {});
+  }
+
+  List<Drama> _ranked(List<Drama> source) {
+    final dramas = [...source]
+      ..sort((a, b) => b.viewCount.compareTo(a.viewCount));
+    return dramas.take(_topCount).toList(growable: false);
+  }
+
+  Future<void> _refresh() async {
+    if (_refreshing) return;
+    _refreshing = true;
+    try {
+      final catalog = context.read<CatalogController>();
+      await catalog.refresh();
+      if (!mounted) return;
+      _pager!.replaceAll(_ranked(catalog.dramas));
+      if (_scroll.hasClients) {
+        _scroll.jumpTo(_scroll.position.minScrollExtent);
+      }
+    } finally {
+      _refreshing = false;
+    }
+  }
+
+  bool _onScroll(ScrollNotification notification) {
+    if (notification.depth != 0 || _refreshing) return false;
+    final reachedBottom =
+        notification.metrics.extentAfter <= _loadMoreThreshold;
+    if (reachedBottom &&
+        (notification is ScrollUpdateNotification ||
+            notification is ScrollEndNotification ||
+            notification is OverscrollNotification)) {
+      unawaited(_pager!.loadMore());
+    }
+    return false;
+  }
+
   @override
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
-    final dramas = [...context.read<CatalogController>().dramas]
-      ..sort((a, b) => b.viewCount.compareTo(a.viewCount));
-    final top = dramas.take(_topCount).toList();
+    final pager = _pager!;
+    final top = pager.visibleItems;
     final podium = top.take(3).toList();
     final rest = top.skip(3).toList();
     return PlainPageScaffold(
@@ -46,32 +114,58 @@ class RankingPage extends StatelessWidget {
       backKey: const Key('ranking-back'),
       title: l10n.topCharts,
       subtitle: l10n.rankingSubtitle,
-      child: top.isEmpty
-          ? EmptyState(icon: Icons.leaderboard_outlined, title: l10n.noStories)
-          : ListView(
-              padding: const EdgeInsets.only(top: 4, bottom: 24),
-              children: [
-                if (podium.isNotEmpty)
-                  Padding(
-                    padding: const EdgeInsets.symmetric(horizontal: 14),
-                    child: _Podium(podium: podium, l10n: l10n),
-                  ),
-                if (rest.isNotEmpty) ...[
-                  const SizedBox(height: 16),
-                  for (var index = 0; index < rest.length; index++) ...[
-                    if (index > 0) const SizedBox(height: _rowGap),
-                    Padding(
-                      padding: const EdgeInsets.symmetric(horizontal: 14),
-                      child: _RankingRow(
-                        index: index + 3,
-                        drama: rest[index],
-                        l10n: l10n,
+      child: NotificationListener<ScrollNotification>(
+        onNotification: _onScroll,
+        child: AppPullToRefresh(
+          key: const Key('ranking-refresh'),
+          onRefresh: _refresh,
+          child: ListView(
+            key: const Key('ranking-list'),
+            controller: _scroll,
+            physics: const AlwaysScrollableScrollPhysics(),
+            padding: const EdgeInsets.only(top: 4, bottom: 24),
+            children: top.isEmpty
+                ? [
+                    SizedBox(
+                      height: 420,
+                      child: EmptyState(
+                        icon: Icons.leaderboard_outlined,
+                        title: l10n.noStories,
                       ),
                     ),
+                  ]
+                : [
+                    if (podium.isNotEmpty)
+                      Padding(
+                        padding: const EdgeInsets.symmetric(horizontal: 14),
+                        child: _Podium(podium: podium, l10n: l10n),
+                      ),
+                    if (rest.isNotEmpty) ...[
+                      const SizedBox(height: 16),
+                      for (var index = 0; index < rest.length; index++) ...[
+                        if (index > 0) const SizedBox(height: _rowGap),
+                        Padding(
+                          padding: const EdgeInsets.symmetric(horizontal: 14),
+                          child: _RankingRow(
+                            index: index + 3,
+                            drama: rest[index],
+                            l10n: l10n,
+                          ),
+                        ),
+                      ],
+                    ],
+                    PagedLoadFooter(
+                      loading: pager.loading,
+                      hasMore: pager.hasMore,
+                      hasItems: pager.items.isNotEmpty,
+                      loadMoreKey: const Key('ranking-load-more'),
+                      noMoreKey: const Key('ranking-no-more'),
+                      noMoreLabel: l10n.noMore,
+                    ),
                   ],
-                ],
-              ],
-            ),
+          ),
+        ),
+      ),
     );
   }
 }

lib/pages/reserve/reserve_page.dart

@@ -1,8 +1,11 @@
 // Author: fruit.com.cn
 
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 
+import '../../core/data/services/catalog_controller.dart';
 import '../../core/theme/app_colors.dart';
+import '../../core/widgets/app_pull_to_refresh.dart';
 import '../../core/widgets/subpage_header.dart';
 import '../../l10n/app_localizations.dart';
 import '../new_releases/new_releases_page.dart';
@@ -41,32 +44,42 @@ class _ReservePageState extends State<ReservePage> {
       key: const Key('reserve-page'),
       backgroundColor: AppColors.ink,
       body: SafeArea(
-        child: ListView(
-          padding: const EdgeInsets.fromLTRB(0, 4, 0, 24),
-          children: [
-            AppSubpageHeader(
-              title: l10n.reserveTitle,
-              subtitle: l10n.reserveSubtitle,
-              backKey: const Key('reserve-back'),
-            ),
-            Padding(
-              padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
-              child: _weekStrip(l10n),
-            ),
-            Padding(
-              padding: const EdgeInsets.fromLTRB(16, 16, 16, 0),
-              child: _ticketCard(context, l10n),
-            ),
-            Padding(
-              padding: const EdgeInsets.fromLTRB(16, 24, 16, 0),
-              child: _steps(l10n),
-            ),
-          ],
+        child: AppPullToRefresh(
+          key: const Key('reserve-refresh'),
+          onRefresh: _refresh,
+          child: ListView(
+            key: const Key('reserve-list'),
+            physics: const AlwaysScrollableScrollPhysics(),
+            padding: const EdgeInsets.fromLTRB(0, 4, 0, 24),
+            children: [
+              AppSubpageHeader(
+                title: l10n.reserveTitle,
+                subtitle: l10n.reserveSubtitle,
+                backKey: const Key('reserve-back'),
+              ),
+              Padding(
+                padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
+                child: _weekStrip(l10n),
+              ),
+              Padding(
+                padding: const EdgeInsets.fromLTRB(16, 16, 16, 0),
+                child: _ticketCard(context, l10n),
+              ),
+              Padding(
+                padding: const EdgeInsets.fromLTRB(16, 24, 16, 0),
+                child: _steps(l10n),
+              ),
+            ],
+          ),
         ),
       ),
     );
   }
 
+  Future<void> _refresh() async {
+    await context.read<CatalogController>().refresh();
+  }
+
   Widget _weekStrip(AppLocalizations l10n) {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,