服务端接口优化

todo：待添加影评海报，书评书摘的接口与标签接口

lib/pages/book/book_detail_page.dart

@@ -1,6 +1,7 @@
 import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
+import '../../widgets/fade_in_local_image.dart';
 import 'package:share_plus/share_plus.dart';
 import 'package:cross_file/cross_file.dart';
 import '../../providers/app_provider.dart';
@@ -188,10 +189,9 @@ class _BookDetailPageState extends State<BookDetailPage> {
   Widget _buildCoverSection(Book book) {
     return SizedBox.expand(
       child: book.coverPath != null && book.coverPath!.isNotEmpty
-          ? Image.file(
+          ? FadeInLocalImage(
-              File(book.coverPath!),
+              path: book.coverPath,
               fit: BoxFit.cover,
-              errorBuilder: (_, __, ___) => _buildCoverPlaceholder(),
             )
           : _buildCoverPlaceholder(),
     );

lib/pages/book/book_form_page.dart

@@ -6,6 +6,7 @@ import 'package:path/path.dart' as p;
 import 'package:provider/provider.dart';
 import 'package:http/http.dart' as http;
 import '../../providers/app_provider.dart';
+import '../../widgets/fade_in_local_image.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
 import '../../utils/image_path_helper.dart';
@@ -921,10 +922,9 @@ class _BookFormPageState extends State<BookFormPage> {
             ),
             clipBehavior: Clip.antiAlias,
             child: hasCover
-                ? Image.file(
+                ? FadeInLocalImage(
-                    File(_coverPath!),
+                    path: _coverPath,
                     fit: BoxFit.cover,
-                    errorBuilder: (_, __, ___) => _buildCoverPlaceholder(),
                   )
                 : _buildCoverPlaceholder(),
           ),

lib/pages/book/book_share_page.dart

@@ -6,6 +6,7 @@ import 'package:path_provider/path_provider.dart';
 import 'package:share_plus/share_plus.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
+import '../../widgets/fade_in_local_image.dart';
 
 /// 书籍分享海报页面
 class BookSharePage extends StatefulWidget {
@@ -102,8 +103,8 @@ class _BookSharePageState extends State<BookSharePage> {
           if (hasCover)
             ClipRRect(
               borderRadius: const BorderRadius.vertical(top: Radius.circular(16)),
-              child: Image.file(
+              child: FadeInLocalImage(
-                File(book.coverPath!),
+                path: book.coverPath,
                 width: 320,
                 height: 200,
                 fit: BoxFit.cover,

lib/pages/book/book_tab_page.dart

@@ -1,14 +1,15 @@
-import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
+import '../../models/data_models.dart';
 import '../../providers/app_provider.dart';
 import '../../utils/user_prefs.dart';
 import '../../widgets/book_status_bar.dart';
 import '../../widgets/book_list_item.dart';
 import '../../widgets/animated_star_rating.dart';
 import '../../widgets/shimmer_skeleton.dart';
+import '../../widgets/fade_in_local_image.dart';
 
-/// 阅读标签页
+/// 阅读标签页（分页 + 触底加载）
 class BookTabPage extends StatefulWidget {
   const BookTabPage({super.key});
 
@@ -18,217 +19,215 @@ class BookTabPage extends StatefulWidget {
 
 class _BookTabPageState extends State<BookTabPage> {
   int _layoutStyle = 0;
-  bool _firstLoad = true;
+  final List<Book> _items = [];
+  bool _hasMore = true;
+  bool _isLoading = false;
+  int _offset = 0;
+  int _lastStatusIndex = -1;
+  bool _initialized = false;
+  int _lastDataCount = -1;
+  DateTime? _lastUpdatedAt;
+  late ScrollController _scrollController;
+
+  static const _statusMap = {0: 'read', 1: 'reading', 2: 'want_to_read'};
 
   @override
   void initState() {
     super.initState();
     _layoutStyle = UserPrefs().bookLayoutStyle;
+    _scrollController = ScrollController()..addListener(_onScroll);
     WidgetsBinding.instance.addPostFrameCallback((_) {
-      if (mounted) setState(() => _firstLoad = false);
+      final provider = context.read<AppProvider>();
+      provider.addListener(_onDataChanged);
+      _lastDataCount = provider.books.length;
+      if (provider.books.isNotEmpty) _lastUpdatedAt = provider.books.first.updatedAt;
+      _loadFirst();
     });
   }
 
   @override
-  Widget build(BuildContext context) {
+  void dispose() {
-    return Column(
+    _scrollController.dispose();
-      children: [
+    super.dispose();
-        const BookStatusBar(),
-        Expanded(
-          child: _buildBookList(context),
-        ),
-      ],
-    );
   }
 
-  Widget _buildBookList(BuildContext context) {
+  void _onDataChanged() {
+    if (!_initialized || !mounted) return;
+    final provider = context.read<AppProvider>();
+    final count = provider.books.length;
+    final latest = provider.books.isNotEmpty ? provider.books.first.updatedAt : null;
+    if (count != _lastDataCount || latest != _lastUpdatedAt) {
+      _lastDataCount = count;
+      _lastUpdatedAt = latest;
+      WidgetsBinding.instance.addPostFrameCallback((_) {
+        if (mounted) _loadFirst();
+      });
+    }
+  }
+
+  void _onScroll() {
+    if (_scrollController.position.pixels >= _scrollController.position.maxScrollExtent - 200) {
+      _loadMore();
+    }
+  }
+
+  Future<void> _loadFirst() async {
+    final provider = context.read<AppProvider>();
+    final statusIdx = provider.bookStatusIndex;
+    _lastStatusIndex = statusIdx;
+    _initialized = true;
+    final status = _statusMap[statusIdx] ?? 'read';
+    setState(() { _isLoading = true; _items.clear(); _offset = 0; _hasMore = true; });
+    final list = await provider.loadBooksPaged(status: status, offset: 0);
+    if (!mounted) return;
+    setState(() { _items.addAll(list); _offset = list.length; _hasMore = list.length >= 20; _isLoading = false; });
+  }
+
+  Future<void> _loadMore() async {
+    if (_isLoading || !_hasMore) return;
+    setState(() => _isLoading = true);
+    final provider = context.read<AppProvider>();
+    final status = _statusMap[provider.bookStatusIndex] ?? 'read';
+    final list = await provider.loadBooksPaged(status: status, offset: _offset);
+    if (!mounted) return;
+    setState(() { _items.addAll(list); _offset += list.length; _hasMore = list.length >= 20; _isLoading = false; });
+  }
+
+  Future<void> _refresh() async {
+    await context.read<AppProvider>().loadBooks();
+    await _loadFirst();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(children: [
+      const BookStatusBar(),
+      Expanded(child: _buildBody(context)),
+    ]);
+  }
+
+  Widget _buildBody(BuildContext context) {
     final colors = Theme.of(context).colorScheme;
-    return Consumer<AppProvider>(
+    return Consumer<AppProvider>(builder: (context, provider, _) {
-      builder: (context, provider, child) {
+      if (_initialized && provider.bookStatusIndex != _lastStatusIndex) {
-        final statusMap = {0: 'read', 1: 'reading', 2: 'want_to_read'};
+        _lastStatusIndex = provider.bookStatusIndex;
-        final currentStatus = statusMap[provider.bookStatusIndex]!;
+        WidgetsBinding.instance.addPostFrameCallback((_) => _loadFirst());
-        final books = provider.getBooksByStatus(currentStatus);
+      }
+      if (_items.isEmpty && _isLoading) return _buildSkeleton();
+      if (_items.isEmpty) {
+        return RefreshIndicator(onRefresh: _refresh, color: colors.primary, backgroundColor: colors.surface,
+            child: ListView(physics: const AlwaysScrollableScrollPhysics(), children: [_buildEmptyState(context, provider.bookStatusIndex)]));
+      }
+      return RefreshIndicator(onRefresh: _refresh, color: colors.primary, backgroundColor: colors.surface,
+          child: _layoutStyle == 1 ? _buildListView() : _buildGridView());
+    });
+  }
 
-        if (_firstLoad) {
+  Widget _buildGridView() {
-          return _buildSkeleton();
+    return GridView.builder(controller: _scrollController,
-        }
+      padding: const EdgeInsets.fromLTRB(16, 16, 16, 100),
-
+      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3, childAspectRatio: 0.55, crossAxisSpacing: 12, mainAxisSpacing: 16),
-        if (books.isEmpty) {
+      itemCount: _items.length + (_hasMore ? 1 : 0),
-          return RefreshIndicator(
+      itemBuilder: (context, index) {
-            onRefresh: () async => await provider.loadBooks(),
+        if (index >= _items.length) return _buildLoadMore();
-            color: colors.primary,
+        return BookListItem(book: _items[index]);
-            backgroundColor: colors.surface,
-            child: ListView(
-              physics: const AlwaysScrollableScrollPhysics(),
-              children: [_buildEmptyState(context, provider.bookStatusIndex)],
-            ),
-          );
-        }
-
-        if (_layoutStyle == 1) {
-          return _buildListView(books, provider);
-        }
-        return _buildGridView(books, provider);
       },
     );
   }
 
-  Widget _buildGridView(List books, AppProvider provider) {
+  Widget _buildListView() {
-    final colors = Theme.of(context).colorScheme;
+    return ListView.builder(controller: _scrollController,
-    return RefreshIndicator(
+      padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-      onRefresh: () async => await provider.loadBooks(),
+      itemCount: _items.length + (_hasMore ? 1 : 0),
-      color: colors.primary,
+      itemBuilder: (context, index) {
-      backgroundColor: colors.surface,
+        if (index >= _items.length) return _buildLoadMore();
-      child: GridView.builder(
+        return _buildListCard(_items[index]);
-        padding: const EdgeInsets.fromLTRB(16, 16, 16, 100),
+      },
-        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
-          crossAxisCount: 3,
-          childAspectRatio: 0.55,
-          crossAxisSpacing: 12,
-          mainAxisSpacing: 16,
-        ),
-        itemCount: books.length,
-        itemBuilder: (context, index) => BookListItem(book: books[index]),
-      ),
     );
   }
 
-  Widget _buildListView(List books, AppProvider provider) {
+  Widget _buildLoadMore() {
-    final colors = Theme.of(context).colorScheme;
+    return Padding(padding: const EdgeInsets.symmetric(vertical: 20),
-    return RefreshIndicator(
+      child: Center(child: _isLoading
-      onRefresh: () async => await provider.loadBooks(),
+          ? SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: Theme.of(context).colorScheme.primary))
-      color: colors.primary,
+          : Text('没有更多了', style: TextStyle(fontSize: 12, color: Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.3)))),
-      backgroundColor: colors.surface,
-      child: ListView.builder(
-        padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-        itemCount: books.length,
-        itemBuilder: (context, index) => _buildListCard(books[index]),
-      ),
     );
   }
 
-  Widget _buildListCard(book) {
+  Widget _buildListCard(Book book) {
     final colors = Theme.of(context).colorScheme;
     return GestureDetector(
       onTap: () => Navigator.pushNamed(context, '/book-detail', arguments: book),
       onLongPress: () => _showDeleteDialog(context, book),
-      child: Container(
+      child: Container(margin: const EdgeInsets.only(bottom: 8), padding: const EdgeInsets.all(12),
-        margin: const EdgeInsets.only(bottom: 8),
+        decoration: BoxDecoration(color: colors.surfaceContainerHigh, borderRadius: BorderRadius.circular(12)),
-        padding: const EdgeInsets.all(12),
+        child: Row(children: [
-        decoration: BoxDecoration(
+          Container(width: 48, height: 64,
-          color: colors.surfaceContainerHigh,
+            decoration: BoxDecoration(color: colors.outlineVariant, borderRadius: BorderRadius.circular(6)),
-          borderRadius: BorderRadius.circular(12),
+            clipBehavior: Clip.antiAlias,
-        ),
+            child: book.coverPath != null && book.coverPath!.isNotEmpty
-        child: Row(
+                ? FadeInLocalImage(path: book.coverPath, fit: BoxFit.cover,
-          children: [
+                    errorWidget: Icon(Icons.menu_book_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)))
-            Container(
+                : Icon(Icons.menu_book_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)),
-              width: 48, height: 64,
+          ),
-              decoration: BoxDecoration(
+          const SizedBox(width: 12),
-                color: colors.outlineVariant,
+          Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
-                borderRadius: BorderRadius.circular(6),
+            Text(book.title, maxLines: 1, overflow: TextOverflow.ellipsis,
-              ),
+                style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.onSurface)),
-              clipBehavior: Clip.antiAlias,
+            if (book.authors.isNotEmpty) ...[const SizedBox(height: 3),
-              child: book.coverPath != null && book.coverPath!.isNotEmpty
+              Text(book.authors.take(2).join('、'), maxLines: 1, overflow: TextOverflow.ellipsis,
-                  ? Image.file(File(book.coverPath!), fit: BoxFit.cover,
+                  style: TextStyle(fontSize: 12, color: colors.onSurface.withValues(alpha: 0.35))),
-                      errorBuilder: (_, __, ___) => Icon(Icons.menu_book_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)))
+            ],
-                  : Icon(Icons.menu_book_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)),
+            const SizedBox(height: 6),
-            ),
+            if (book.rating != null) AnimatedStarRating(rating: book.rating!, starSize: 12, showNumber: true)
-            const SizedBox(width: 12),
+            else const SizedBox(height: 14),
-            Expanded(
+          ])),
-              child: Column(
+          const SizedBox(width: 8),
-                crossAxisAlignment: CrossAxisAlignment.start,
+          Icon(Icons.chevron_right, color: colors.onSurface.withValues(alpha: 0.2), size: 20),
-                children: [
+        ]),
-                  Text(book.title, maxLines: 1, overflow: TextOverflow.ellipsis,
-                      style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.onSurface)),
-                  if (book.authors.isNotEmpty) ...[
-                    const SizedBox(height: 3),
-                    Text(book.authors.take(2).join('、'), maxLines: 1, overflow: TextOverflow.ellipsis,
-                        style: TextStyle(fontSize: 12, color: colors.onSurface.withValues(alpha: 0.35))),
-                  ],
-                  const SizedBox(height: 6),
-                  if (book.rating != null)
-                    AnimatedStarRating(rating: book.rating!, starSize: 12, showNumber: true)
-                  else
-                    const SizedBox(height: 14),
-                ],
-              ),
-            ),
-            const SizedBox(width: 8),
-            Icon(Icons.chevron_right, color: colors.onSurface.withValues(alpha: 0.2), size: 20),
-          ],
-        ),
       ),
     );
   }
 
-  void _showDeleteDialog(BuildContext context, book) {
+  void _showDeleteDialog(BuildContext context, Book book) {
     final colors = Theme.of(context).colorScheme;
-    showDialog(
+    showDialog(context: context, builder: (ctx) => AlertDialog(
-      context: context,
+      backgroundColor: colors.surface, elevation: 0, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-      builder: (ctx) => AlertDialog(
+      title: Text('确认删除', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: colors.onSurface)),
-        backgroundColor: colors.surface,
+      content: Text('确定要删除《${book.title}》吗？删除后可在回收站恢复。',
-        elevation: 0,
+          style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6), height: 1.5)),
-        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
+      actions: [
-        title: Text('确认删除', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: colors.onSurface)),
+        TextButton(onPressed: () => Navigator.pop(ctx), child: Text('取消', style: TextStyle(color: colors.onSurface.withValues(alpha: 0.6)))),
-        content: Text('确定要删除《${book.title}》吗？删除后可在回收站恢复。',
+        ElevatedButton(onPressed: () async { await context.read<AppProvider>().removeBook(book.id); Navigator.pop(ctx); _loadFirst(); },
-            style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6), height: 1.5)),
+          style: ElevatedButton.styleFrom(backgroundColor: colors.error, foregroundColor: colors.onError, elevation: 0,
-        actions: [
+              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)), padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8)),
-          TextButton(
+          child: const Text('删除'),
-            onPressed: () => Navigator.pop(ctx),
+        ),
-            child: Text('取消', style: TextStyle(color: colors.onSurface.withValues(alpha: 0.6))),
+      ],
-          ),
+      actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
-          ElevatedButton(
+    ));
-            onPressed: () async {
-              await context.read<AppProvider>().removeBook(book.id);
-              Navigator.pop(ctx);
-            },
-            style: ElevatedButton.styleFrom(
-              backgroundColor: colors.error, foregroundColor: colors.onError, elevation: 0,
-              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-            ),
-            child: const Text('删除'),
-          ),
-        ],
-        actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
-      ),
-    );
   }
 
