mod: 搜索页面样式

lib/common/skeleton/media_bangumi.dart

@@ -0,0 +1,79 @@
+import 'package:flutter/material.dart';
+import 'package:pilipala/common/constants.dart';
+
+import 'skeleton.dart';
+
+class MediaBangumiSkeleton extends StatefulWidget {
+  const MediaBangumiSkeleton({super.key});
+
+  @override
+  State<MediaBangumiSkeleton> createState() => _MediaBangumiSkeletonState();
+}
+
+class _MediaBangumiSkeletonState extends State<MediaBangumiSkeleton> {
+  @override
+  Widget build(BuildContext context) {
+    Color bgColor = Theme.of(context).colorScheme.onInverseSurface;
+    return Skeleton(
+      child: Padding(
+        padding: const EdgeInsets.fromLTRB(
+            StyleString.safeSpace, 7, StyleString.safeSpace, 7),
+        child: Row(
+          children: [
+            Container(
+              width: 111,
+              height: 148,
+              decoration: BoxDecoration(
+                  borderRadius: const BorderRadius.all(Radius.circular(6)),
+                  color: bgColor),
+            ),
+            const SizedBox(width: 10),
+            SizedBox(
+              height: 148,
+              child: Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Container(
+                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      width: 200,
+                      height: 20,
+                      margin: const EdgeInsets.only(bottom: 15),
+                    ),
+                    Container(
+                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      width: 150,
+                      height: 13,
+                      margin: const EdgeInsets.only(bottom: 5),
+                    ),
+                    Container(
+                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      width: 150,
+                      height: 13,
+                      margin: const EdgeInsets.only(bottom: 5),
+                    ),
+                    Container(
+                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      width: 150,
+                      height: 13,
+                    ),
+                    const Spacer(),
+                    Container(
+                      width: 90,
+                      height: 35,
+                      decoration: BoxDecoration(
+                        borderRadius:
+                            const BorderRadius.all(Radius.circular(20)),
+                        color: Theme.of(context).colorScheme.onInverseSurface,
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/common/skeleton/video_card_h.dart

@@ -8,15 +8,13 @@ class VideoCardHSkeleton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Skeleton(
-      child: Column(
+      child: Padding(
-        children: [
-          Padding(
         padding: const EdgeInsets.fromLTRB(
-                StyleString.cardSpace, 7, StyleString.cardSpace, 7),
+            StyleString.safeSpace, 7, StyleString.safeSpace, 7),
         child: LayoutBuilder(
           builder: (context, boxConstraints) {
             double width =
-                    (boxConstraints.maxWidth - StyleString.cardSpace * 6) / 2;
+                (boxConstraints.maxWidth - StyleString.cardSpace * 9) / 2;
             return SizedBox(
               height: width / StyleString.aspectRatio,
               child: Row(
@@ -29,11 +27,10 @@ class VideoCardHSkeleton extends StatelessWidget {
                       builder: (context, boxConstraints) {
                         return Container(
                           decoration: BoxDecoration(
-                                color: Theme.of(context)
+                            color:
-                                    .colorScheme
+                                Theme.of(context).colorScheme.onInverseSurface,
-                                    .onInverseSurface,
+                            borderRadius:
-                                borderRadius: BorderRadius.circular(
+                                BorderRadius.circular(StyleString.imgRadius.x),
-                                    StyleString.imgRadius.x),
                           ),
                         );
                       },
@@ -47,25 +44,19 @@ class VideoCardHSkeleton extends StatelessWidget {
                       crossAxisAlignment: CrossAxisAlignment.start,
                       children: [
                         Container(
-                              color: Theme.of(context)
+                          color: Theme.of(context).colorScheme.onInverseSurface,
-                                  .colorScheme
-                                  .onInverseSurface,
                           width: 200,
                           height: 11,
                           margin: const EdgeInsets.only(bottom: 5),
                         ),
                         Container(
-                              color: Theme.of(context)
+                          color: Theme.of(context).colorScheme.onInverseSurface,
-                                  .colorScheme
-                                  .onInverseSurface,
                           width: 150,
                           height: 13,
                         ),
                         const Spacer(),
                         Container(
-                              color: Theme.of(context)
+                          color: Theme.of(context).colorScheme.onInverseSurface,
-                                  .colorScheme
-                                  .onInverseSurface,
                           width: 100,
                           height: 13,
                           margin: const EdgeInsets.only(bottom: 5),
@@ -98,14 +89,6 @@ class VideoCardHSkeleton extends StatelessWidget {
           },
         ),
       ),
-          Divider(
-            height: 1,
-            indent: 8,
-            endIndent: 12,
-            color: Theme.of(context).dividerColor.withOpacity(0.08),
-          )
-        ],
-      ),
     );
   }
 }

lib/common/widgets/video_card_h.dart

@@ -56,11 +56,9 @@ class VideoCardH extends StatelessWidget {
             SmartDialog.showToast(err.toString());
           }
         },
-        child: Column(
+        child: Padding(
-          children: [
-            Padding(
           padding: const EdgeInsets.fromLTRB(
-                  StyleString.safeSpace, 6, StyleString.safeSpace, 6),
+              StyleString.safeSpace, 7, StyleString.safeSpace, 7),
           child: LayoutBuilder(
             builder: (context, boxConstraints) {
               double width =
@@ -92,8 +90,8 @@ class VideoCardH extends StatelessWidget {
                                   type: 'gray'),
                               if (videoItem.rcmdReason != null &&
                                   videoItem.rcmdReason.content != '')
-                                    pBadge(videoItem.rcmdReason.content,
+                                pBadge(videoItem.rcmdReason.content, context,
-                                        context, 6.0, 6.0, null, null),
+                                    6.0, 6.0, null, null),
                             ],
                           );
                         },
@@ -106,14 +104,6 @@ class VideoCardH extends StatelessWidget {
             },
           ),
         ),
-            // Divider(
-            //   height: 1,
-            //   indent: 8,
-            //   endIndent: 12,
-            //   color: Theme.of(context).dividerColor.withOpacity(0.08),
-            // )
-          ],
-        ),
       ),
     );
   }

lib/pages/search/view.dart

@@ -17,6 +17,13 @@ class SearchPage extends StatefulWidget {
 
 class _SearchPageState extends State<SearchPage> with RouteAware {
   final SSearchController _searchController = Get.put(SSearchController());
+  late Future? _futureBuilderFuture;
+
+  @override
+  void initState() {
+    super.initState();
+    _futureBuilderFuture = _searchController.queryHotSearchList();
+  }
 
   @override
   // 返回当前页面时
@@ -159,7 +166,7 @@ class _SearchPageState extends State<SearchPage> with RouteAware {
             builder: (context, boxConstraints) {
               final double width = boxConstraints.maxWidth;
               return FutureBuilder(
-                future: _searchController.queryHotSearchList(),
+                future: _futureBuilderFuture,
                 builder: (context, snapshot) {
                   if (snapshot.connectionState == ConnectionState.done) {
                     Map data = snapshot.data as Map;

lib/pages/searchPanel/view.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
+import 'package:pilipala/common/skeleton/media_bangumi.dart';
 import 'package:pilipala/common/skeleton/video_card_h.dart';
 import 'package:pilipala/common/widgets/http_error.dart';
 import 'package:pilipala/models/common/search_type.dart';
@@ -104,7 +105,18 @@ class _SearchPanelState extends State<SearchPanel>
               addRepaintBoundaries: false,
               itemCount: 15,
               itemBuilder: (context, index) {
+                switch (widget.searchType) {
+                  case SearchType.video:
                     return const VideoCardHSkeleton();
+                  case SearchType.media_bangumi:
+                    return const MediaBangumiSkeleton();
+                  case SearchType.bili_user:
+                    return const VideoCardHSkeleton();
+                  case SearchType.live_room:
+                    return const VideoCardHSkeleton();
+                  default:
+                    return const VideoCardHSkeleton();
+                }
               },
             );
           }

lib/pages/searchPanel/widgets/live_panel.dart

@@ -6,7 +6,7 @@ import 'package:pilipala/utils/utils.dart';
 Widget searchLivePanel(BuildContext context, ctr, list) {
   return Padding(
     padding: const EdgeInsets.only(
-        left: StyleString.cardSpace, right: StyleString.cardSpace),
+        left: StyleString.safeSpace, right: StyleString.safeSpace),
     child: GridView.builder(
       primary: false,
       controller: ctr!.scrollController,
@@ -16,11 +16,22 @@ Widget searchLivePanel(BuildContext context, ctr, list) {
         mainAxisSpacing: StyleString.cardSpace + 3,
         mainAxisExtent:
             MediaQuery.of(context).size.width / 2 / StyleString.aspectRatio +
-                65,
+                60,
       ),
       itemCount: list.length,
       itemBuilder: (context, index) {
-        var i = list![index];
+        return LiveItem(liveItem: list![index]);
+      },
+    ),
+  );
+}
+
+class LiveItem extends StatelessWidget {
+  final dynamic liveItem;
+  const LiveItem({Key? key, required this.liveItem}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
     return Card(
       elevation: 0,
       clipBehavior: Clip.hardEdge,
@@ -47,9 +58,9 @@ Widget searchLivePanel(BuildContext context, ctr, list) {
                   return Stack(
                     children: [
                       Hero(
-                            tag: Utils.makeHeroTag(i.roomid),
+                        tag: Utils.makeHeroTag(liveItem.roomid),
                         child: NetworkImgLayer(
-                              src: i.cover,
+                          src: liveItem.cover,
                           type: 'emote',
                           width: maxWidth,
                           height: maxHeight,
@@ -63,8 +74,8 @@ Widget searchLivePanel(BuildContext context, ctr, list) {
                           opacity: 1,
                           duration: const Duration(milliseconds: 200),
                           child: LiveStat(
-                                online: i.online,
+                            online: liveItem.online,
-                                cateName: i.cateName,
+                            cateName: liveItem.cateName,
                           ),
                         ),
                       ),
@@ -73,14 +84,12 @@ Widget searchLivePanel(BuildContext context, ctr, list) {
                 }),
               ),
             ),
-                LiveContent(liveItem: i)
+            LiveContent(liveItem: liveItem)
           ],
         ),
       ),
     );
-      },
+  }
-    ),
-  );
 }
 
 class LiveContent extends StatelessWidget {

lib/pages/searchPanel/widgets/media_bangumi_panel.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
 import 'package:get/get.dart';
+import 'package:pilipala/common/constants.dart';
 import 'package:pilipala/common/widgets/badge.dart';
 import 'package:pilipala/common/widgets/network_img_layer.dart';
 import 'package:pilipala/http/search.dart';
@@ -28,7 +29,8 @@ Widget searchMbangumiPanel(BuildContext context, ctr, list) {
           // });
         },
         child: Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
+          padding: const EdgeInsets.fromLTRB(
+              StyleString.safeSpace, 7, StyleString.safeSpace, 7),
           child: Row(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [