mod: add skeleton

Signed-off-by: bggRGjQaUbCoE <githubaccount56556@proton.me>
2026-04-20 11:08:03 +08:00 · 2025-04-20 21:37:44 +08:00
parent abdde1f811
commit 95caf111ae
24 changed files with 740 additions and 347 deletions
--- a/lib/pages/msg_feed_top/at_me/view.dart
+++ b/lib/pages/msg_feed_top/at_me/view.dart
@@ -1,5 +1,6 @@
+import 'package:PiliPlus/common/skeleton/msg_feed_top.dart';
 import 'package:PiliPlus/common/widgets/dialog.dart';
-import 'package:PiliPlus/common/widgets/loading_widget.dart';
+import 'package:PiliPlus/common/widgets/http_error.dart';
 import 'package:PiliPlus/common/widgets/network_img_layer.dart';
 import 'package:PiliPlus/common/widgets/refresh_indicator.dart';
 import 'package:PiliPlus/http/loading_state.dart';
@@ -31,20 +32,31 @@ class _AtMePageState extends State<AtMePage> {
        onRefresh: () async {
          await _atMeController.onRefresh();
        },
-        child: Obx(() => _buildBody(_atMeController.loadingState.value)),
+        child: CustomScrollView(
+          physics: const AlwaysScrollableScrollPhysics(),
+          slivers: [
+            SliverPadding(
+              padding: EdgeInsets.only(
+                  bottom: MediaQuery.paddingOf(context).bottom + 80),
+              sliver: Obx(() => _buildBody(_atMeController.loadingState.value)),
+            ),
+          ],
+        ),
      ),
    );
  }

  Widget _buildBody(LoadingState<List<AtMeItems>?> loadingState) {
    return switch (loadingState) {
-      Loading() => loadingWidget,
+      Loading() => SliverList.builder(
+          itemCount: 12,
+          itemBuilder: (context, index) {
+            return const MsgFeedTopSkeleton();
+          },
+        ),
      Success() => loadingState.response?.isNotEmpty == true
-          ? ListView.separated(
+          ? SliverList.separated(
              itemCount: loadingState.response!.length,
-              physics: const AlwaysScrollableScrollPhysics(),
-              padding: EdgeInsets.only(
-                  bottom: MediaQuery.paddingOf(context).bottom + 80),
              itemBuilder: (context, int index) {
                if (index == loadingState.response!.length - 1) {
                  _atMeController.onLoadMore();
@@ -145,8 +157,8 @@ class _AtMePageState extends State<AtMePage> {
                );
              },
            )
-          : scrollErrorWidget(callback: _atMeController.onReload),
-      Error() => scrollErrorWidget(
+          : HttpError(callback: _atMeController.onReload),
+      Error() => HttpError(
          errMsg: loadingState.errMsg,
          callback: _atMeController.onReload,
        ),
--- a/lib/pages/msg_feed_top/like_me/view.dart
+++ b/lib/pages/msg_feed_top/like_me/view.dart
@@ -1,5 +1,6 @@
+import 'package:PiliPlus/common/skeleton/msg_feed_top.dart';
 import 'package:PiliPlus/common/widgets/dialog.dart';
-import 'package:PiliPlus/common/widgets/loading_widget.dart';
+import 'package:PiliPlus/common/widgets/http_error.dart';
 import 'package:PiliPlus/common/widgets/pair.dart';
 import 'package:PiliPlus/common/widgets/refresh_indicator.dart';
 import 'package:PiliPlus/http/loading_state.dart';
@@ -32,22 +33,36 @@ class _LikeMePageState extends State<LikeMePage> {
        onRefresh: () async {
          await _likeMeController.onRefresh();
        },
-        child: Obx(() => _buildBody(_likeMeController.loadingState.value)),
+        child: CustomScrollView(
+          physics: const AlwaysScrollableScrollPhysics(),
+          slivers: [
+            SliverPadding(
+              padding: EdgeInsets.only(
+                  bottom: MediaQuery.paddingOf(context).bottom + 80),
+              sliver:
+                  Obx(() => _buildBody(_likeMeController.loadingState.value)),
+            ),
+          ],
+        ),
      ),
    );
  }

  Widget _buildBody(LoadingState loadingState) {
    return switch (loadingState) {
-      Loading() => loadingWidget,
+      Loading() => SliverList.builder(
+          itemCount: 12,
+          itemBuilder: (context, index) {
+            return const MsgFeedTopSkeleton();
+          },
+        ),
      Success() => () {
          Pair<List<LikeMeItems>, List<LikeMeItems>> pair =
              loadingState.response;
          List<LikeMeItems> latest = pair.first;
          List<LikeMeItems> total = pair.second;
          if (latest.isNotEmpty || total.isNotEmpty) {
-            return CustomScrollView(
-              physics: const AlwaysScrollableScrollPhysics(),
+            return SliverMainAxisGroup(
              slivers: [
                if (latest.isNotEmpty) ...[
                  _buildHeader('最新'),
@@ -99,17 +114,12 @@ class _LikeMePageState extends State<LikeMePage> {
                    },
                  ),
                ],
-                SliverToBoxAdapter(
-                  child: SizedBox(
-                    height: MediaQuery.paddingOf(context).bottom + 80,
-                  ),
-                ),
              ],
            );
          }
-          return scrollErrorWidget(callback: _likeMeController.onReload);
+          return HttpError(callback: _likeMeController.onReload);
        }(),
-      Error() => scrollErrorWidget(
+      Error() => HttpError(
          errMsg: loadingState.errMsg,
          callback: _likeMeController.onReload,
        ),
@@ -118,14 +128,18 @@ class _LikeMePageState extends State<LikeMePage> {
  }

  Widget _buildHeader(String title) {
-    return SliverToBoxAdapter(
-      child: Padding(
-        padding: const EdgeInsets.only(left: 16),
-        child: Text(
-          title,
-          style: Theme.of(context).textTheme.labelLarge!.copyWith(
-                color: Theme.of(context).colorScheme.secondary,
-              ),
+    return SliverSafeArea(
+      top: false,
+      bottom: false,
+      sliver: SliverToBoxAdapter(
+        child: Padding(
+          padding: const EdgeInsets.only(left: 16),
+          child: Text(
+            title,
+            style: Theme.of(context).textTheme.labelLarge!.copyWith(
+                  color: Theme.of(context).colorScheme.secondary,
+                ),
+          ),
        ),
      ),
    );
--- a/lib/pages/msg_feed_top/reply_me/view.dart
+++ b/lib/pages/msg_feed_top/reply_me/view.dart
@@ -1,5 +1,6 @@
+import 'package:PiliPlus/common/skeleton/msg_feed_top.dart';
 import 'package:PiliPlus/common/widgets/dialog.dart';
-import 'package:PiliPlus/common/widgets/loading_widget.dart';
+import 'package:PiliPlus/common/widgets/http_error.dart';
 import 'package:PiliPlus/common/widgets/refresh_indicator.dart';
 import 'package:PiliPlus/http/loading_state.dart';
 import 'package:PiliPlus/models/msg/msgfeed_reply_me.dart';
@@ -29,20 +30,32 @@ class _ReplyMePageState extends State<ReplyMePage> {
        onRefresh: () async {
          await _replyMeController.onRefresh();
        },
-        child: Obx(() => _buildBody(_replyMeController.loadingState.value)),
+        child: CustomScrollView(
+          physics: const AlwaysScrollableScrollPhysics(),
+          slivers: [
+            SliverPadding(
+              padding: EdgeInsets.only(
+                  bottom: MediaQuery.paddingOf(context).bottom + 80),
+              sliver:
+                  Obx(() => _buildBody(_replyMeController.loadingState.value)),
+            ),
+          ],
+        ),
      ),
    );
  }

  Widget _buildBody(LoadingState<List<ReplyMeItems>?> loadingState) {
    return switch (loadingState) {
-      Loading() => loadingWidget,
+      Loading() => SliverList.builder(
+          itemCount: 12,
+          itemBuilder: (context, index) {
+            return const MsgFeedTopSkeleton();
+          },
+        ),
      Success() => loadingState.response?.isNotEmpty == true
-          ? ListView.separated(
+          ? SliverList.separated(
              itemCount: loadingState.response!.length,
-              physics: const AlwaysScrollableScrollPhysics(),
-              padding: EdgeInsets.only(
-                  bottom: MediaQuery.paddingOf(context).bottom + 80),
              itemBuilder: (context, int index) {
                if (index == loadingState.response!.length - 1) {
                  _replyMeController.onLoadMore();
@@ -165,8 +178,8 @@ class _ReplyMePageState extends State<ReplyMePage> {
                );
              },
            )
-          : scrollErrorWidget(callback: _replyMeController.onReload),
-      Error() => scrollErrorWidget(
+          : HttpError(callback: _replyMeController.onReload),
+      Error() => HttpError(
          errMsg: loadingState.errMsg,
          callback: _replyMeController.onReload,
        ),
--- a/lib/pages/msg_feed_top/sys_msg/view.dart
+++ b/lib/pages/msg_feed_top/sys_msg/view.dart
@@ -1,7 +1,8 @@
 import 'dart:convert';

+import 'package:PiliPlus/common/skeleton/msg_feed_sys_msg_.dart';
 import 'package:PiliPlus/common/widgets/dialog.dart';
-import 'package:PiliPlus/common/widgets/loading_widget.dart';
+import 'package:PiliPlus/common/widgets/http_error.dart';
 import 'package:PiliPlus/common/widgets/refresh_indicator.dart';
 import 'package:PiliPlus/http/loading_state.dart';
 import 'package:PiliPlus/models/msg/msgfeed_sys_msg.dart';
@@ -36,25 +37,36 @@ class _SysMsgPageState extends State<SysMsgPage> {
        onRefresh: () async {
          await _sysMsgController.onRefresh();
        },
-        child: Obx(() => _buildBody(_sysMsgController.loadingState.value)),
+        child: CustomScrollView(
+          physics: const AlwaysScrollableScrollPhysics(),
+          slivers: [
+            SliverPadding(
+              padding: EdgeInsets.only(
+                  bottom: MediaQuery.paddingOf(context).bottom + 80),
+              sliver:
+                  Obx(() => _buildBody(_sysMsgController.loadingState.value)),
+            ),
+          ],
+        ),
      ),
    );
  }

  Widget _buildBody(LoadingState<List<SystemNotifyList>?> loadingState) {
    return switch (loadingState) {
-      Loading() => loadingWidget,
+      Loading() => SliverList.builder(
+          itemCount: 12,
+          itemBuilder: (context, index) {
+            return const MsgFeedSysMsgSkeleton();
+          },
+        ),
      Success() => loadingState.response?.isNotEmpty == true
-          ? ListView.separated(
+          ? SliverList.separated(
              itemCount: loadingState.response!.length,
-              physics: const AlwaysScrollableScrollPhysics(),
-              padding: EdgeInsets.only(
-                  bottom: MediaQuery.paddingOf(context).bottom + 80),
              itemBuilder: (context, int index) {
                if (index == loadingState.response!.length - 1) {
                  _sysMsgController.onLoadMore();
                }
-
                final item = loadingState.response![index];
                String? content = item.content;
                if (content != null) {
@@ -124,8 +136,8 @@ class _SysMsgPageState extends State<SysMsgPage> {
                );
              },
            )
-          : scrollErrorWidget(callback: _sysMsgController.onReload),
-      Error() => scrollErrorWidget(
+          : HttpError(callback: _sysMsgController.onReload),
+      Error() => HttpError(
          errMsg: loadingState.errMsg,
          callback: _sysMsgController.onReload,
        ),