-  Widget _buildSkeleton() {
+  Widget _buildSkeleton() => _layoutStyle == 1 ? const MovieSkeletonGrid() : const BookSkeletonGrid();
-    return _layoutStyle == 1
-        ? MovieSkeletonGrid()
-        : const BookSkeletonGrid();
-  }
 
   Widget _buildEmptyState(BuildContext context, int statusIndex) {
     final colors = Theme.of(context).colorScheme;
     final statusText = ['已读', '在读', '想读'][statusIndex];
-    return Center(
+    return Center(child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
-      child: Column(
+      Container(width: 80, height: 80,
-        mainAxisAlignment: MainAxisAlignment.center,
+          decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(20)),
-        children: [
+          child: Icon(Icons.menu_book_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25))),
-          Container(
+      const SizedBox(height: 20),
-            width: 80, height: 80,
+      Text('暂无$statusText的书籍', style: TextStyle(fontSize: 16, color: colors.onSurface.withValues(alpha: 0.4))),
-            decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(20)),
+      const SizedBox(height: 24),
-            child: Icon(Icons.menu_book_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25)),
+      InkWell(onTap: () {
-          ),
+        final statusMap = {0: 'read', 1: 'reading', 2: 'want_to_read'};
-          const SizedBox(height: 20),
+        Navigator.pushNamed(context, '/book-form', arguments: {'initialStatus': statusMap[statusIndex]!});
-          Text('暂无$statusText的书籍', style: TextStyle(fontSize: 16, color: colors.onSurface.withValues(alpha: 0.4))),
+      },
-          const SizedBox(height: 24),
+        child: Container(padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
-          InkWell(
+            decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(8)),
-            onTap: () {
+            child: Text('添加记录', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: colors.onPrimary))),
-              final statusMap = {0: 'read', 1: 'reading', 2: 'want_to_read'};
-              Navigator.pushNamed(context, '/book-form', arguments: {'initialStatus': statusMap[statusIndex]!});
-            },
-            child: Container(
-              padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
-              decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(8)),
-              child: Text('添加记录', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: colors.onPrimary)),
-            ),
-          ),
-        ],
       ),
-    );
+    ]));
   }
 }

lib/pages/movies/movie_detail_page.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:path_provider/path_provider.dart';
 import 'package:path/path.dart' as path;
+import '../../widgets/fade_in_local_image.dart';
 import 'package:share_plus/share_plus.dart';
 import 'package:cross_file/cross_file.dart';
 import 'package:permission_handler/permission_handler.dart';
@@ -193,10 +194,9 @@ class _MovieDetailPageState extends State<MovieDetailPage> {
   Widget _buildPosterSection(Movie movie) {
     return SizedBox.expand(
       child: movie.posterPath != null && movie.posterPath!.isNotEmpty
-          ? Image.file(
+          ? FadeInLocalImage(
-              File(movie.posterPath!),
+              path: movie.posterPath,
               fit: BoxFit.cover,
-              errorBuilder: (_, __, ___) => _buildPosterPlaceholder(),
             )
           : _buildPosterPlaceholder(),
     );

lib/pages/movies/movie_form_page.dart

@@ -6,6 +6,7 @@ import 'package:path/path.dart' as p;
 import 'package:provider/provider.dart';
 import 'package:http/http.dart' as http;
 import '../../providers/app_provider.dart';
+import '../../widgets/fade_in_local_image.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
 import '../../utils/image_path_helper.dart';
@@ -1381,10 +1382,9 @@ class _MovieFormPageState extends State<MovieFormPage> {
             ),
             clipBehavior: Clip.antiAlias,
             child: hasPoster
-                ? Image.file(
+                ? FadeInLocalImage(
-                    File(_posterPath!),
+                    path: _posterPath,
                     fit: BoxFit.cover,
-                    errorBuilder: (_, __, ___) => _buildCoverPlaceholder(),
                   )
                 : _buildCoverPlaceholder(),
           ),

lib/pages/movies/movie_posters_page.dart

@@ -8,6 +8,7 @@ import 'package:provider/provider.dart';
 import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
 import 'package:http/http.dart' as http;
 import '../../providers/app_provider.dart';
+import '../../widgets/fade_in_local_image.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
 import '../../utils/image_path_helper.dart';
@@ -158,15 +159,9 @@ class _MoviePostersPageState extends State<MoviePostersPage> {
             fit: StackFit.expand,
             children: [
               // 海报图片
-              Image.file(
+              FadeInLocalImage(
-                File(poster.posterPath),
+                path: poster.posterPath,
                 fit: BoxFit.cover,
-                errorBuilder: (_, __, ___) => Center(
-                  child: Icon(
-                    Icons.broken_image,
-                    color: colors.onSurface.withValues(alpha: 0.25),
-                  ),
-                ),
               ),
               // 渐变遮罩（底部）
               Positioned(

lib/pages/movies/movie_review_detail_page.dart

@@ -4,6 +4,7 @@ import 'package:provider/provider.dart';
 import '../../models/data_models.dart';
 import '../../providers/app_provider.dart';
 import '../../utils/toast_util.dart';
+import '../../widgets/fade_in_local_image.dart';
 import 'movie_review_form_page.dart';
 
 /// 影评详情页
@@ -121,7 +122,8 @@ class _MovieReviewDetailPageState extends State<MovieReviewDetailPage> {
         decoration: BoxDecoration(borderRadius: BorderRadius.circular(6), color: colors.surfaceContainerHighest),
         clipBehavior: Clip.antiAlias,
         child: movie.posterPath != null
-            ? Image.file(File(movie.posterPath!), fit: BoxFit.cover, errorBuilder: (_, __, ___) => Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)))
+            ? FadeInLocalImage(path: movie.posterPath, fit: BoxFit.cover,
+                errorWidget: Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)))
             : Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)),
       ),
       const SizedBox(width: 12),

lib/pages/movies/movie_review_form_page.dart

@@ -2,6 +2,7 @@ import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import '../../providers/app_provider.dart';
+import '../../widgets/fade_in_local_image.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
 
@@ -155,8 +156,8 @@ class _MovieReviewFormPageState extends State<MovieReviewFormPage> {
             ),
             clipBehavior: Clip.antiAlias,
             child: movie.posterPath != null
-                ? Image.file(File(movie.posterPath!), fit: BoxFit.cover,
+                ? FadeInLocalImage(path: movie.posterPath, fit: BoxFit.cover,
-                    errorBuilder: (_, __, ___) => Icon(Icons.movie_outlined, size: 24, color: colors.onSurface.withValues(alpha: 0.25)))
+                    errorWidget: Icon(Icons.movie_outlined, size: 24, color: colors.onSurface.withValues(alpha: 0.25)))
                 : Icon(Icons.movie_outlined, size: 24, color: colors.onSurface.withValues(alpha: 0.25)),
           ),
           const SizedBox(width: 14),

lib/pages/movies/movie_share_page.dart

@@ -7,6 +7,7 @@ import 'package:path_provider/path_provider.dart';
 import 'package:share_plus/share_plus.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
+import '../../widgets/fade_in_local_image.dart';
 
 /// 影视分享海报页面
 class MovieSharePage extends StatefulWidget {
@@ -103,8 +104,8 @@ class _MovieSharePageState extends State<MovieSharePage> {
           if (hasPoster)
             ClipRRect(
               borderRadius: const BorderRadius.vertical(top: Radius.circular(16)),
-              child: Image.file(
+              child: FadeInLocalImage(
-                File(movie.posterPath!),
+                path: movie.posterPath,
                 width: 320,
                 height: 200,
                 fit: BoxFit.cover,

lib/pages/movies/movie_tab_page.dart

@@ -1,14 +1,15 @@
-import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
+import '../../models/data_models.dart';
 import '../../providers/app_provider.dart';
 import '../../utils/user_prefs.dart';
 import '../../widgets/movie_status_bar.dart';
 import '../../widgets/movie_list_item.dart';
 import '../../widgets/animated_star_rating.dart';
 import '../../widgets/shimmer_skeleton.dart';
+import '../../widgets/fade_in_local_image.dart';
 
-/// 观影标签页
+/// 观影标签页（分页 + 触底加载）
 class MovieTabPage extends StatefulWidget {
   const MovieTabPage({super.key});
 
@@ -18,17 +19,98 @@ class MovieTabPage extends StatefulWidget {
 
 class _MovieTabPageState extends State<MovieTabPage> {
   int _layoutStyle = 0;
-  bool _firstLoad = true;
+  final List<Movie> _items = [];
+  bool _hasMore = true;
+  bool _isLoading = false;
+  int _offset = 0;
+  int _lastStatusIndex = -1;
+  bool _initialized = false;
+  int _lastDataCount = -1;
+  DateTime? _lastUpdatedAt;
+  late ScrollController _scrollController;
+
+  static const _statusMap = {0: 'watched', 1: 'watching', 2: 'want_to_watch'};
 
   @override
   void initState() {
     super.initState();
     _layoutStyle = UserPrefs().movieLayoutStyle;
+    _scrollController = ScrollController()..addListener(_onScroll);
     WidgetsBinding.instance.addPostFrameCallback((_) {
-      if (mounted) setState(() => _firstLoad = false);
+      final provider = context.read<AppProvider>();
+      provider.addListener(_onDataChanged);
+      _lastDataCount = provider.movies.length;
+      if (provider.movies.isNotEmpty) _lastUpdatedAt = provider.movies.first.updatedAt;
+      _loadFirst();
     });
   }
 
+  @override
+  void dispose() {
+    _scrollController.dispose();
+    super.dispose();
+  }
+
+  void _onDataChanged() {
+    if (!_initialized || !mounted) return;
+    final provider = context.read<AppProvider>();
+    final count = provider.movies.length;
+    final latest = provider.movies.isNotEmpty ? provider.movies.first.updatedAt : null;
+    if (count != _lastDataCount || latest != _lastUpdatedAt) {
+      _lastDataCount = count;
+      _lastUpdatedAt = latest;
+      WidgetsBinding.instance.addPostFrameCallback((_) {
+        if (mounted) _loadFirst();
+      });
+    }
+  }
+
+  void _onScroll() {
+    if (_scrollController.position.pixels >= _scrollController.position.maxScrollExtent - 200) {
+      _loadMore();
+    }
+  }
+
+  String get _currentStatus => _statusMap[context.read<AppProvider>().movieStatusIndex] ?? 'watched';
+
+  Future<void> _loadFirst() async {
+    final provider = context.read<AppProvider>();
+    final statusIdx = provider.movieStatusIndex;
+    _lastStatusIndex = statusIdx;
+    _initialized = true;
+    final status = _statusMap[statusIdx] ?? 'watched';
+    setState(() { _isLoading = true; _items.clear(); _offset = 0; _hasMore = true; });
+    final list = await provider.loadMoviesPaged(status: status, offset: 0);
+    if (!mounted) return;
+    setState(() {
+      _items.addAll(list);
+      _offset = list.length;
+      _hasMore = list.length >= 20;
+      _isLoading = false;
+    });
+  }
+
+  Future<void> _loadMore() async {
+    if (_isLoading || !_hasMore) return;
+    setState(() => _isLoading = true);
+    final provider = context.read<AppProvider>();
+    final status = _statusMap[provider.movieStatusIndex] ?? 'watched';
+    final list = await provider.loadMoviesPaged(status: status, offset: _offset);
+    if (!mounted) return;
+    setState(() {
+      _items.addAll(list);
+      _offset += list.length;
+      _hasMore = list.length >= 20;
+      _isLoading = false;
+    });
+  }
+
+  Future<void> _refresh() async {
+    final provider = context.read<AppProvider>();
+    await provider.loadMovies();
+    await _loadFirst();
+  }
+
   @override
   Widget build(BuildContext context) {
     final colors = Theme.of(context).colorScheme;
@@ -36,30 +118,26 @@ class _MovieTabPageState extends State<MovieTabPage> {
       children: [
         const MovieStatusBar(),
         Divider(height: 0.5, thickness: 0.5, color: colors.outline),
-        Expanded(
+        Expanded(child: _buildBody(context)),
-          child: _buildMovieList(context),
-        ),
       ],
     );
   }
 
-  Widget _buildMovieList(BuildContext context) {
+  Widget _buildBody(BuildContext context) {
     final colors = Theme.of(context).colorScheme;
     return Consumer<AppProvider>(
-      builder: (context, provider, child) {
+      builder: (context, provider, _) {
-        final statusMap = {0: 'watched', 1: 'watching', 2: 'want_to_watch'};
+        // 状态切换时重新加载（跳过首次未初始化的情况）
-        final currentStatus = statusMap[provider.movieStatusIndex]!;
+        if (_initialized && provider.movieStatusIndex != _lastStatusIndex) {
-        final allMovies = provider.movies.where((m) => !m.isDeleted).toList();
+          _lastStatusIndex = provider.movieStatusIndex;
-        if (_firstLoad && allMovies.isEmpty) {
+          WidgetsBinding.instance.addPostFrameCallback((_) => _loadFirst());
-          return _buildSkeleton();
         }
-        _firstLoad = false;
 
-        final movies = provider.getMoviesByStatus(currentStatus);
+        if (_items.isEmpty && _isLoading) return _buildSkeleton();
 
-        if (movies.isEmpty) {
+        if (_items.isEmpty) {
           return RefreshIndicator(
-            onRefresh: () async => await provider.loadMovies(),
+            onRefresh: _refresh,
             color: colors.primary,
             backgroundColor: colors.surface,
             child: ListView(
@@ -69,49 +147,55 @@ class _MovieTabPageState extends State<MovieTabPage> {
           );
         }
 
-        if (_layoutStyle == 1) {
+        return RefreshIndicator(
-          return _buildListView(movies, provider);
+          onRefresh: _refresh,
-        }
+          color: colors.primary,
-        return _buildGridView(movies, provider);
+          backgroundColor: colors.surface,
+          child: _layoutStyle == 1 ? _buildListView() : _buildGridView(),
+        );
       },
     );
   }
 
-  Widget _buildGridView(List movies, AppProvider provider) {
+  Widget _buildGridView() {
-    final colors = Theme.of(context).colorScheme;
+    return GridView.builder(
-    return RefreshIndicator(
+      controller: _scrollController,
-      onRefresh: () async => await provider.loadMovies(),
+      padding: const EdgeInsets.fromLTRB(16, 16, 16, 100),
-      color: colors.primary,
+      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
-      backgroundColor: colors.surface,
+        crossAxisCount: 3, childAspectRatio: 0.55, crossAxisSpacing: 12, mainAxisSpacing: 16,
-      child: GridView.builder(
+      ),
-        padding: const EdgeInsets.fromLTRB(16, 16, 16, 100),
+      itemCount: _items.length + (_hasMore ? 1 : 0),
-        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+      itemBuilder: (context, index) {
-          crossAxisCount: 3,
+        if (index >= _items.length) return _buildLoadMoreIndicator();
-          childAspectRatio: 0.55,
+        return MovieListItem(movie: _items[index]);
-          crossAxisSpacing: 12,
+      },
-          mainAxisSpacing: 16,
+    );
-        ),
+  }
-        itemCount: movies.length,
+
-        itemBuilder: (context, index) => MovieListItem(movie: movies[index]),
+  Widget _buildListView() {
+    return ListView.builder(
+      controller: _scrollController,
+      padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
+      itemCount: _items.length + (_hasMore ? 1 : 0),
+      itemBuilder: (context, index) {
+        if (index >= _items.length) return _buildLoadMoreIndicator();
+        return _buildListCard(_items[index]);
+      },
+    );
+  }
+
+  Widget _buildLoadMoreIndicator() {
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: 20),
+      child: Center(
+        child: _isLoading
+            ? SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: Theme.of(context).colorScheme.primary))
+            : Text('没有更多了', style: TextStyle(fontSize: 12, color: Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.3))),
       ),
     );
   }
 
-  Widget _buildListView(List movies, AppProvider provider) {
+  Widget _buildListCard(Movie movie) {
-    final colors = Theme.of(context).colorScheme;
-    return RefreshIndicator(
-      onRefresh: () async => await provider.loadMovies(),
-      color: colors.primary,
-      backgroundColor: colors.surface,
-      child: ListView.builder(
-        padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-        itemCount: movies.length,
-        itemBuilder: (context, index) => _buildListCard(movies[index]),
-      ),
-    );
-  }
-
-  Widget _buildListCard(movie) {
     final colors = Theme.of(context).colorScheme;
     return GestureDetector(
       onTap: () => Navigator.pushNamed(context, '/movie-detail', arguments: movie),
@@ -119,78 +203,59 @@ class _MovieTabPageState extends State<MovieTabPage> {
       child: Container(
         margin: const EdgeInsets.only(bottom: 8),
         padding: const EdgeInsets.all(12),
-        decoration: BoxDecoration(
+        decoration: BoxDecoration(color: colors.surfaceContainerHigh, borderRadius: BorderRadius.circular(12)),
-          color: colors.surfaceContainerHigh,
+        child: Row(children: [
-          borderRadius: BorderRadius.circular(12),
+          Container(
-        ),
+            width: 48, height: 64,
-        child: Row(
+            decoration: BoxDecoration(color: colors.outlineVariant, borderRadius: BorderRadius.circular(6)),
-          children: [
+            clipBehavior: Clip.antiAlias,
-            Container(
+            child: movie.posterPath != null && movie.posterPath!.isNotEmpty
-              width: 48, height: 64,
+                ? FadeInLocalImage(path: movie.posterPath, fit: BoxFit.cover,
-              decoration: BoxDecoration(
+                    errorWidget: Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)))
-                color: colors.outlineVariant,
+                : Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)),
-                borderRadius: BorderRadius.circular(6),
+          ),
-              ),
+          const SizedBox(width: 12),
-              clipBehavior: Clip.antiAlias,
+          Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
-              child: movie.posterPath != null && movie.posterPath!.isNotEmpty
+            Text(movie.title, maxLines: 1, overflow: TextOverflow.ellipsis,
-                  ? Image.file(File(movie.posterPath!), fit: BoxFit.cover,
+                style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.onSurface)),
-                      errorBuilder: (_, __, ___) => Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)))
+            if (movie.alternateTitles.isNotEmpty) ...[
-                  : Icon(Icons.movie_outlined, size: 22, color: colors.onSurface.withValues(alpha: 0.25)),
+              const SizedBox(height: 3),
-            ),
+              Text(movie.alternateTitles.take(2).join('、'), maxLines: 1, overflow: TextOverflow.ellipsis,
-            const SizedBox(width: 12),
+                  style: TextStyle(fontSize: 12, color: colors.onSurface.withValues(alpha: 0.35))),
-            Expanded(
+            ],
-              child: Column(
+            const SizedBox(height: 6),
-                crossAxisAlignment: CrossAxisAlignment.start,
+            if (movie.rating != null) AnimatedStarRating(rating: movie.rating!, starSize: 12, showNumber: true)
-                children: [
+            else const SizedBox(height: 14),
-                  Text(movie.title, maxLines: 1, overflow: TextOverflow.ellipsis,
+          ])),
-                      style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.onSurface)),
+          const SizedBox(width: 8),
-                  if (movie.alternateTitles.isNotEmpty) ...[
+          Icon(Icons.chevron_right, color: colors.onSurface.withValues(alpha: 0.2), size: 20),
-                    const SizedBox(height: 3),
+        ]),
-                    Text(movie.alternateTitles.take(2).join('、'), maxLines: 1, overflow: TextOverflow.ellipsis,
-                        style: TextStyle(fontSize: 12, color: colors.onSurface.withValues(alpha: 0.35))),
-                  ],
-                  const SizedBox(height: 6),
-                  if (movie.rating != null)
-                    AnimatedStarRating(rating: movie.rating!, starSize: 12, showNumber: true)
-                  else
-                    const SizedBox(height: 14),
-                ],
-              ),
-            ),
-            const SizedBox(width: 8),
-            Icon(Icons.chevron_right, color: colors.onSurface.withValues(alpha: 0.2), size: 20),
-          ],
-        ),
       ),
     );
   }
 
-  void _showDeleteDialog(BuildContext context, movie) {
+  void _showDeleteDialog(BuildContext context, Movie movie) {
     final colors = Theme.of(context).colorScheme;
     showDialog(
       context: context,
       builder: (ctx) => AlertDialog(
-        backgroundColor: colors.surface,
+        backgroundColor: colors.surface, elevation: 0,
-        elevation: 0,
         shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
         title: Text('确认删除', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: colors.onSurface)),
         content: Text('确定要删除《${movie.title}》吗？删除后可在回收站恢复。',
             style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6), height: 1.5)),
         actions: [
-          TextButton(
+          TextButton(onPressed: () => Navigator.pop(ctx),
-            onPressed: () => Navigator.pop(ctx),
+              child: Text('取消', style: TextStyle(color: colors.onSurface.withValues(alpha: 0.6)))),
-            child: Text('取消', style: TextStyle(color: colors.onSurface.withValues(alpha: 0.6))),
-          ),
           ElevatedButton(
             onPressed: () async {
               await context.read<AppProvider>().removeMovie(movie.id);
               Navigator.pop(ctx);
+              _loadFirst();
             },
-            style: ElevatedButton.styleFrom(
+            style: ElevatedButton.styleFrom(backgroundColor: colors.error, foregroundColor: colors.onError, elevation: 0,
-              backgroundColor: colors.error, foregroundColor: colors.onError, elevation: 0,
+                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
-              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
+                padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8)),
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-            ),
             child: const Text('删除'),
           ),
         ],
@@ -199,42 +264,24 @@ class _MovieTabPageState extends State<MovieTabPage> {
     );
   }
 
-  Widget _buildSkeleton() {
+  Widget _buildSkeleton() => _layoutStyle == 1 ? _buildListSkeleton() : const MovieSkeletonGrid();
-    return _layoutStyle == 1 ? _buildListSkeleton() : const MovieSkeletonGrid();
-  }
 
   Widget _buildListSkeleton() {
     final colors = Theme.of(context).colorScheme;
     return ListView.builder(
-      padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
+      padding: const EdgeInsets.fromLTRB(12, 8, 12, 100), itemCount: 6,
-      itemCount: 6,
       itemBuilder: (_, __) => Container(
-        margin: const EdgeInsets.only(bottom: 8),
+        margin: const EdgeInsets.only(bottom: 8), padding: const EdgeInsets.all(12),
-        padding: const EdgeInsets.all(12),
+        decoration: BoxDecoration(color: colors.surfaceContainerHigh, borderRadius: BorderRadius.circular(12)),
-        decoration: BoxDecoration(
+        child: const Row(children: [
-          color: colors.surfaceContainerHigh,
+          ShimmerSkeleton(width: 48, height: 64, borderRadius: 6), SizedBox(width: 12),
-          borderRadius: BorderRadius.circular(12),
+          Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
-        ),
+            ShimmerSkeleton(width: 160, height: 16), SizedBox(height: 6),
-        child: const Row(
+            ShimmerSkeleton(width: 100, height: 12), SizedBox(height: 6),
-          children: [
+            ShimmerSkeleton(width: 70, height: 12),
-            ShimmerSkeleton(width: 48, height: 64, borderRadius: 6),
+          ])),
-            SizedBox(width: 12),
+          SizedBox(width: 8), ShimmerSkeleton(width: 20, height: 20, borderRadius: 10),
-            Expanded(
+        ]),
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  ShimmerSkeleton(width: 160, height: 16),
-                  SizedBox(height: 6),
-                  ShimmerSkeleton(width: 100, height: 12),
-                  SizedBox(height: 6),
-                  ShimmerSkeleton(width: 70, height: 12),
-                ],
-              ),
-            ),
-            SizedBox(width: 8),
-            ShimmerSkeleton(width: 20, height: 20, borderRadius: 10),
-          ],
-        ),
       ),
     );
   }
@@ -242,31 +289,24 @@ class _MovieTabPageState extends State<MovieTabPage> {
   Widget _buildEmptyState(BuildContext context, int statusIndex) {
     final colors = Theme.of(context).colorScheme;
     final statusText = ['已看', '在看', '想看'][statusIndex];
-    return Center(
+    return Center(child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
-      child: Column(
+      Container(width: 80, height: 80,
-        mainAxisAlignment: MainAxisAlignment.center,
+          decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(20)),
-        children: [
+          child: Icon(Icons.movie_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25))),
-          Container(
+      const SizedBox(height: 20),
-            width: 80, height: 80,
+      Text('暂无$statusText的影片', style: TextStyle(fontSize: 16, color: colors.onSurface.withValues(alpha: 0.4))),
-            decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(20)),
+      const SizedBox(height: 24),
-            child: Icon(Icons.movie_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25)),
+      InkWell(
-          ),
+        onTap: () {
-          const SizedBox(height: 20),
+          final statusMap = {0: 'watched', 1: 'watching', 2: 'want_to_watch'};
-          Text('暂无$statusText的影片', style: TextStyle(fontSize: 16, color: colors.onSurface.withValues(alpha: 0.4))),
+          Navigator.pushNamed(context, '/movie-form', arguments: {'initialStatus': statusMap[statusIndex]!});
-          const SizedBox(height: 24),
+        },
-          InkWell(
+        child: Container(
-            onTap: () {
+          padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
-              final statusMap = {0: 'watched', 1: 'watching', 2: 'want_to_watch'};
+          decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(8)),
-              Navigator.pushNamed(context, '/movie-form', arguments: {'initialStatus': statusMap[statusIndex]!});
+          child: Text('添加记录', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: colors.onPrimary)),
-            },
+        ),
-            child: Container(
-              padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
-              decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(8)),
-              child: Text('添加记录', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: colors.onPrimary)),
-            ),
-          ),
-        ],
       ),
-    );
+    ]));
   }
 }

lib/pages/movies/poster_gallery_page.dart

@@ -1,6 +1,7 @@
 import 'dart:io';
 import 'package:flutter/material.dart';
 import '../../models/data_models.dart';
+import '../../widgets/fade_in_local_image.dart';
 
 /// 海报画廊页面 - 支持左右滑动浏览
 class PosterGalleryPage extends StatefulWidget {
@@ -53,16 +54,9 @@ class _PosterGalleryPageState extends State<PosterGalleryPage> {
                 minScale: 0.5,
                 maxScale: 3.0,
                 child: Center(
-                  child: Image.file(
+                  child: FadeInLocalImage(
-                    File(poster.posterPath),
+                    path: poster.posterPath,
                     fit: BoxFit.contain,
-                    errorBuilder: (_, __, ___) => const Center(
-                      child: Icon(
-                        Icons.broken_image,
-                        color: Colors.white54,
-                        size: 64,
-                      ),
-                    ),
                   ),
                 ),
               );

lib/pages/note/note_detail_page.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_markdown_plus/flutter_markdown_plus.dart';
 import 'package:provider/provider.dart';
 import '../../providers/app_provider.dart';
+import '../../widgets/fade_in_local_image.dart';
 import '../../models/data_models.dart';
 import 'note_share_page.dart';
 import '../../widgets/fade_in_local_image.dart';
@@ -176,10 +177,10 @@ class _NoteDetailPageState extends State<NoteDetailPage> {
                 border: Border.all(color: colors.outlineVariant, width: 0.5),
               ),
               clipBehavior: Clip.antiAlias,
-              child: Image.file(
+              child: FadeInLocalImage(
-                File(images[index]),
+                path: images[index],
                 fit: BoxFit.cover,
-                errorBuilder: (_, __, ___) => Container(
+                errorWidget: Container(
                   color: colors.surfaceContainerHighest,
                   child: Icon(Icons.broken_image_outlined, size: 20, color: colors.onSurface.withValues(alpha: 0.25)),
                 ),

lib/pages/note/note_form_page.dart

@@ -8,6 +8,7 @@ import '../../providers/app_provider.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
 import '../../utils/image_path_helper.dart';
+import '../../widgets/fade_in_local_image.dart';
 
 /// 添加/编辑笔记页面 - 极简书写界面
 class NoteFormPage extends StatefulWidget {
@@ -1037,8 +1038,8 @@ class _NoteFormPageState extends State<NoteFormPage> {
           border: Border.all(color: colors.outline, width: 0.5),
         ),
         clipBehavior: Clip.antiAlias,
-        child: Image.file(
+        child: FadeInLocalImage(
-          File(_images[index]),
+          path: _images[index],
           fit: BoxFit.cover,
         ),
       ),
@@ -1060,8 +1061,8 @@ class _NoteFormPageState extends State<NoteFormPage> {
               boundaryMargin: const EdgeInsets.all(20),
               minScale: 0.5,
               maxScale: 4,
-              child: Image.file(
+              child: FadeInLocalImage(
-                File(_images[index]),
+                path: _images[index],
                 fit: BoxFit.contain,
               ),
             ),

lib/pages/note/note_share_page.dart

@@ -7,6 +7,7 @@ import 'package:path_provider/path_provider.dart';
 import 'package:share_plus/share_plus.dart';
 import '../../models/data_models.dart';
 import '../../utils/toast_util.dart';
+import '../../widgets/fade_in_local_image.dart';
 
 /// 笔记分享海报页面
 class NoteSharePage extends StatefulWidget {
@@ -105,11 +106,11 @@ class _NoteSharePageState extends State<NoteSharePage> {
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           // 首张图片
-          if (hasImages && File(note.images.first).existsSync())
+          if (hasImages)
             ClipRRect(
               borderRadius: const BorderRadius.vertical(top: Radius.circular(16)),
-              child: Image.file(
+              child: FadeInLocalImage(
-                File(note.images.first),
+                path: note.images.first,
                 width: 320,
                 height: 200,
                 fit: BoxFit.cover,

lib/pages/note/note_tab_page.dart

@@ -1,4 +1,3 @@
-import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import '../../providers/app_provider.dart';
@@ -8,7 +7,7 @@ import '../../widgets/note_list_item.dart';
 import '../../widgets/shimmer_skeleton.dart';
 import '../../widgets/fade_in_local_image.dart';
 
-/// 笔记标签页
+/// 笔记标签页（分页 + 触底加载）
 class NoteTabPage extends StatefulWidget {
   const NoteTabPage({super.key});
 
@@ -17,213 +16,127 @@ class NoteTabPage extends StatefulWidget {
 }
 
 class _NoteTabPageState extends State<NoteTabPage> {
-  static const int _pageSize = 50;
+  final List<Note> _items = [];
-  final List<Note> _displayedNotes = [];
-  bool _isLoading = false;
   bool _hasMore = true;
-  final ScrollController _scrollController = ScrollController();
+  bool _isLoading = false;
-
+  int _offset = 0;
+  late ScrollController _scrollController;
   int _layoutStyle = 0;
-  bool _firstLoad = true;
+  bool _initialized = false;
+  int _lastDataCount = -1;
+  DateTime? _lastUpdatedAt;
 
   @override
   void initState() {
     super.initState();
-    _scrollController.addListener(_onScroll);
     _layoutStyle = UserPrefs().noteLayoutStyle;
+    _scrollController = ScrollController()..addListener(_onScroll);
     WidgetsBinding.instance.addPostFrameCallback((_) {
-      _loadMoreNotes();
+      final provider = context.read<AppProvider>();
-      if (mounted) setState(() => _firstLoad = false);
+      provider.addListener(_onDataChanged);
+      _lastDataCount = provider.notes.length;
+      if (provider.notes.isNotEmpty) _lastUpdatedAt = provider.notes.first.updatedAt;
+      _loadFirst();
     });
   }
 
-  int _lastNotesCount = 0;
-
-  @override
-  void didChangeDependencies() {
-    super.didChangeDependencies();
-    final provider = context.watch<AppProvider>();
-    final allNotes = provider.notes;
-
-    if (allNotes.length != _lastNotesCount && _displayedNotes.isNotEmpty) {
-      _lastNotesCount = allNotes.length;
-      setState(() {
-        _displayedNotes.clear();
-        _hasMore = true;
-      });
-      Future.microtask(() => _loadMoreNotes());
-    } else {
-      _lastNotesCount = allNotes.length;
-    }
-  }
-
   @override
   void dispose() {
     _scrollController.dispose();
     super.dispose();
   }
 
-  void _onScroll() {
+  void _onDataChanged() {
-    if (_scrollController.position.pixels >=
+    if (!_initialized || !mounted) return;
-        _scrollController.position.maxScrollExtent - 200) {
+    final provider = context.read<AppProvider>();
-      _loadMoreNotes();
+    final count = provider.notes.length;
+    final latest = provider.notes.isNotEmpty ? provider.notes.first.updatedAt : null;
+    if (count != _lastDataCount || latest != _lastUpdatedAt) {
+      _lastDataCount = count;
+      _lastUpdatedAt = latest;
+      WidgetsBinding.instance.addPostFrameCallback((_) {
+        if (mounted) _loadFirst();
+      });
     }
   }
 
-  Future<void> _loadMoreNotes() async {
+  void _onScroll() {
-    if (_isLoading || !_hasMore) return;
+    if (_scrollController.position.pixels >= _scrollController.position.maxScrollExtent - 200) {
-
+      _loadMore();
-    setState(() => _isLoading = true);
-
-    await Future.microtask(() {
-      final provider = context.read<AppProvider>();
-      final allNotes = provider.notes;
-
-      final startIndex = _displayedNotes.length;
-      final endIndex = (startIndex + _pageSize).clamp(0, allNotes.length);
-
-      if (startIndex >= allNotes.length) {
-        _hasMore = false;
-      } else {
-        final newNotes = allNotes.sublist(startIndex, endIndex);
-        _displayedNotes.addAll(newNotes);
-        _hasMore = endIndex < allNotes.length;
-      }
-    });
-
-    if (mounted) {
-      setState(() => _isLoading = false);
     }
   }
 
+  Future<void> _loadFirst() async {
+    _initialized = true;
+    setState(() { _isLoading = true; _items.clear(); _offset = 0; _hasMore = true; });
+    final list = await context.read<AppProvider>().loadNotesPaged(offset: 0);
+    if (!mounted) return;
+    setState(() { _items.addAll(list); _offset = list.length; _hasMore = list.length >= 20; _isLoading = false; });
+  }
+
+  Future<void> _loadMore() async {
+    if (_isLoading || !_hasMore) return;
+    setState(() => _isLoading = true);
+    final list = await context.read<AppProvider>().loadNotesPaged(offset: _offset);
+    if (!mounted) return;
+    setState(() { _items.addAll(list); _offset += list.length; _hasMore = list.length >= 20; _isLoading = false; });
+  }
+
   Future<void> _refresh() async {
-    final provider = context.read<AppProvider>();
+    await context.read<AppProvider>().loadNotes();
-    await provider.loadNotes();
+    await _loadFirst();
-    setState(() {
-      _displayedNotes.clear();
-      _hasMore = true;
-    });
-    await _loadMoreNotes();
   }
 
   @override
   Widget build(BuildContext context) {
-    return Column(
+    final colors = Theme.of(context).colorScheme;
-      children: [
+    return Consumer<AppProvider>(builder: (context, provider, _) {
-        Expanded(
+      if (_items.isEmpty && _isLoading) return _buildSkeleton();
-          child: Consumer<AppProvider>(
+      if (_items.isEmpty) {
-            builder: (context, provider, child) {
+        return RefreshIndicator(onRefresh: _refresh, color: colors.primary, backgroundColor: colors.surface,
-              final allNotes = provider.notes;
+            child: ListView(physics: const AlwaysScrollableScrollPhysics(), children: [_buildEmptyState(context)]));
-              _syncDisplayedNotes(allNotes);
+      }
-
+      if (_layoutStyle == 1) return _buildWaterfallView();
-              if (_firstLoad) {
+      if (_layoutStyle == 2) return _buildTimelineView();
-                return _buildSkeleton();
+      return _buildListView();
-              }
+    });
-
-              if (allNotes.isEmpty && _displayedNotes.isEmpty) {
-                final colors = Theme.of(context).colorScheme;
-                return RefreshIndicator(
-                  onRefresh: _refresh,
-                  color: colors.primary,
-                  backgroundColor: colors.surface,
-                  child: ListView(
-                    physics: const AlwaysScrollableScrollPhysics(),
-                    children: [_buildEmptyState(context)],
-                  ),
-                );
-              }
-
-              if (_layoutStyle == 1) {
-                return _buildWaterfallView();
-              }
-              if (_layoutStyle == 2) {
-                return _buildTimelineView();
-              }
-              return _buildListView();
-            },
-          ),
-        ),
-      ],
-    );
   }
 
   Widget _buildSkeleton() {
     switch (_layoutStyle) {
-      case 1:
+      case 1: return _buildWaterfallSkeleton();
-        return _buildWaterfallSkeleton();
+      default: return const NoteSkeletonList();
-      case 2:
-        return const NoteSkeletonList();
-      default:
-        return const NoteSkeletonList();
     }
   }
 
   Widget _buildWaterfallSkeleton() {
     final colors = Theme.of(context).colorScheme;
-    return SingleChildScrollView(
+    return SingleChildScrollView(padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-      padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
+      child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: List.generate(2, (_) => Expanded(
-      child: Row(
+        child: Column(children: List.generate(4, (_) => Container(margin: const EdgeInsets.only(bottom: 8),
-        crossAxisAlignment: CrossAxisAlignment.start,
+          decoration: BoxDecoration(color: colors.surface, borderRadius: BorderRadius.circular(10),
-        children: List.generate(2, (_) => Expanded(
+              boxShadow: [BoxShadow(color: Colors.black.withValues(alpha: 0.04), blurRadius: 6, offset: const Offset(0, 2))]),
-          child: Column(
+          child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
-            children: List.generate(4, (_) => Container(
+            const ShimmerSkeleton(width: double.infinity, height: 140, borderRadius: 10),
-              margin: const EdgeInsets.only(bottom: 8),
+            Padding(padding: const EdgeInsets.all(10), child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
-              decoration: BoxDecoration(
+              const ShimmerSkeleton(width: double.infinity, height: 14), const SizedBox(height: 6),
-                color: colors.surface,
+              const ShimmerSkeleton(width: double.infinity, height: 12), const SizedBox(height: 6),
-                borderRadius: BorderRadius.circular(10),
+              const ShimmerSkeleton(width: 60, height: 10),
-                boxShadow: [
+            ])),
-                  BoxShadow(color: Colors.black.withValues(alpha: 0.04), blurRadius: 6, offset: const Offset(0, 2)),
+          ]),
-                ],
+        ))),
-              ),
+      ))),
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  const ShimmerSkeleton(width: double.infinity, height: 140, borderRadius: 10),
-                  Padding(
-                    padding: const EdgeInsets.all(10),
-                    child: Column(
-                      crossAxisAlignment: CrossAxisAlignment.start,
-                      children: [
-                        const ShimmerSkeleton(width: double.infinity, height: 14),
-                        const SizedBox(height: 6),
-                        const ShimmerSkeleton(width: double.infinity, height: 12),
-                        const SizedBox(height: 6),
-                        const ShimmerSkeleton(width: 60, height: 10),
-                      ],
-                    ),
-                  ),
-                ],
-              ),
-            )),
-          ),
-        )),
-      ),
     );
   }
 
   Widget _buildListView() {
     final colors = Theme.of(context).colorScheme;
-    return RefreshIndicator(
+    return RefreshIndicator(onRefresh: _refresh, color: colors.primary, backgroundColor: colors.surface,
-      onRefresh: _refresh,
+      child: ListView.builder(controller: _scrollController, padding: const EdgeInsets.fromLTRB(12, 10, 12, 100),
-      color: colors.primary,
+        itemCount: _items.length + (_hasMore ? 1 : 0),
-      backgroundColor: colors.surface,
-      child: ListView.builder(
-        controller: _scrollController,
-        padding: const EdgeInsets.fromLTRB(12, 10, 12, 100),
-        itemCount: _displayedNotes.length + (_hasMore ? 1 : 0),
         itemBuilder: (context, index) {
-          if (index >= _displayedNotes.length) {
+          if (index >= _items.length) return _buildLoadMore();
-            return Padding(
+          return NoteListItem(note: _items[index]);
-              padding: const EdgeInsets.symmetric(vertical: 16),
-              child: Center(
-                child: SizedBox(
-                  width: 20, height: 20,
-                  child: CircularProgressIndicator(strokeWidth: 2, color: colors.primary),
-                ),
-              ),
-            );
-          }
-          return NoteListItem(note: _displayedNotes[index]);
         },
       ),
     );
@@ -231,25 +144,12 @@ class _NoteTabPageState extends State<NoteTabPage> {
 
   Widget _buildTimelineView() {
     final colors = Theme.of(context).colorScheme;
-    return RefreshIndicator(
+    return RefreshIndicator(onRefresh: _refresh, color: colors.primary, backgroundColor: colors.surface,
-      onRefresh: _refresh,
+      child: ListView.builder(controller: _scrollController, padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-      color: colors.primary,
+        itemCount: _items.length + (_hasMore ? 1 : 0),
-      backgroundColor: colors.surface,
-      child: ListView.builder(
-        controller: _scrollController,
-        padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-        itemCount: _displayedNotes.length + (_hasMore ? 1 : 0),
         itemBuilder: (context, index) {
-          if (index >= _displayedNotes.length) {
+          if (index >= _items.length) return _buildLoadMore();
-            return Padding(
+          return _buildTimelineItem(_items[index]);
-              padding: const EdgeInsets.symmetric(vertical: 16),
-              child: Center(
-                child: SizedBox(width: 20, height: 20,
-                    child: CircularProgressIndicator(strokeWidth: 2, color: colors.primary)),
-              ),
-            );
-          }
-          return _buildTimelineItem(_displayedNotes[index]);
         },
       ),
     );
@@ -258,127 +158,54 @@ class _NoteTabPageState extends State<NoteTabPage> {
   Widget _buildTimelineItem(Note note) {
     final colors = Theme.of(context).colorScheme;
     return GestureDetector(
-      onTap: () {
+      onTap: () => Navigator.pushNamed(context, '/note-detail', arguments: note).then((_) => _loadFirst()),
-        Navigator.pushNamed(context, '/note-detail', arguments: note).then((_) async {
-          await context.read<AppProvider>().loadNotes();
-        });
-      },
       onLongPress: () => _showDeleteDialog(context, note),
-      child: IntrinsicHeight(
+      child: IntrinsicHeight(child: Row(crossAxisAlignment: CrossAxisAlignment.stretch, children: [
-        child: Row(
+        SizedBox(width: 40, child: Column(children: [
-          crossAxisAlignment: CrossAxisAlignment.stretch,
+          Container(width: 10, height: 10,
-          children: [
+              decoration: BoxDecoration(color: colors.primary, shape: BoxShape.circle, border: Border.all(color: colors.surface, width: 2))),
-            SizedBox(
+          Expanded(child: Container(width: 1, color: colors.outline)),
-              width: 40,
+        ])),
-              child: Column(
+        Expanded(child: Container(margin: const EdgeInsets.only(bottom: 16), padding: const EdgeInsets.all(14),
-                children: [
+          decoration: BoxDecoration(color: colors.surfaceContainerHigh, borderRadius: BorderRadius.circular(12)),
-                  Container(
+          child: Column(crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min, children: [
-                    width: 10,
+            Text(_formatFullDate(note.updatedAt), style: TextStyle(fontSize: 11, color: colors.onSurface.withValues(alpha: 0.4))),
-                    height: 10,
+            if (note.title.isNotEmpty) ...[const SizedBox(height: 6),
-                    decoration: BoxDecoration(
+              Text(note.title, style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.onSurface), maxLines: 1, overflow: TextOverflow.ellipsis),
-                      color: colors.primary,
+            ],
-                      shape: BoxShape.circle,
+            const SizedBox(height: 6),
-                      border: Border.all(color: colors.surface, width: 2),
+            Text(_getPreviewText(note), maxLines: 2, overflow: TextOverflow.ellipsis,
-                    ),
+                style: TextStyle(fontSize: 13, color: colors.onSurface.withValues(alpha: 0.5), height: 1.5)),
-                  ),
+            if (note.tags.isNotEmpty) ...[const SizedBox(height: 8),
-                  Expanded(
+              Wrap(spacing: 6, runSpacing: 4, children: note.tags.map((tag) => Container(
-                    child: Container(
+                padding: const EdgeInsets.symmetric(horizontal: 7, vertical: 2),
-                      width: 1,
+                decoration: BoxDecoration(color: colors.surface, borderRadius: BorderRadius.circular(4)),
-                      color: colors.outline,
+                child: Text(tag, style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.4))),
-                    ),
+              )).toList()),
-                  ),
+            ],
-                ],
+          ]),
-              ),
+        )),
-            ),
+      ])),
-            Expanded(
-              child: Container(
-                margin: const EdgeInsets.only(bottom: 16),
-                padding: const EdgeInsets.all(14),
-                decoration: BoxDecoration(
-                  color: colors.surfaceContainerHigh,
-                  borderRadius: BorderRadius.circular(12),
-                ),
-                child: Column(
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  mainAxisSize: MainAxisSize.min,
-                  children: [
-                    Text(
-                      _formatFullDate(note.updatedAt),
-                      style: TextStyle(fontSize: 11, color: colors.onSurface.withValues(alpha: 0.4)),
-                    ),
-                    if (note.title.isNotEmpty) ...[
-                      const SizedBox(height: 6),
-                      Text(
-                        note.title,
-                        style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.onSurface),
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                      ),
-                    ],
-                    const SizedBox(height: 6),
-                    Text(
-                      _getPreviewText(note),
-                      maxLines: 2,
-                      overflow: TextOverflow.ellipsis,
-                      style: TextStyle(fontSize: 13, color: colors.onSurface.withValues(alpha: 0.5), height: 1.5),
-                    ),
-                    if (note.tags.isNotEmpty) ...[
-                      const SizedBox(height: 8),
-                      Wrap(
-                        spacing: 6,
-                        runSpacing: 4,
-                        children: note.tags.map((tag) => Container(
-                          padding: const EdgeInsets.symmetric(horizontal: 7, vertical: 2),
-                          decoration: BoxDecoration(
-                            color: colors.surface,
-                            borderRadius: BorderRadius.circular(4),
-                          ),
-                          child: Text(tag, style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.4))),
-                        )).toList(),
-                      ),
-                    ],
-                  ],
-                ),
-              ),
-            ),
-          ],
-        ),
-      ),
     );
   }
 
-  String _formatFullDate(DateTime date) {
+  String _formatFullDate(DateTime date) =>
-    return '${date.year}-${date.month.toString().padLeft(2, '0')}-${date.day.toString().padLeft(2, '0')} '
+      '${date.year}-${date.month.toString().padLeft(2, '0')}-${date.day.toString().padLeft(2, '0')} ${date.hour.toString().padLeft(2, '0')}:${date.minute.toString().padLeft(2, '0')}';
-        '${date.hour.toString().padLeft(2, '0')}:${date.minute.toString().padLeft(2, '0')}';
-  }
 
   Widget _buildWaterfallView() {
     final colors = Theme.of(context).colorScheme;
     final leftItems = <Note>[];
     final rightItems = <Note>[];
-    for (int i = 0; i < _displayedNotes.length; i++) {
+    for (int i = 0; i < _items.length; i++) {
-      if (i % 2 == 0) {
+      (i % 2 == 0 ? leftItems : rightItems).add(_items[i]);
-        leftItems.add(_displayedNotes[i]);
-      } else {
-        rightItems.add(_displayedNotes[i]);
-      }
     }
-
+    return RefreshIndicator(onRefresh: _refresh, color: colors.primary, backgroundColor: colors.surface,
-    return RefreshIndicator(
+      child: SingleChildScrollView(controller: _scrollController, padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-      onRefresh: _refresh,
+        child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
-      color: colors.primary,
+          Expanded(child: Column(children: [...leftItems.map(_buildWaterfallCard), if (_hasMore) _buildLoadMore()])),
-      backgroundColor: colors.surface,
+          const SizedBox(width: 8),
-      child: SingleChildScrollView(
+          Expanded(child: Column(children: rightItems.map(_buildWaterfallCard).toList())),
-        controller: _scrollController,
+        ]),
-        padding: const EdgeInsets.fromLTRB(12, 8, 12, 100),
-        child: Row(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            Expanded(child: Column(children: leftItems.map((n) => _buildWaterfallCard(n)).toList())),
-            const SizedBox(width: 8),
-            Expanded(child: Column(children: rightItems.map((n) => _buildWaterfallCard(n)).toList())),
-          ],
-        ),
       ),
     );
   }
@@ -389,137 +216,56 @@ class _NoteTabPageState extends State<NoteTabPage> {
     final images = note.images;
     final hasImage = images.isNotEmpty;
     final extraCount = images.length - 1;
-
     return GestureDetector(
-      onTap: () {
+      onTap: () => Navigator.pushNamed(context, '/note-detail', arguments: note).then((_) => _loadFirst()),
-        Navigator.pushNamed(context, '/note-detail', arguments: note).then((_) async {
-          await context.read<AppProvider>().loadNotes();
-        });
-      },
       onLongPress: () => _showDeleteDialog(context, note),
-      child: Container(
+      child: Container(margin: const EdgeInsets.only(bottom: 8),
-        margin: const EdgeInsets.only(bottom: 8),
+        decoration: BoxDecoration(color: colors.surface, borderRadius: BorderRadius.circular(10),
-        decoration: BoxDecoration(
+            boxShadow: [BoxShadow(color: Colors.black.withValues(alpha: 0.04), blurRadius: 6, offset: const Offset(0, 2))]),
-          color: colors.surface,
-          borderRadius: BorderRadius.circular(10),
-          boxShadow: [
-            BoxShadow(
-              color: Colors.black.withValues(alpha: 0.04),
-              blurRadius: 6,
-              offset: const Offset(0, 2),
-            ),
-          ],
-        ),
         clipBehavior: Clip.antiAlias,
-        child: Column(
+        child: Column(crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min, children: [
-          crossAxisAlignment: CrossAxisAlignment.start,
+          if (hasImage) Stack(children: [
-          mainAxisSize: MainAxisSize.min,
+            ClipRRect(borderRadius: const BorderRadius.vertical(top: Radius.circular(10)),
-          children: [
+                child: FadeInLocalImage(path: images.first, fit: BoxFit.cover, errorWidget: const SizedBox.shrink())),
-            if (hasImage)
+            if (extraCount > 0) Positioned(top: 6, right: 6,
-              Stack(
+              child: Container(padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
-                children: [
+                decoration: BoxDecoration(color: Colors.black.withValues(alpha: 0.45), borderRadius: BorderRadius.circular(10)),
-                  ClipRRect(
+                child: Text('+$extraCount', style: const TextStyle(fontSize: 11, color: Colors.white, fontWeight: FontWeight.w600)),
-                    borderRadius: const BorderRadius.vertical(top: Radius.circular(10)),
-                    child: FadeInLocalImage(
-                      path: images.first,
-                      fit: BoxFit.cover,
-                      errorWidget: const SizedBox.shrink(),
-                    ),
-                  ),
-                  if (extraCount > 0)
-                    Positioned(
-                      top: 6,
-                      right: 6,
-                      child: Container(
-                        padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
-                        decoration: BoxDecoration(
-                          color: Colors.black.withValues(alpha: 0.45),
-                          borderRadius: BorderRadius.circular(10),
-                        ),
-                        child: Text(
-                          '+$extraCount',
-                          style: const TextStyle(fontSize: 11, color: Colors.white, fontWeight: FontWeight.w600),
-                        ),
-                      ),
-                    ),
-                ],
-              ),
-            Padding(
-              padding: const EdgeInsets.fromLTRB(10, 8, 10, 10),
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  if (note.title.isNotEmpty)
-                    Text(
-                      note.title,
-                      maxLines: 2,
-                      overflow: TextOverflow.ellipsis,
-                      style: TextStyle(
-                        fontSize: 13,
-                        fontWeight: FontWeight.w600,
-                        color: colors.onSurface,
-                        height: 1.3,
-                      ),
-                    ),
-                  if (contentText.isNotEmpty && contentText != '(无内容)') ...[
-                    if (note.title.isNotEmpty) const SizedBox(height: 4),
-                    Text(
-                      contentText,
-                      maxLines: 2,
-                      overflow: TextOverflow.ellipsis,
-                      style: TextStyle(
-                        fontSize: 11,
-                        color: colors.onSurface.withValues(alpha: 0.4),
-                        height: 1.4,
-                      ),
-                    ),
-                  ],
-                  const SizedBox(height: 6),
-                  Row(
-                    children: [
-                      Expanded(
-                        child: Text(
-                          _formatTime(note.updatedAt),
-                          style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.25)),
-                        ),
-                      ),
-                      if (note.tags.isNotEmpty)
-                        Container(
-                          padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 1),
-                          decoration: BoxDecoration(
-                            color: colors.surfaceContainerHighest,
-                            borderRadius: BorderRadius.circular(3),
-                          ),
-                          child: Text(
-                            note.tags.first,
-                            style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.4)),
-                          ),
-                        ),
-                    ],
-                  ),
-                ],
               ),
             ),
-          ],
+          ]),
-        ),
+          Padding(padding: const EdgeInsets.fromLTRB(10, 8, 10, 10),
+            child: Column(crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min, children: [
+              if (note.title.isNotEmpty) Text(note.title, maxLines: 2, overflow: TextOverflow.ellipsis,
+                  style: TextStyle(fontSize: 13, fontWeight: FontWeight.w600, color: colors.onSurface, height: 1.3)),
+              if (contentText.isNotEmpty && contentText != '(无内容)') ...[
+                if (note.title.isNotEmpty) const SizedBox(height: 4),
+                Text(contentText, maxLines: 2, overflow: TextOverflow.ellipsis,
+                    style: TextStyle(fontSize: 11, color: colors.onSurface.withValues(alpha: 0.4), height: 1.4)),
+              ],
+              const SizedBox(height: 6),
+              Row(children: [
+                Expanded(child: Text(_formatTime(note.updatedAt),
+                    style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.25)))),
+                if (note.tags.isNotEmpty) Container(padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 1),
+                  decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(3)),
+                  child: Text(note.tags.first, style: TextStyle(fontSize: 10, color: colors.onSurface.withValues(alpha: 0.4))),
+                ),
+              ]),
+            ]),
+          ),
+        ]),
       ),
     );
   }
 
   String _getPreviewText(Note note) {
-    final text = note.content
+    final text = note.content.replaceAll(RegExp(r'[#*\[\]\(\)]'), '').trim();
-        .replaceAll(RegExp(r'#'), '')
-        .replaceAll(RegExp(r'\*'), '')
-        .replaceAll(RegExp(r'`'), '')
-        .replaceAll(RegExp(r'[\[\]\(\)]'), '')
-        .trim();
     return text.isEmpty ? '(无内容)' : text;
   }
 
   String _formatTime(DateTime date) {
-    final now = DateTime.now();
+    final diff = DateTime.now().difference(date);
-    final diff = now.difference(date);
     if (diff.inMinutes < 1) return '刚刚';
     if (diff.inHours < 1) return '${diff.inMinutes}分钟前';
     if (diff.inDays < 1) return '${diff.inHours}小时前';
@@ -527,102 +273,47 @@ class _NoteTabPageState extends State<NoteTabPage> {
     return '${date.year}-${date.month.toString().padLeft(2, '0')}-${date.day.toString().padLeft(2, '0')}';
   }
 
-  void _showDeleteDialog(BuildContext context, Note note) {
+  Widget _buildLoadMore() {
-    final colors = Theme.of(context).colorScheme;
+    return Padding(padding: const EdgeInsets.symmetric(vertical: 20),
-    showDialog(
+      child: Center(child: _isLoading
-      context: context,
+          ? SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: Theme.of(context).colorScheme.primary))
-      builder: (context) => AlertDialog(
+          : Text('没有更多了', style: TextStyle(fontSize: 12, color: Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.3)))),
-        backgroundColor: colors.surface,
-        elevation: 0,
-        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-        title: Text('确认删除', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: colors.onSurface)),
-        content: Text('确定要删除这条笔记吗？删除后可在回收站恢复。',
-            style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6), height: 1.5)),
-        actions: [
-          TextButton(
-            onPressed: () => Navigator.pop(context),
-            style: TextButton.styleFrom(
-              foregroundColor: colors.onSurface.withValues(alpha: 0.6),
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-            ),
-            child: const Text('取消'),
-          ),
-          ElevatedButton(
-            onPressed: () async {
-              await context.read<AppProvider>().removeNote(note.id);
-              Navigator.pop(context);
-            },
-            style: ElevatedButton.styleFrom(
-              backgroundColor: colors.error,
-              foregroundColor: colors.onError,
-              elevation: 0,
-              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
-              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-            ),
-            child: const Text('删除'),
-          ),
-        ],
-        actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
-      ),
     );
   }
 
-  void _syncDisplayedNotes(List<Note> allNotes) {
+  void _showDeleteDialog(BuildContext context, Note note) {
-    final validNoteIds = allNotes.map((n) => n.id).toSet();
+    final colors = Theme.of(context).colorScheme;
-    final initialLength = _displayedNotes.length;
+    showDialog(context: context, builder: (ctx) => AlertDialog(
-    _displayedNotes.removeWhere((note) => !validNoteIds.contains(note.id));
+      backgroundColor: colors.surface, elevation: 0, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-
+      title: Text('确认删除', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: colors.onSurface)),
-    final displayedIds = _displayedNotes.map((n) => n.id).toSet();
+      content: Text('确定要删除这条笔记吗？删除后可在回收站恢复。',
-    final hasNewNotes = allNotes.any((note) => !displayedIds.contains(note.id));
+          style: TextStyle(fontSize: 14, color: colors.onSurface.withValues(alpha: 0.6), height: 1.5)),
-
+      actions: [
-    bool hasUpdates = false;
+        TextButton(onPressed: () => Navigator.pop(ctx), child: Text('取消', style: TextStyle(color: colors.onSurface.withValues(alpha: 0.6)))),
-    for (int i = 0; i < _displayedNotes.length; i++) {
+        ElevatedButton(onPressed: () async { await context.read<AppProvider>().removeNote(note.id); Navigator.pop(ctx); _loadFirst(); },
-      final localNote = _displayedNotes[i];
+          style: ElevatedButton.styleFrom(backgroundColor: colors.error, foregroundColor: colors.onError, elevation: 0,
-      final providerNote = allNotes.firstWhere((n) => n.id == localNote.id);
+              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)), padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8)),
-      if (localNote.updatedAt != providerNote.updatedAt) {
+          child: const Text('删除'),
-        hasUpdates = true;
+        ),
-        break;
+      ],
-      }
+      actionsPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
-    }
+    ));
-
-    if (_displayedNotes.length < initialLength || hasNewNotes || hasUpdates) {
-      _displayedNotes.clear();
-      _displayedNotes.addAll(allNotes);
-      _hasMore = false;
-    }
   }
 
   Widget _buildEmptyState(BuildContext context) {
     final colors = Theme.of(context).colorScheme;
-    return Center(
+    return Center(child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
-      child: Column(
+      Container(width: 80, height: 80,
-        mainAxisAlignment: MainAxisAlignment.center,
+          decoration: BoxDecoration(color: colors.surfaceContainerHighest, borderRadius: BorderRadius.circular(20)),
-        children: [
+          child: Icon(Icons.note_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25))),
-          Container(
+      const SizedBox(height: 20),
-            width: 80, height: 80,
+      Text('暂无笔记', style: TextStyle(fontSize: 16, color: colors.onSurface.withValues(alpha: 0.4))),
-            decoration: BoxDecoration(
+      const SizedBox(height: 24),
-              color: colors.surfaceContainerHighest,
+      InkWell(onTap: () => Navigator.pushNamed(context, '/note-form'),
-              borderRadius: BorderRadius.circular(20),
+        child: Container(padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
-            ),
+            decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(8)),
-            child: Icon(Icons.note_outlined, size: 40, color: colors.onSurface.withValues(alpha: 0.25)),
+            child: Text('添加记录', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: colors.onPrimary))),
-          ),
-          const SizedBox(height: 20),
-          Text('暂无笔记', style: TextStyle(fontSize: 16, color: colors.onSurface.withValues(alpha: 0.4))),
-          const SizedBox(height: 24),
-          InkWell(
-            onTap: () => Navigator.pushNamed(context, '/note-form'),
-            child: Container(
-              padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
-              decoration: BoxDecoration(
-                color: colors.primary,
-                borderRadius: BorderRadius.circular(8),
-              ),
-              child: Text('添加记录',
-                  style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: colors.onPrimary)),
-            ),
-          ),
-        ],
       ),
-    );
+    ]));
   }
 }

lib/pages/profile_page.dart

@@ -10,6 +10,7 @@ import '../utils/user_prefs.dart';
 import '../utils/toast_util.dart';
 import 'recycle_bin_page.dart';
 import 'sync/backup_page.dart';
+import '../widgets/fade_in_local_image.dart';
 import 'statistics_page.dart';
 import 'sync/cloud_sync_page.dart';
 import 'app_icon_picker_page.dart';
@@ -129,8 +130,8 @@ class _ProfilePageState extends State<ProfilePage> {
                       ),
                       clipBehavior: Clip.antiAlias,
                       child: _avatarPath != null && _avatarPath!.isNotEmpty
-                          ? Image.file(File(_avatarPath!), fit: BoxFit.cover,
+                          ? FadeInLocalImage(path: _avatarPath, fit: BoxFit.cover,
-                              errorBuilder: (_, __, ___) => Icon(Icons.person_outline, size: 32, color: colors.onSurface.withValues(alpha: 0.25)))
+                              errorWidget: Icon(Icons.person_outline, size: 32, color: colors.onSurface.withValues(alpha: 0.25)))
                           : Icon(Icons.person_outline, size: 32, color: colors.onSurface.withValues(alpha: 0.25)),
                     ),
                   ),

lib/pages/search_page.dart

@@ -7,6 +7,7 @@ import '../models/data_models.dart';
 import 'movies/movie_detail_page.dart';
 import 'book/book_detail_page.dart';
 import 'note/note_detail_page.dart';
+import '../widgets/fade_in_local_image.dart';
 
 /// 搜索页面
 class SearchPage extends StatefulWidget {
@@ -379,7 +380,8 @@ class _SearchPageState extends State<SearchPage> {
       decoration: BoxDecoration(color: colors.outlineVariant, borderRadius: BorderRadius.circular(6)),
       clipBehavior: Clip.antiAlias,
       child: path != null && path.isNotEmpty
-          ? Image.file(File(path), fit: BoxFit.cover, errorBuilder: (_, __, ___) => Icon(fallback, size: 20, color: colors.onSurface.withValues(alpha: 0.25)))
+          ? FadeInLocalImage(path: path, fit: BoxFit.cover,
+              errorWidget: Icon(fallback, size: 20, color: colors.onSurface.withValues(alpha: 0.25)))
           : Icon(fallback, size: 20, color: colors.onSurface.withValues(alpha: 0.25)),
     );
   }

lib/pages/stroll_page.dart

@@ -5,6 +5,7 @@ import 'package:provider/provider.dart';
 import '../providers/app_provider.dart';
 import '../models/data_models.dart';
 import '../widgets/animated_star_rating.dart';
+import '../widgets/fade_in_local_image.dart';
 
 /// 漫步页面 - 随机发现内容
 class StrollPage extends StatefulWidget {
@@ -190,7 +191,7 @@ class _StrollPageState extends State<StrollPage> with SingleTickerProviderStateM
                   style: TextStyle(fontSize: 15, color: colors.onSurface.withValues(alpha: 0.3), height: 1.6)))
           : Consumer<AppProvider>(builder: (context, provider, _) {
               final item = _currentItem!;
-              final hasImage = item.imagePath != null && item.imagePath!.isNotEmpty && File(item.imagePath!).existsSync();
+              final hasImage = item.imagePath != null && item.imagePath!.isNotEmpty;
 
               return FadeTransition(
                 opacity: _fadeAnim,
@@ -298,8 +299,7 @@ class _StrollPageState extends State<StrollPage> with SingleTickerProviderStateM
       ),
       clipBehavior: Clip.antiAlias,
       child: hasImage
-          ? Image.file(File(item.imagePath!), fit: BoxFit.cover,
+          ? FadeInLocalImage(path: item.imagePath, fit: BoxFit.cover)
-              errorBuilder: (_, __, ___) => _buildPlaceholder(item))
           : _buildPlaceholder(item),
     );
   }
@@ -321,8 +321,7 @@ class _StrollPageState extends State<StrollPage> with SingleTickerProviderStateM
         mainAxisSize: MainAxisSize.min,
         children: [
           if (hasImage)
-            Image.file(File(item.imagePath!), fit: BoxFit.cover, height: 200, width: double.infinity,
+            FadeInLocalImage(path: item.imagePath, fit: BoxFit.cover, height: 200, width: double.infinity),
-                errorBuilder: (_, __, ___) => const SizedBox.shrink()),
           Padding(
             padding: const EdgeInsets.all(20),
             child: Text(item.detail.isEmpty ? '(无内容)' : item.detail,

lib/pages/sync/cloud_sync_page.dart

@@ -31,7 +31,6 @@ class CloudSyncPage extends StatelessWidget {
             icon: Icons.sync_outlined,
             title: '服务端实时同步',
             subtitle: '自建服务端，多设备数据实时同步',
-            enabled: false,
             onTap: () =>
                 Navigator.push(context, MaterialPageRoute(builder: (_) => const ServerSyncPage())),
           ),

lib/pages/sync/server_sync_page.dart

@@ -117,7 +117,7 @@ class _ServerSyncPageState extends State<ServerSyncPage> {
       _startStatusPolling();
       await _prefs.setSyncEnabled(true);
       _syncEnabled = true;
-      await ServerSyncService.instance.uploadToServer();
+      await ServerSyncService.instance.syncWithServer();
       if (mounted) ToastUtil.show(context, '激活成功，实时同步已开启');
     } else {
       final error = result?['error'] ?? '激活失败';
@@ -126,31 +126,28 @@ class _ServerSyncPageState extends State<ServerSyncPage> {
   }
 
   Future<void> _toggleSync(bool value) async {
-    await _prefs.setSyncEnabled(value);
-    setState(() => _syncEnabled = value);
-
     if (value && _isActivated) {
-      await ServerSyncService.instance.uploadToServer();
+      // 开启同步：合并本地与服务端数据
+      await _prefs.setSyncEnabled(true);
+      setState(() => _syncEnabled = true);
+      if (mounted) ToastUtil.show(context, '正在同步数据...');
+      await ServerSyncService.instance.syncWithServer();
       final provider = context.read<AppProvider>();
       await provider.loadMovies();
       await provider.loadBooks();
       await provider.loadNotes();
-      if (mounted) ToastUtil.show(context, '已切换到服务端数据');
+      if (mounted) ToastUtil.show(context, '同步已开启，数据已合并');
     } else {
-      // 关闭同步：从服务端下载最新数据到本地
+      // 关闭同步：先合并最新数据，再切换到本地
-      if (mounted) ToastUtil.show(context, '正在从服务端同步数据...');
+      if (mounted) ToastUtil.show(context, '正在同步数据到本地...');
-      final success = await ServerSyncService.instance.downloadToLocal();
+      await ServerSyncService.instance.syncWithServer();
-      if (mounted) {
+      await _prefs.setSyncEnabled(false);
-        if (success) {
+      setState(() => _syncEnabled = false);
-          final provider = context.read<AppProvider>();
+      final provider = context.read<AppProvider>();
-          await provider.loadMovies();
+      await provider.loadMovies();
-          await provider.loadBooks();
+      await provider.loadBooks();
-          await provider.loadNotes();
+      await provider.loadNotes();
-          ToastUtil.show(context, '数据已下载到本地');
+      if (mounted) ToastUtil.show(context, '同步已关闭，已切换到本地数据');
-        } else {
-          ToastUtil.show(context, '下载失败，使用本地数据');
-        }
-      }
     }
   }
 

lib/providers/app_provider.dart

@@ -1,3 +1,4 @@
+import 'dart:io';
 import 'package:flutter/material.dart';
 import '../models/data_models.dart';
 import '../utils/movie/movie_dao.dart';
@@ -62,6 +63,12 @@ class AppProvider extends ChangeNotifier {
   
   // 初始化数据库
   Future<void> initDatabase() async {
+    debugPrint('[AppProvider] initDatabase, _useRemote=$_useRemote');
+    if (_useRemote) {
+      // 同步模式：从服务端拉取数据
+      await Future.wait([loadMovies(), loadBooks(), loadNotes()]);
+      return;
+    }
     final results = await Future.wait([
       _movieDao.getAllMovies(),
       _bookDao.getAllBooks(),
@@ -70,6 +77,7 @@ class AppProvider extends ChangeNotifier {
     _movies = results[0] as List<Movie>;
     _books = results[1] as List<Book>;
     _notes = results[2] as List<Note>;
+    debugPrint('[AppProvider] 本地数据: movies=${_movies.length}, books=${_books.length}, notes=${_notes.length}');
     notifyListeners();
   }
 
@@ -100,7 +108,9 @@ class AppProvider extends ChangeNotifier {
   // 加载影视数据
   Future<void> loadMovies() async {
     if (_useRemote) {
+      debugPrint('[AppProvider] loadMovies from server');
       _movies = await ServerDataService.instance.getMovies();
+      debugPrint('[AppProvider] server movies: ${_movies.length}');
       notifyListeners();
       return;
     }
@@ -111,18 +121,22 @@ class AppProvider extends ChangeNotifier {
   // 加载书籍数据
   Future<void> loadBooks() async {
     if (_useRemote) {
+      debugPrint('[AppProvider] loadBooks from server');
       _books = await ServerDataService.instance.getBooks();
+      debugPrint('[AppProvider] server books: ${_books.length}');
       notifyListeners();
       return;
     }
     _books = await _bookDao.getAllBooks();
     notifyListeners();
   }
-  
+
   // 加载笔记数据
   Future<void> loadNotes() async {
     if (_useRemote) {
+      debugPrint('[AppProvider] loadNotes from server');
       _notes = await ServerDataService.instance.getNotes();
+      debugPrint('[AppProvider] server notes: ${_notes.length}');
       notifyListeners();
       return;
     }
@@ -130,6 +144,30 @@ class AppProvider extends ChangeNotifier {
     notifyListeners();
   }
 
+  // ─── 分页加载（供列表页触底加载使用）────────────────────────
+  static const int _pageSize = 20;
+
+  Future<List<Movie>> loadMoviesPaged({String? status, required int offset}) async {
+    if (_useRemote) {
+      return ServerDataService.instance.getMovies(status: status, limit: _pageSize, offset: offset);
+    }
+    return _movieDao.getMoviesPaged(status: status, limit: _pageSize, offset: offset);
+  }
+
+  Future<List<Book>> loadBooksPaged({String? status, required int offset}) async {
+    if (_useRemote) {
+      return ServerDataService.instance.getBooks(status: status, limit: _pageSize, offset: offset);
+    }
+    return _bookDao.getBooksPaged(status: status, limit: _pageSize, offset: offset);
+  }
+
+  Future<List<Note>> loadNotesPaged({required int offset}) async {
+    if (_useRemote) {
+      return ServerDataService.instance.getNotes(limit: _pageSize, offset: offset);
+    }
+    return _noteDao.getNotesPaged(limit: _pageSize, offset: offset);
+  }
+
   // Getters
   int get mainTabIndex => _mainTabIndex;
   int get bottomNavIndex => _bottomNavIndex;
@@ -216,8 +254,13 @@ class AppProvider extends ChangeNotifier {
   Future<void> _uploadImagesIfRemote(List<String?> paths) async {
     if (!_useRemote) return;
     final valid = paths.where((p) => p != null && p!.isNotEmpty).cast<String>().toList();
-    if (valid.isNotEmpty) {
+    if (valid.isEmpty) return;
-      await ServerDataService.uploadLocalImages(valid);
+    final exist = <String>[];
+    for (final p in valid) {
+      if (File(p).existsSync()) exist.add(p);
+    }
+    if (exist.isNotEmpty) {
+      await ServerDataService.uploadLocalImages(exist);
     }
   }
 

lib/utils/book/book_dao.dart

@@ -19,6 +19,20 @@ class BookDao {
     return List.generate(maps.length, (i) => Book.fromJson(maps[i]));
   }
 
+  // 分页查询书籍记录
+  Future<List<Book>> getBooksPaged({String? status, int limit = 20, int offset = 0}) async {
+    final db = await _dbHelper.database;
+    String where = 'is_deleted = 0';
+    List<dynamic> whereArgs = [];
+    if (status != null && status.isNotEmpty) {
+      where += ' AND status = ?';
+      whereArgs.add(status);
+    }
+    final maps = await db.query('books', where: where, whereArgs: whereArgs,
+        orderBy: 'created_at DESC', limit: limit, offset: offset);
+    return List.generate(maps.length, (i) => Book.fromJson(maps[i]));
+  }
+
   // 根据状态筛选书籍记录
   Future<List<Book>> getBooksByStatus(String status) async {
     final db = await _dbHelper.database;

lib/utils/movie/movie_dao.dart

@@ -19,6 +19,20 @@ class MovieDao {
     return List.generate(maps.length, (i) => Movie.fromJson(maps[i]));
   }
 
+  // 分页查询影视记录
+  Future<List<Movie>> getMoviesPaged({String? status, int limit = 20, int offset = 0}) async {
+    final db = await _dbHelper.database;
+    String where = 'is_deleted = 0';
+    List<dynamic> whereArgs = [];
+    if (status != null && status.isNotEmpty) {
+      where += ' AND status = ?';
+      whereArgs.add(status);
+    }
+    final maps = await db.query('movies', where: where, whereArgs: whereArgs,
+        orderBy: 'created_at DESC', limit: limit, offset: offset);
+    return List.generate(maps.length, (i) => Movie.fromJson(maps[i]));
+  }
+
   // 根据状态筛选影视记录
   Future<List<Movie>> getMoviesByStatus(String status) async {
     final db = await _dbHelper.database;

lib/utils/note/note_dao.dart

@@ -19,6 +19,14 @@ class NoteDao {
     return List.generate(maps.length, (i) => Note.fromJson(maps[i]));
   }
 
+  // 分页查询笔记
+  Future<List<Note>> getNotesPaged({int limit = 20, int offset = 0}) async {
+    final db = await _dbHelper.database;
+    final maps = await db.query('notes', where: 'is_deleted = 0',
+        orderBy: 'created_at DESC', limit: limit, offset: offset);
+    return List.generate(maps.length, (i) => Note.fromJson(maps[i]));
+  }
+
   // 根据ID获取笔记
   Future<Note?> getNoteById(String id) async {
     final db = await _dbHelper.database;

lib/utils/sync/server_data_service.dart

@@ -26,19 +26,31 @@ class ServerDataService {
   bool get isAvailable => _baseUrl.isNotEmpty && _code.isNotEmpty;
 
   Future<dynamic> _post(String path, [Map<String, dynamic>? extra]) async {
-    final resp = await http.post(
+    try {
-      Uri.parse('$_baseUrl$path'),
+      final url = '$_baseUrl$path';
-      headers: _headers,
+      debugPrint('[ServerData] POST $url');
-      body: jsonEncode(_body(extra)),
+      final resp = await http.post(
-    ).timeout(const Duration(seconds: 30));
+        Uri.parse(url),
-    if (resp.statusCode != 200) return null;
+        headers: _headers,
-    return jsonDecode(resp.body);
+        body: jsonEncode(_body(extra)),
+      ).timeout(const Duration(seconds: 30));
+      debugPrint('[ServerData] ${resp.statusCode} $path');
+      if (resp.statusCode != 200) return null;
+      return jsonDecode(resp.body);
+    } catch (e) {
+      debugPrint('[ServerData] ERROR $path: $e');
+      return null;
+    }
   }
 
   // ─── 影视 ────────────────────────────────────────────────────
 
-  Future<List<Movie>> getMovies() async {
+  Future<List<Movie>> getMovies({String? status, int? limit, int? offset}) async {
-    final data = await _post('/api/data/movies');
+    final body = <String, dynamic>{};
+    if (status != null && status.isNotEmpty) body['status'] = status;
+    if (limit != null) body['limit'] = limit;
+    if (offset != null) body['offset'] = offset;
+    final data = await _post('/api/data/movies', body.isEmpty ? null : body);
     if (data == null || data['movies'] == null) return [];
     return (data['movies'] as List).map((m) => Movie.fromJson(m as Map<String, dynamic>)).toList();
   }
@@ -55,8 +67,12 @@ class ServerDataService {
 
   // ─── 书籍 ────────────────────────────────────────────────────
 
-  Future<List<Book>> getBooks() async {
+  Future<List<Book>> getBooks({String? status, int? limit, int? offset}) async {
-    final data = await _post('/api/data/books');
+    final body = <String, dynamic>{};
+    if (status != null && status.isNotEmpty) body['status'] = status;
+    if (limit != null) body['limit'] = limit;
+    if (offset != null) body['offset'] = offset;
+    final data = await _post('/api/data/books', body.isEmpty ? null : body);
     if (data == null || data['books'] == null) return [];
     return (data['books'] as List).map((b) => Book.fromJson(b as Map<String, dynamic>)).toList();
   }
@@ -73,8 +89,11 @@ class ServerDataService {
 
   // ─── 笔记 ────────────────────────────────────────────────────
 
-  Future<List<Note>> getNotes() async {
+  Future<List<Note>> getNotes({int? limit, int? offset}) async {
-    final data = await _post('/api/data/notes');
+    final body = <String, dynamic>{};
+    if (limit != null) body['limit'] = limit;
+    if (offset != null) body['offset'] = offset;
+    final data = await _post('/api/data/notes', body.isEmpty ? null : body);
     if (data == null || data['notes'] == null) return [];
     return (data['notes'] as List).map((n) => Note.fromJson(n as Map<String, dynamic>)).toList();
   }
@@ -89,6 +108,29 @@ class ServerDataService {
     return data != null;
   }
 
+  // ─── 批量同步 ────────────────────────────────────────────────
+
+  Future<Map<String, int>> batchSync({
+    List<Movie>? movies,
+    List<Book>? books,
+    List<Note>? notes,
+    List<Map<String, dynamic>>? tags,
+  }) async {
+    final data = await _post('/api/data/batch_sync', {
+      if (movies != null) 'movies': movies.map((m) => m.toJson()).toList(),
+      if (books != null) 'books': books.map((b) => b.toJson()).toList(),
+      if (notes != null) 'notes': notes.map((n) => n.toJson()).toList(),
+      if (tags != null) 'tags': tags,
+    });
+    if (data == null) return {};
+    return {
+      'movies': (data['movies'] as int?) ?? 0,
+      'books': (data['books'] as int?) ?? 0,
+      'notes': (data['notes'] as int?) ?? 0,
+      'tags': (data['tags'] as int?) ?? 0,
+    };
+  }
+
   // ─── 标签 ────────────────────────────────────────────────────
 
   Future<List<Map<String, dynamic>>> getTags(String? type) async {

lib/utils/sync/server_sync_service.dart

@@ -2,16 +2,21 @@ import 'dart:async';
 import 'dart:convert';
 import 'dart:io';
 import 'package:flutter/foundation.dart';
-import 'package:flutter/material.dart';
 import 'package:http/http.dart' as http;
 import 'package:path_provider/path_provider.dart';
 import 'package:path/path.dart' as p;
+import 'package:sqflite/sqflite.dart';
 import '../user_prefs.dart';
 import '../database_helper.dart';
+import '../../models/data_models.dart';
+import '../movie/movie_dao.dart';
+import '../book/book_dao.dart';
+import '../note/note_dao.dart';
+import 'server_data_service.dart';
 
 /// 服务端实时同步服务
-/// - 开启时：上传一次本地数据到服务器，后续 CRUD 走 API
+/// - 开启时：智能合并本地与服务端数据
-/// - 关闭时：从服务器下载数据到本地，切换本地数据库
+/// - 关闭时：从服务器下载数据到本地
 class ServerSyncService {
   static final ServerSyncService instance = ServerSyncService._();
   ServerSyncService._();
@@ -46,59 +51,131 @@ class ServerSyncService {
     try { final d = jsonDecode(s); return d is Map<String, dynamic> ? d : null; } catch (_) { return null; }
   }
 
-  /// 开启同步：上传本地数据到服务器
+  /// 开启同步：智能合并本地与服务端数据
-  Future<bool> uploadToServer() async {
+  Future<bool> syncWithServer() async {
     if (!isConfigured || _isSyncing) return false;
     _isSyncing = true;
     try {
-      final url = _prefs.syncServerUrl;
+      final server = ServerDataService.instance;
-      final code = _prefs.syncActivationCode;
-      final deviceId = _prefs.deviceId;
 
-      final dbPath = await DatabaseHelper.instance.databasePath;
+      // 读取本地数据
-      if (dbPath == null || !File(dbPath).existsSync()) {
+      final localMovies = await MovieDao().getAllMovies();
-        debugPrint('[Sync] 数据库文件不存在');
+      final localBooks = await BookDao().getAllBooks();
-        return false;
+      final localNotes = await NoteDao().getAllNotes();
-      }
 
-      final request = http.MultipartRequest('POST', Uri.parse('$url/api/sync/upload'));
+      // 读取服务端数据
-      request.fields['code'] = code;
+      final remoteMovies = await server.getMovies();
-      request.fields['device_id'] = deviceId;
+      final remoteBooks = await server.getBooks();
-      request.files.add(await http.MultipartFile.fromPath('database', dbPath));
+      final remoteNotes = await server.getNotes();
 
-      final appDir = await getApplicationDocumentsDirectory();
+      // 需要 push 到服务端的数据
-      final imgDir = Directory(p.join(appDir.path, 'images'));
+      final pushMovies = <Movie>[];
-      if (await imgDir.exists()) {
+      final pushBooks = <Book>[];
-        await for (final entity in imgDir.list(recursive: true)) {
+      final pushNotes = <Note>[];
-          if (entity is File) {
+      final imagePaths = <String>[];
-            final relPath = p.relative(entity.path, from: appDir.path).replaceAll('\\', '/');
+
-            request.files.add(await http.MultipartFile('images', entity.readAsBytes().asStream(), await entity.length(), filename: relPath));
+      // 服务端无数据 → 全量 push
+      if (remoteMovies.isEmpty && remoteBooks.isEmpty && remoteNotes.isEmpty) {
+        pushMovies.addAll(localMovies);
+        pushBooks.addAll(localBooks);
+        pushNotes.addAll(localNotes);
+      } else {
+        // 按 updated_at 合并
+        final remoteMovieMap = {for (final m in remoteMovies) m.id: m};
+        for (final m in localMovies) {
+          final r = remoteMovieMap.remove(m.id);
+          if (r == null || m.updatedAt.isAfter(r.updatedAt)) {
+            pushMovies.add(m);
+          } else {
+            await _upsertLocalMovie(m: r);
           }
         }
+        for (final r in remoteMovieMap.values) {
+          await _upsertLocalMovie(m: r);
+        }
+
+        final remoteBookMap = {for (final b in remoteBooks) b.id: b};
+        for (final b in localBooks) {
+          final r = remoteBookMap.remove(b.id);
+          if (r == null || b.updatedAt.isAfter(r.updatedAt)) {
+            pushBooks.add(b);
+          } else {
+            await _upsertLocalBook(b: r);
+          }
+        }
+        for (final r in remoteBookMap.values) {
+          await _upsertLocalBook(b: r);
+        }
+
+        final remoteNoteMap = {for (final n in remoteNotes) n.id: n};
+        for (final n in localNotes) {
+          final r = remoteNoteMap.remove(n.id);
+          if (r == null || n.updatedAt.isAfter(r.updatedAt)) {
+            pushNotes.add(n);
+          } else {
+            await _upsertLocalNote(n: r);
+          }
+        }
+        for (final r in remoteNoteMap.values) {
+          await _upsertLocalNote(n: r);
+        }
       }
 
-      final avatarsDir = Directory(p.join(appDir.path, 'avatars'));
+      // 批量 push 到服务端
-      if (await avatarsDir.exists()) {
+      if (pushMovies.isNotEmpty || pushBooks.isNotEmpty || pushNotes.isNotEmpty) {
-        await for (final entity in avatarsDir.list()) {
+        final db = await DatabaseHelper.instance.database;
-          if (entity is File) {
+        final localTags = await db.query('tags');
-            final relPath = p.relative(entity.path, from: appDir.path).replaceAll('\\', '/');
+        final result = await server.batchSync(
-            request.files.add(await http.MultipartFile('images', entity.readAsBytes().asStream(), await entity.length(), filename: relPath));
+          movies: pushMovies.isEmpty ? null : pushMovies,
-          }
+          books: pushBooks.isEmpty ? null : pushBooks,
+          notes: pushNotes.isEmpty ? null : pushNotes,
+          tags: localTags.isEmpty ? null : localTags.cast<Map<String, dynamic>>(),
+        );
+        debugPrint('[Sync] 批量推送: $result');
+
+        // 收集需要上传的图片
+        for (final m in pushMovies) {
+          if (m.posterPath != null && m.posterPath!.isNotEmpty) imagePaths.add(m.posterPath!);
+        }
+        for (final b in pushBooks) {
+          if (b.coverPath != null && b.coverPath!.isNotEmpty) imagePaths.add(b.coverPath!);
+        }
+        for (final n in pushNotes) {
+          imagePaths.addAll(n.images.where((i) => i.isNotEmpty));
         }
       }
 
-      final resp = await request.send().timeout(const Duration(seconds: 300));
+      // 上传图片
-      if (resp.statusCode == 200) {
+      if (imagePaths.isNotEmpty) {
-        debugPrint('[Sync] 上传成功');
+        debugPrint('[Sync] 上传 ${imagePaths.length} 张图片');
-        return true;
+        await ServerDataService.uploadLocalImages(imagePaths);
       }
-      debugPrint('[Sync] 上传失败 HTTP ${resp.statusCode}');
+
+      debugPrint('[Sync] 合并完成');
+      return true;
     } catch (e) {
-      debugPrint('[Sync] 上传异常: $e');
+      debugPrint('[Sync] 合并异常: $e');
+      return false;
     } finally {
       _isSyncing = false;
     }
-    return false;
+  }
+
+  // ─── 合并辅助方法 ────────────────────────────────────────────
+
+  Future<void> _upsertLocalMovie({required Movie m}) async {
+    final db = await DatabaseHelper.instance.database;
+    await db.insert('movies', m.toJson(), conflictAlgorithm: ConflictAlgorithm.replace);
+  }
+
+  Future<void> _upsertLocalBook({required Book b}) async {
+    final db = await DatabaseHelper.instance.database;
+    await db.insert('books', b.toJson(), conflictAlgorithm: ConflictAlgorithm.replace);
+  }
+
+  Future<void> _upsertLocalNote({required Note n}) async {
+    final db = await DatabaseHelper.instance.database;
+    await db.insert('notes', n.toJson(), conflictAlgorithm: ConflictAlgorithm.replace);
   }
 
   /// 关闭同步：从服务器下载数据到本地

lib/utils/usage_stats_service.dart

@@ -3,6 +3,7 @@ import 'dart:convert';
 import 'dart:io' show Platform;
 import 'dart:math';
 import 'package:flutter/material.dart';
+import 'package:flutter/foundation.dart';
 import 'package:http/http.dart' as http;
 import 'user_prefs.dart';
 
@@ -16,9 +17,10 @@ class UsageStatsService with WidgetsBindingObserver {
 
   final UserPrefs _prefs = UserPrefs();
 
-  /// 统计服务器地址，发布前替换为实际地址，置空则禁用
+  /// 统计服务器地址，debug 走局域网，release 走线上
-  static String serverUrl = 'http://api.mooknote.iletter.top/';
+  static String serverUrl = kDebugMode
-  // static String serverUrl = 'http://192.168.31.48:27050/';
+      ? 'http://192.168.31.48:27047/'
+      : 'http://api.mooknote.iletter.top/';
   Timer? _heartbeatTimer;
   bool _started = false;
 

lib/widgets/custom_drawer.dart

@@ -8,6 +8,7 @@ import '../pages/stroll_page.dart';
 import '../pages/markdown_reader/md_reader_tab_page.dart';
 import '../pages/tag_management_page.dart';
 import '../pages/profile_page.dart';
+import 'fade_in_local_image.dart';
 
 /// 自定义侧边栏
 class CustomDrawer extends StatefulWidget {
@@ -97,9 +98,8 @@ class _CustomDrawerState extends State<CustomDrawer> {
                     ),
                     clipBehavior: Clip.antiAlias,
                     child: avatarPath != null && avatarPath.isNotEmpty
-                        ? Image.file(File(avatarPath), fit: BoxFit.cover,
+                        ? FadeInLocalImage(path: avatarPath, fit: BoxFit.cover,
-                            errorBuilder: (_, __, ___) =>
+                            errorWidget: Icon(Icons.person_outline, size: 26, color: colors.onSurface.withValues(alpha: 0.3)))
-                                Icon(Icons.person_outline, size: 26, color: colors.onSurface.withValues(alpha: 0.3)))
                         : Icon(Icons.person_outline, size: 26, color: colors.onSurface.withValues(alpha: 0.3)),
                   ),
                   const SizedBox(width: 14),