feat: 更多横屏适配

lib/common/widgets/video_card_h.dart

@@ -173,6 +173,7 @@ class VideoContent extends StatelessWidget {
               ),
             ] else ...[
               RichText(
+                overflow: TextOverflow.ellipsis,
                 maxLines: 2,
                 text: TextSpan(
                   children: [

lib/pages/dynamics/view.dart

@@ -252,7 +252,7 @@ class _DynamicsPageState extends State<DynamicsPage>
                               maxCrossAxisExtent: Grid.maxRowWidth * 2,
                               //cacheExtent: 0.0,
                               crossAxisSpacing: StyleString.safeSpace,
-                              mainAxisSpacing: StyleString.safeSpace,
+                              mainAxisSpacing: StyleString.cardSpace,
 
                               /// follow max child trailing layout offset and layout with full cross axis extend
                               /// last child as loadmore item/no more item in [GridView] and [WaterfallFlow]

lib/pages/dynamics/widgets/article_panel.dart

@@ -1,15 +1,14 @@
 import 'package:flutter/material.dart';
 import 'package:PiliPalaX/utils/utils.dart';
 
+import '../../../common/constants.dart';
 import 'pic_panel.dart';
 
 Widget articlePanel(item, context, {floor = 1}) {
   TextStyle authorStyle =
       TextStyle(color: Theme.of(context).colorScheme.primary);
   return Padding(
-    padding: floor == 2
+    padding: const EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
-        ? EdgeInsets.zero
-        : const EdgeInsets.only(left: 12, right: 12),
     child: Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [

lib/pages/dynamics/widgets/forward_panel.dart

@@ -89,7 +89,11 @@ Widget forWard(item, context, ctr, source, {floor = 1}) {
       return videoSeasonWidget(item, context, 'archive', floor: floor);
     // 文章
     case 'DYNAMIC_TYPE_ARTICLE':
-      return articlePanel(item, context, floor: floor);
+      return Container(
+          padding:
+              const EdgeInsets.only(left: 10, top: 12, right: 10, bottom: 10),
+          color: Theme.of(context).dividerColor.withOpacity(0.08),
+          child: articlePanel(item, context, floor: floor));
     // 转发
     case 'DYNAMIC_TYPE_FORWARD':
       return InkWell(

lib/pages/dynamics/widgets/live_rcmd_panel.dart

@@ -44,9 +44,8 @@ Widget liveRcmdPanel(item, context, {floor = 1}) {
       const SizedBox(height: 4),
       if (item.modules.moduleDynamic.topic != null) ...[
         Padding(
-          padding: floor == 2
+          padding:
-              ? EdgeInsets.zero
+              const EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
-              : const EdgeInsets.only(left: 12, right: 12),
           child: GestureDetector(
             child: Text(
               '#${item.modules.moduleDynamic.topic.name}',
@@ -60,90 +59,91 @@ Widget liveRcmdPanel(item, context, {floor = 1}) {
         Text.rich(richNode(item, context)),
         const SizedBox(height: 6),
       ],
-      GestureDetector(
+      Padding(
-        onTap: () {
+          padding:
-          _dynamicsController.pushDetail(item, floor);
+              const EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
-        },
+          child: GestureDetector(
-        child: LayoutBuilder(builder: (context, box) {
+            onTap: () {
-          double width = box.maxWidth;
+              _dynamicsController.pushDetail(item, floor);
-          return Stack(
+            },
-            children: [
+            child: LayoutBuilder(builder: (context, box) {
-              Hero(
+              double width = box.maxWidth;
-                tag: liveRcmd.roomId.toString(),
+              return Stack(
-                child: NetworkImgLayer(
+                children: [
-                  type: floor == 1 ? 'emote' : null,
+                  Hero(
-                  width: width,
+                    tag: liveRcmd.roomId.toString(),
-                  height: width / StyleString.aspectRatio,
+                    child: NetworkImgLayer(
-                  src: item.modules.moduleDynamic.major.liveRcmd.cover,
+                      type: floor == 1 ? 'emote' : null,
-                ),
+                      width: width,
-              ),
+                      height: width / StyleString.aspectRatio,
-              PBadge(
+                      src: item.modules.moduleDynamic.major.liveRcmd.cover,
-                text: watchedShow['text_large'],
+                    ),
-                top: 6,
+                  ),
-                right: 56,
+                  PBadge(
-                bottom: null,
+                    text: watchedShow['text_large'],
-                left: null,
+                    top: 6,
-                type: 'gray',
+                    right: 56,
-              ),
+                    bottom: null,
-              PBadge(
+                    left: null,
-                text: liveStatus == 1 ? '直播中' : '直播结束',
+                    type: 'gray',
-                top: 6,
+                  ),
-                right: 6,
+                  PBadge(
-                bottom: null,
+                    text: liveStatus == 1 ? '直播中' : '直播结束',
-                left: null,
+                    top: 6,
-              ),
+                    right: 6,
-              Positioned(
+                    bottom: null,
-                left: 0,
+                    left: null,
-                right: 0,
+                  ),
-                bottom: 0,
+                  Positioned(
-                child: Container(
+                    left: 0,
-                  height: 80,
+                    right: 0,
-                  padding: const EdgeInsets.fromLTRB(12, 0, 10, 10),
+                    bottom: 0,
-                  clipBehavior: Clip.hardEdge,
+                    child: Container(
-                  decoration: BoxDecoration(
+                      height: 80,
-                      gradient: const LinearGradient(
+                      padding: const EdgeInsets.fromLTRB(12, 0, 10, 10),
-                        begin: Alignment.topCenter,
+                      clipBehavior: Clip.hardEdge,
-                        end: Alignment.bottomCenter,
+                      decoration: BoxDecoration(
-                        colors: <Color>[
+                          gradient: const LinearGradient(
-                          Colors.transparent,
+                            begin: Alignment.topCenter,
-                          Colors.black45,
+                            end: Alignment.bottomCenter,
+                            colors: <Color>[
+                              Colors.transparent,
+                              Colors.black45,
+                            ],
+                          ),
+                          borderRadius: floor == 1
+                              ? null
+                              : const BorderRadius.all(Radius.circular(6))),
+                      child: Row(
+                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                        crossAxisAlignment: CrossAxisAlignment.end,
+                        children: [
+                          DefaultTextStyle.merge(
+                            style: TextStyle(
+                                fontSize: Theme.of(context)
+                                    .textTheme
+                                    .labelMedium!
+                                    .fontSize,
+                                color: Colors.white),
+                            child: Row(
+                              children: [
+                                Text(item.modules.moduleDynamic.major.liveRcmd
+                                        .areaName ??
+                                    ''),
+                              ],
+                            ),
+                          ),
                         ],
                       ),
-                      borderRadius: floor == 1
+                    ),
-                          ? null
-                          : const BorderRadius.all(Radius.circular(6))),
-                  child: Row(
-                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                    crossAxisAlignment: CrossAxisAlignment.end,
-                    children: [
-                      DefaultTextStyle.merge(
-                        style: TextStyle(
-                            fontSize: Theme.of(context)
-                                .textTheme
-                                .labelMedium!
-                                .fontSize,
-                            color: Colors.white),
-                        child: Row(
-                          children: [
-                            Text(item.modules.moduleDynamic.major.liveRcmd
-                                    .areaName ??
-                                ''),
-                          ],
-                        ),
-                      ),
-                    ],
                   ),
-                ),
+                ],
-              ),
+              );
-            ],
+            }),
-          );
+          )),
-        }),
-      ),
       const SizedBox(height: 6),
       Padding(
-        padding: floor == 1
+        padding: const EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
-            ? const EdgeInsets.only(left: 12, right: 12)
-            : EdgeInsets.zero,
         child: Text(
           item.modules.moduleDynamic.major.liveRcmd.title,
           maxLines: 1,

lib/pages/dynamics/widgets/video_panel.dart

@@ -76,80 +76,84 @@ Widget videoSeasonWidget(item, context, type, {floor = 1}) {
         Text.rich(richNode(item, context)),
         const SizedBox(height: 6),
       ],
-      LayoutBuilder(builder: (context, box) {
+      Padding(
-        double width = box.maxWidth;
+          padding: EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
-        return Stack(
+          child: LayoutBuilder(builder: (context, box) {
-          children: [
+            double width = box.maxWidth;
-            Hero(
+            return Stack(
-              tag: content.bvid,
+              children: [
-              child: NetworkImgLayer(
+                Hero(
-                type: floor == 1 ? 'emote' : null,
+                  tag: content.bvid,
-                width: width,
+                  child: NetworkImgLayer(
-                height: width / StyleString.aspectRatio,
+                    type: floor == 1 ? 'emote' : null,
-                src: content.cover,
+                    width: width,
-                semanticsLabel: content.title,
+                    height: width / StyleString.aspectRatio,
-              ),
+                    src: content.cover,
-            ),
+                    semanticsLabel: content.title,
-            if (content.badge != null && type == 'pgc')
+                  ),
-              PBadge(
+                ),
-                text: content.badge['text'],
+                if (content.badge != null && type == 'pgc')
-                top: 8.0,
+                  PBadge(
-                right: 10.0,
+                    text: content.badge['text'],
-                bottom: null,
+                    top: 8.0,
-                left: null,
+                    right: 10.0,
-              ),
+                    bottom: null,
-            Positioned(
+                    left: null,
-              left: 0,
+                  ),
-              right: 0,
+                Positioned(
-              bottom: 0,
+                  left: 0,
-              child: Container(
+                  right: 0,
-                height: 80,
+                  bottom: 0,
-                padding: const EdgeInsets.fromLTRB(12, 0, 10, 10),
+                  child: Container(
-                clipBehavior: Clip.hardEdge,
+                    height: 80,
-                decoration: BoxDecoration(
+                    padding: const EdgeInsets.fromLTRB(12, 0, 10, 10),
-                    gradient: const LinearGradient(
+                    clipBehavior: Clip.hardEdge,
-                      begin: Alignment.topCenter,
+                    decoration: BoxDecoration(
-                      end: Alignment.bottomCenter,
+                        gradient: const LinearGradient(
-                      colors: <Color>[
+                          begin: Alignment.topCenter,
-                        Colors.transparent,
+                          end: Alignment.bottomCenter,
-                        Colors.black54,
+                          colors: <Color>[
+                            Colors.transparent,
+                            Colors.black54,
+                          ],
+                        ),
+                        borderRadius: floor == 1
+                            ? null
+                            : const BorderRadius.all(Radius.circular(6))),
+                    child: Row(
+                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                      crossAxisAlignment: CrossAxisAlignment.end,
+                      children: [
+                        DefaultTextStyle.merge(
+                          style: TextStyle(
+                              fontSize: Theme.of(context)
+                                  .textTheme
+                                  .labelMedium!
+                                  .fontSize,
+                              color: Colors.white),
+                          child: Row(
+                            children: [
+                              Text(content.durationText ?? ''),
+                              if (content.durationText != null)
+                                const SizedBox(width: 10),
+                              Text(content.stat.play + '次围观'),
+                              const SizedBox(width: 10),
+                              Text(content.stat.danmu + '条弹幕')
+                            ],
+                          ),
+                        ),
+                        Image.asset(
+                          'assets/images/play.png',
+                          width: 60,
+                          height: 60,
+                        ),
                       ],
                     ),
-                    borderRadius: floor == 1
+                  ),
-                        ? null
-                        : const BorderRadius.all(Radius.circular(6))),
-                child: Row(
-                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                  crossAxisAlignment: CrossAxisAlignment.end,
-                  children: [
-                    DefaultTextStyle.merge(
-                      style: TextStyle(
-                          fontSize:
-                              Theme.of(context).textTheme.labelMedium!.fontSize,
-                          color: Colors.white),
-                      child: Row(
-                        children: [
-                          Text(content.durationText ?? ''),
-                          if (content.durationText != null)
-                            const SizedBox(width: 10),
-                          Text(content.stat.play + '次围观'),
-                          const SizedBox(width: 10),
-                          Text(content.stat.danmu + '条弹幕')
-                        ],
-                      ),
-                    ),
-                    Image.asset(
-                      'assets/images/play.png',
-                      width: 60,
-                      height: 60,
-                    ),
-                  ],
                 ),
-              ),
+              ],
-            ),
+            );
-          ],
+          })),
-        );
-      }),
       const SizedBox(height: 6),
       Padding(
         padding: floor == 1

lib/pages/fav/view.dart

@@ -5,6 +5,9 @@ import 'package:PiliPalaX/common/widgets/http_error.dart';
 import 'package:PiliPalaX/pages/fav/index.dart';
 import 'package:PiliPalaX/pages/fav/widgets/item.dart';
 
+import '../../common/constants.dart';
+import '../../utils/grid.dart';
+
 class FavPage extends StatefulWidget {
   const FavPage({super.key});
 
@@ -60,17 +63,28 @@ class _FavPageState extends State<FavPage> {
           if (snapshot.connectionState == ConnectionState.done) {
             Map data = snapshot.data as Map;
             if (data['status']) {
-              return Obx(
+              return Obx(() =>
-                () => ListView.builder(
+                  CustomScrollView(controller: scrollController, slivers: [
-                  controller: scrollController,
+                    SliverGrid(
-                  itemCount: _favController.favFolderData.value.list!.length,
+                      gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-                  itemBuilder: (context, index) {
+                          mainAxisSpacing: StyleString.cardSpace,
-                    return FavItem(
+                          crossAxisSpacing: StyleString.safeSpace,
-                        favFolderItem:
+                          maxCrossAxisExtent: Grid.maxRowWidth * 2,
-                            _favController.favFolderData.value.list![index]);
+                          mainAxisExtent: Grid.calculateActualWidth(context,
-                  },
+                                  Grid.maxRowWidth * 2, StyleString.safeSpace) /
-                ),
+                              1.9 /
-              );
+                              StyleString.aspectRatio),
+                      delegate: SliverChildBuilderDelegate(
+                        childCount:
+                        _favController.favFolderData.value.list!.length,
+                        (BuildContext context, int index) {
+                          return FavItem(
+                              favFolderItem: _favController
+                                  .favFolderData.value.list![index]);
+                        },
+                      ),
+                    )
+                  ]));
             } else {
               return CustomScrollView(
                 physics: const NeverScrollableScrollPhysics(),

lib/pages/history/view.dart

@@ -6,6 +6,8 @@ import 'package:PiliPalaX/common/widgets/http_error.dart';
 import 'package:PiliPalaX/common/widgets/no_data.dart';
 import 'package:PiliPalaX/pages/history/index.dart';
 
+import '../../common/constants.dart';
+import '../../utils/grid.dart';
 import 'widgets/item.dart';
 
 class HistoryPage extends StatefulWidget {
@@ -189,7 +191,18 @@ class _HistoryPageState extends State<HistoryPage> {
                   if (data['status']) {
                     return Obx(
                       () => _historyController.historyList.isNotEmpty
-                          ? SliverList(
+                          ? SliverGrid(
+                              gridDelegate:
+                                  SliverGridDelegateWithMaxCrossAxisExtent(
+                                      mainAxisSpacing: StyleString.cardSpace,
+                                      crossAxisSpacing: StyleString.safeSpace,
+                                      maxCrossAxisExtent: Grid.maxRowWidth * 2,
+                                      mainAxisExtent: Grid.calculateActualWidth(
+                                              context,
+                                              Grid.maxRowWidth * 2,
+                                              StyleString.safeSpace) /
+                                          2.1 /
+                                          StyleString.aspectRatio),
                               delegate: SliverChildBuilderDelegate(
                                   (context, index) {
                                 return HistoryItem(

lib/pages/history/widgets/item.dart

@@ -146,7 +146,7 @@ class HistoryItem extends StatelessWidget {
         children: [
           Padding(
             padding: const EdgeInsets.fromLTRB(
-                StyleString.safeSpace, 5, StyleString.safeSpace, 5),
+                StyleString.safeSpace, 0, StyleString.safeSpace, 0),
             child: LayoutBuilder(
               builder: (context, boxConstraints) {
                 double width =

lib/pages/hot/view.dart

@@ -93,7 +93,7 @@ class _HotPageState extends State<HotPage> with AutomaticKeepAliveClientMixin {
                       () => SliverGrid(
                         gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
                           // 行间距
-                          mainAxisSpacing: StyleString.safeSpace,
+                          mainAxisSpacing: StyleString.cardSpace,
                           // 列间距
                           crossAxisSpacing: StyleString.safeSpace,
                           // 最大宽度

lib/pages/later/view.dart

@@ -6,6 +6,9 @@ import 'package:PiliPalaX/common/widgets/no_data.dart';
 import 'package:PiliPalaX/common/widgets/video_card_h.dart';
 import 'package:PiliPalaX/pages/later/index.dart';
 
+import '../../common/constants.dart';
+import '../../utils/grid.dart';
+
 class LaterPage extends StatefulWidget {
   const LaterPage({super.key});
 
@@ -77,7 +80,18 @@ class _LaterPageState extends State<LaterPage> {
                   return Obx(
                     () => _laterController.laterList.isNotEmpty &&
                             !_laterController.isLoading.value
-                        ? SliverList(
+                        ? SliverGrid(
+                            gridDelegate:
+                                SliverGridDelegateWithMaxCrossAxisExtent(
+                                    mainAxisSpacing: StyleString.cardSpace,
+                                    crossAxisSpacing: StyleString.safeSpace,
+                                    maxCrossAxisExtent: Grid.maxRowWidth * 2,
+                                    mainAxisExtent: Grid.calculateActualWidth(
+                                            context,
+                                            Grid.maxRowWidth * 2,
+                                            StyleString.safeSpace) /
+                                        1.9 /
+                                        StyleString.aspectRatio),
                             delegate:
                                 SliverChildBuilderDelegate((context, index) {
                               var videoItem = _laterController.laterList[index];

lib/pages/member_archive/view.dart

@@ -3,7 +3,9 @@ import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:PiliPalaX/common/widgets/video_card_h.dart';
 import 'package:PiliPalaX/utils/utils.dart';
+import '../../common/constants.dart';
 import '../../common/widgets/http_error.dart';
+import '../../utils/grid.dart';
 import 'controller.dart';
 
 class MemberArchivePage extends StatefulWidget {
@@ -72,7 +74,18 @@ class _MemberArchivePageState extends State<MemberArchivePage> {
                   if (data['status']) {
                     return Obx(
                       () => list.isNotEmpty
-                          ? SliverList(
+                          ? SliverGrid(
+                              gridDelegate:
+                                  SliverGridDelegateWithMaxCrossAxisExtent(
+                                      mainAxisSpacing: StyleString.cardSpace,
+                                      crossAxisSpacing: StyleString.safeSpace,
+                                      maxCrossAxisExtent: Grid.maxRowWidth * 2,
+                                      mainAxisExtent: Grid.calculateActualWidth(
+                                              context,
+                                              Grid.maxRowWidth * 2,
+                                              StyleString.safeSpace) /
+                                          1.9 /
+                                          StyleString.aspectRatio),
                               delegate: SliverChildBuilderDelegate(
                                 (BuildContext context, index) {
                                   return VideoCardH(

lib/pages/member_dynamics/view.dart

@@ -4,8 +4,11 @@ import 'package:get/get.dart';
 import 'package:PiliPalaX/pages/member_dynamics/index.dart';
 import 'package:PiliPalaX/utils/utils.dart';
 
+import '../../common/constants.dart';
 import '../../common/widgets/http_error.dart';
+import '../../utils/grid.dart';
 import '../dynamics/widgets/dynamic_panel.dart';
+import 'package:waterfall_flow/waterfall_flow.dart';
 
 class MemberDynamicsPage extends StatefulWidget {
   const MemberDynamicsPage({super.key});
@@ -70,14 +73,28 @@ class _MemberDynamicsPageState extends State<MemberDynamicsPage> {
                   if (data['status']) {
                     return Obx(
                       () => list.isNotEmpty
-                          ? SliverList(
+                          ? SliverWaterfallFlow.extent(
-                              delegate: SliverChildBuilderDelegate(
+                              maxCrossAxisExtent: Grid.maxRowWidth * 2,
-                                (context, index) {
+                              //cacheExtent: 0.0,
-                                  return DynamicPanel(item: list[index]);
+                              crossAxisSpacing: StyleString.safeSpace,
-                                },
+                              mainAxisSpacing: StyleString.safeSpace,
-                                childCount: list.length,
+
-                              ),
+                              /// follow max child trailing layout offset and layout with full cross axis extend
-                            )
+                              /// last child as loadmore item/no more item in [GridView] and [WaterfallFlow]
+                              /// with full cross axis extend
+                              //  LastChildLayoutType.fullCrossAxisExtend,
+
+                              /// as foot at trailing and layout with full cross axis extend
+                              /// show no more item at trailing when children are not full of viewport
+                              /// if children is full of viewport, it's the same as fullCrossAxisExtend
+                              //  LastChildLayoutType.foot,
+                              lastChildLayoutTypeBuilder: (index) =>
+                                  index == list.length
+                                      ? LastChildLayoutType.foot
+                                      : LastChildLayoutType.none,
+                              children: [
+                                  for (var i in list) DynamicPanel(item: i),
+                                ])
                           : const SliverToBoxAdapter(),
                     );
                   } else {

lib/pages/search_panel/widgets/article_panel.dart

@@ -4,104 +4,118 @@ import 'package:PiliPalaX/common/constants.dart';
 import 'package:PiliPalaX/common/widgets/network_img_layer.dart';
 import 'package:PiliPalaX/utils/utils.dart';
 
+import '../../../utils/grid.dart';
+
 Widget searchArticlePanel(BuildContext context, ctr, list) {
   TextStyle textStyle = TextStyle(
       fontSize: Theme.of(context).textTheme.labelSmall!.fontSize,
       color: Theme.of(context).colorScheme.outline);
-  return ListView.builder(
+  return CustomScrollView(controller: ctr.scrollController, slivers: [
-    controller: ctr!.scrollController,
+    SliverGrid(
-    itemCount: list.length,
+        gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-    itemBuilder: (context, index) {
+            mainAxisSpacing: StyleString.cardSpace,
-      return InkWell(
+            crossAxisSpacing: StyleString.safeSpace,
-        onTap: () {
+            maxCrossAxisExtent: Grid.maxRowWidth * 2,
-          Get.toNamed('/htmlRender', parameters: {
+            mainAxisExtent: Grid.calculateActualWidth(
-            'url': 'www.bilibili.com/read/cv${list[index].id}',
+                    context, Grid.maxRowWidth * 2, StyleString.safeSpace) /
-            'title': list[index].subTitle,
+                1.9 /
-            'id': 'cv${list[index].id}',
+                StyleString.aspectRatio),
-            'dynamicType': 'read'
+        delegate: SliverChildBuilderDelegate(
-          });
+          (BuildContext context, int index) {
-        },
+            return InkWell(
-        child: Padding(
+              onTap: () {
-          padding: const EdgeInsets.fromLTRB(
+                Get.toNamed('/htmlRender', parameters: {
-              StyleString.safeSpace, 5, StyleString.safeSpace, 5),
+                  'url': 'www.bilibili.com/read/cv${list[index].id}',
-          child: LayoutBuilder(builder: (context, boxConstraints) {
+                  'title': list[index].subTitle,
-            final double width = (boxConstraints.maxWidth -
+                  'id': 'cv${list[index].id}',
-                    StyleString.cardSpace *
+                  'dynamicType': 'read'
-                        6 /
+                });
-                        MediaQuery.textScalerOf(context).scale(1.0)) /
+              },
-                2;
+              child: Padding(
-            return Container(
+                padding: const EdgeInsets.fromLTRB(
-              constraints: const BoxConstraints(minHeight: 88),
+                    StyleString.safeSpace, 5, StyleString.safeSpace, 5),
-              height: width / StyleString.aspectRatio,
+                child: LayoutBuilder(builder: (context, boxConstraints) {
-              child: Row(
+                  final double width = (boxConstraints.maxWidth -
-                crossAxisAlignment: CrossAxisAlignment.start,
+                          StyleString.cardSpace *
-                children: <Widget>[
+                              6 /
-                  if (list[index].imageUrls != null &&
+                              MediaQuery.textScalerOf(context).scale(1.0)) /
-                      list[index].imageUrls.isNotEmpty)
+                      2;
-                    AspectRatio(
+                  return Container(
-                      aspectRatio: StyleString.aspectRatio,
+                    constraints: const BoxConstraints(minHeight: 88),
-                      child: LayoutBuilder(builder: (context, boxConstraints) {
+                    height: width / StyleString.aspectRatio,
-                        double maxWidth = boxConstraints.maxWidth;
+                    child: Row(
-                        double maxHeight = boxConstraints.maxHeight;
+                      crossAxisAlignment: CrossAxisAlignment.start,
-                        return NetworkImgLayer(
+                      children: <Widget>[
-                          width: maxWidth,
+                        if (list[index].imageUrls != null &&
-                          height: maxHeight,
+                            list[index].imageUrls.isNotEmpty)
-                          src: list[index].imageUrls.first,
+                          AspectRatio(
-                        );
+                            aspectRatio: StyleString.aspectRatio,
-                      }),
+                            child: LayoutBuilder(
-                    ),
+                                builder: (context, boxConstraints) {
-                  Expanded(
+                              double maxWidth = boxConstraints.maxWidth;
-                    child: Padding(
+                              double maxHeight = boxConstraints.maxHeight;
-                      padding: const EdgeInsets.fromLTRB(10, 2, 6, 0),
+                              return NetworkImgLayer(
-                      child: Column(
+                                width: maxWidth,
-                        mainAxisSize: MainAxisSize.min,
+                                height: maxHeight,
-                        crossAxisAlignment: CrossAxisAlignment.start,
+                                src: list[index].imageUrls.first,
-                        children: [
+                              );
-                          RichText(
+                            }),
-                            maxLines: 2,
+                          ),
-                            text: TextSpan(
+                        Expanded(
+                          child: Padding(
+                            padding: const EdgeInsets.fromLTRB(10, 2, 6, 0),
+                            child: Column(
+                              mainAxisSize: MainAxisSize.min,
+                              crossAxisAlignment: CrossAxisAlignment.start,
                               children: [
-                                for (var i in list[index].title) ...[
+                                RichText(
-                                  TextSpan(
+                                  maxLines: 2,
-                                    text: i['text'],
+                                  text: TextSpan(
-                                    style: TextStyle(
+                                    children: [
-                                      fontWeight: FontWeight.w500,
+                                      for (var i in list[index].title) ...[
-                                      letterSpacing: 0.3,
+                                        TextSpan(
-                                      color: i['type'] == 'em'
+                                          text: i['text'],
-                                          ? Theme.of(context)
+                                          style: TextStyle(
-                                              .colorScheme
+                                            fontWeight: FontWeight.w500,
-                                              .primary
+                                            letterSpacing: 0.3,
-                                          : Theme.of(context)
+                                            color: i['type'] == 'em'
-                                              .colorScheme
+                                                ? Theme.of(context)
-                                              .onSurface,
+                                                    .colorScheme
-                                    ),
+                                                    .primary
+                                                : Theme.of(context)
+                                                    .colorScheme
+                                                    .onSurface,
+                                          ),
+                                        ),
+                                      ]
+                                    ],
                                   ),
-                                ]
+                                ),
+                                const Spacer(),
+                                Text(
+                                    Utils.dateFormat(list[index].pubTime,
+                                        formatType: 'detail'),
+                                    style: textStyle),
+                                Row(
+                                  children: [
+                                    Text('${list[index].view}浏览',
+                                        style: textStyle),
+                                    Text(' • ', style: textStyle),
+                                    Text('${list[index].reply}评论',
+                                        style: textStyle),
+                                  ],
+                                ),
                               ],
                             ),
                           ),
-                          const Spacer(),
+                        ),
-                          Text(
+                      ],
-                              Utils.dateFormat(list[index].pubTime,
-                                  formatType: 'detail'),
-                              style: textStyle),
-                          Row(
-                            children: [
-                              Text('${list[index].view}浏览', style: textStyle),
-                              Text(' • ', style: textStyle),
-                              Text('${list[index].reply}评论', style: textStyle),
-                            ],
-                          ),
-                        ],
-                      ),
                     ),
-                  ),
+                  );
-                ],
+                }),
               ),
             );
-          }),
+          },
-        ),
+        ))
-      );
+  ]);
-    },
-  );
 }

lib/pages/search_panel/widgets/live_panel.dart

@@ -4,6 +4,8 @@ import 'package:PiliPalaX/common/constants.dart';
 import 'package:PiliPalaX/common/widgets/network_img_layer.dart';
 import 'package:PiliPalaX/utils/utils.dart';
 
+import '../../../utils/grid.dart';
+
 Widget searchLivePanel(BuildContext context, ctr, list) {
   return Padding(
     padding: const EdgeInsets.only(
@@ -11,13 +13,15 @@ Widget searchLivePanel(BuildContext context, ctr, list) {
     child: GridView.builder(
       primary: false,
       controller: ctr!.scrollController,
-      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+      gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-          crossAxisCount: 2,
+        maxCrossAxisExtent: Grid.maxRowWidth,
-          crossAxisSpacing: StyleString.cardSpace + 2,
+        crossAxisSpacing: StyleString.safeSpace,
-          mainAxisSpacing: StyleString.cardSpace + 3,
+        mainAxisSpacing: StyleString.safeSpace,
-          mainAxisExtent:
+        mainAxisExtent: Grid.calculateActualWidth(
-              MediaQuery.sizeOf(context).width / 2 / StyleString.aspectRatio +
+                    context, Grid.maxRowWidth, StyleString.safeSpace) /
-                  MediaQuery.textScalerOf(context).scale(66.0)),
+                StyleString.aspectRatio +
+            MediaQuery.textScalerOf(context).scale(80),
+      ),
       itemCount: list.length,
       itemBuilder: (context, index) {
         return LiveItem(liveItem: list![index]);

lib/pages/search_panel/widgets/media_bangumi_panel.dart

@@ -9,138 +9,155 @@ import 'package:PiliPalaX/models/bangumi/info.dart';
 import 'package:PiliPalaX/models/common/search_type.dart';
 import 'package:PiliPalaX/utils/utils.dart';
 
+import '../../../utils/grid.dart';
+
 Widget searchMbangumiPanel(BuildContext context, ctr, list) {
   TextStyle style =
-      TextStyle(fontSize: Theme.of(context).textTheme.labelMedium!.fontSize);
+  TextStyle(fontSize: Theme.of(context).textTheme.labelMedium!.fontSize);
-  return ListView.builder(
+  return Expanded(
-    controller: ctr!.scrollController,
+    child: CustomScrollView(
-    addAutomaticKeepAlives: false,
+      controller: ctr.scrollController,
-    addRepaintBoundaries: false,
+      slivers: [
-    itemCount: list!.length,
+        SliverGrid(
-    itemBuilder: (context, index) {
+          gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-      var i = list![index];
+            mainAxisSpacing: StyleString.cardSpace,
-      return InkWell(
+            crossAxisSpacing: StyleString.safeSpace,
-        onTap: () {
+            maxCrossAxisExtent: Grid.maxRowWidth * 2,
-          /// TODO 番剧详情页面
+            mainAxisExtent: 157,),
-          // Get.toNamed('/video?bvid=${i.bvid}&cid=${i.cid}', arguments: {
+          delegate:
-          //   'videoItem': i,
+          SliverChildBuilderDelegate((BuildContext context, int index) {
-          //   'heroTag': Utils.makeHeroTag(i.id),
+            var i = list![index];
-          //   'videoType': SearchType.media_bangumi
+            return InkWell(
-          // });
+              onTap: () {
-        },
+                /// TODO 番剧详情页面
-        child: Padding(
+                // Get.toNamed('/video?bvid=${i.bvid}&cid=${i.cid}', arguments: {
-          padding: const EdgeInsets.fromLTRB(
+                //   'videoItem': i,
-              StyleString.safeSpace, 7, StyleString.safeSpace, 7),
+                //   'heroTag': Utils.makeHeroTag(i.id),
-          child: Row(
+                //   'videoType': SearchType.media_bangumi
-            crossAxisAlignment: CrossAxisAlignment.start,
+                // });
-            children: [
+              },
-              Stack(
+              child: Padding(
-                children: [
+                padding: const EdgeInsets.fromLTRB(
-                  NetworkImgLayer(
+                    StyleString.safeSpace, 7, StyleString.safeSpace, 2),
-                    width: 111,
+                child: Row(
-                    height: 148,
-                    src: i.cover,
-                  ),
-                  PBadge(
-                    text: i.mediaType == 1 ? '番剧' : '国创',
-                    top: 6.0,
-                    right: 4.0,
-                    bottom: null,
-                    left: null,
-                  )
-                ],
-              ),
-              const SizedBox(width: 10),
-              Expanded(
-                child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
-                    const SizedBox(height: 4),
+                    Stack(
-                    RichText(
+                      children: [
-                      maxLines: 1,
+                        NetworkImgLayer(
-                      overflow: TextOverflow.ellipsis,
+                          width: 111,
-                      text: TextSpan(
+                          height: 148,
-                        style: TextStyle(
+                          src: i.cover,
-                            color: Theme.of(context).colorScheme.onSurface),
+                        ),
+                        PBadge(
+                          text: i.mediaType == 1 ? '番剧' : '国创',
+                          top: 6.0,
+                          right: 4.0,
+                          bottom: null,
+                          left: null,
+                        )
+                      ],
+                    ),
+                    const SizedBox(width: 10),
+                    Expanded(
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
                         children: [
-                          for (var i in i.title) ...[
+                          const SizedBox(height: 4),
-                            TextSpan(
+                          RichText(
-                              text: i['text'],
+                            maxLines: 1,
+                            overflow: TextOverflow.ellipsis,
+                            text: TextSpan(
                               style: TextStyle(
-                                fontSize: MediaQuery.textScalerOf(context)
+                                  color:
-                                    .scale(Theme.of(context)
+                                  Theme.of(context).colorScheme.onSurface),
-                                        .textTheme
+                              children: [
-                                        .titleSmall!
+                                for (var i in i.title) ...[
-                                        .fontSize!),
+                                  TextSpan(
-                                fontWeight: FontWeight.bold,
+                                    text: i['text'],
-                                color: i['type'] == 'em'
+                                    style: TextStyle(
-                                    ? Theme.of(context).colorScheme.primary
+                                      fontSize: MediaQuery.textScalerOf(context)
-                                    : Theme.of(context).colorScheme.onSurface,
+                                          .scale(Theme.of(context)
-                              ),
+                                          .textTheme
+                                          .titleSmall!
+                                          .fontSize!),
+                                      fontWeight: FontWeight.bold,
+                                      color: i['type'] == 'em'
+                                          ? Theme.of(context)
+                                          .colorScheme
+                                          .primary
+                                          : Theme.of(context)
+                                          .colorScheme
+                                          .onSurface,
+                                    ),
+                                  ),
+                                ],
+                              ],
                             ),
-                          ],
+                          ),
+                          const SizedBox(height: 12),
+                          Text('评分:${i.mediaScore['score'].toString()}',
+                              style: style),
+                          Row(
+                            children: [
+                              Text(i.areas, style: style),
+                              const SizedBox(width: 3),
+                              const Text('·'),
+                              const SizedBox(width: 3),
+                              Text(Utils.dateFormat(i.pubtime).toString(),
+                                  style: style),
+                            ],
+                          ),
+                          Row(
+                            children: [
+                              Text(i.styles, style: style),
+                              const SizedBox(width: 3),
+                              const Text('·'),
+                              const SizedBox(width: 3),
+                              Text(i.indexShow, style: style),
+                            ],
+                          ),
+                          const SizedBox(height: 18),
+                          SizedBox(
+                            height: 32,
+                            child: ElevatedButton(
+                              onPressed: () async {
+                                SmartDialog.showLoading(msg: '获取中...');
+                                var res = await SearchHttp.bangumiInfo(
+                                    seasonId: i.seasonId);
+                                SmartDialog.dismiss().then((value) {
+                                  if (res['status']) {
+                                    EpisodeItem episode =
+                                        res['data'].episodes.first;
+                                    String bvid = episode.bvid!;
+                                    int cid = episode.cid!;
+                                    String pic = episode.cover!;
+                                    String heroTag = Utils.makeHeroTag(cid);
+                                    Get.toNamed(
+                                      '/video?bvid=$bvid&cid=$cid&seasonId=${i.seasonId}',
+                                      arguments: {
+                                        'pic': pic,
+                                        'heroTag': heroTag,
+                                        'videoType': SearchType.media_bangumi,
+                                        'bangumiItem': res['data'],
+                                      },
+                                    );
+                                  }
+                                });
+                              },
+                              child: const Text('观看'),
+                            ),
+                          ),
                         ],
                       ),
                     ),
-                    const SizedBox(height: 12),
-                    Text('评分:${i.mediaScore['score'].toString()}',
-                        style: style),
-                    Row(
-                      children: [
-                        Text(i.areas, style: style),
-                        const SizedBox(width: 3),
-                        const Text('·'),
-                        const SizedBox(width: 3),
-                        Text(Utils.dateFormat(i.pubtime).toString(),
-                            style: style),
-                      ],
-                    ),
-                    Row(
-                      children: [
-                        Text(i.styles, style: style),
-                        const SizedBox(width: 3),
-                        const Text('·'),
-                        const SizedBox(width: 3),
-                        Text(i.indexShow, style: style),
-                      ],
-                    ),
-                    const SizedBox(height: 18),
-                    SizedBox(
-                      height: 32,
-                      child: ElevatedButton(
-                        onPressed: () async {
-                          SmartDialog.showLoading(msg: '获取中...');
-                          var res = await SearchHttp.bangumiInfo(
-                              seasonId: i.seasonId);
-                          SmartDialog.dismiss().then((value) {
-                            if (res['status']) {
-                              EpisodeItem episode = res['data'].episodes.first;
-                              String bvid = episode.bvid!;
-                              int cid = episode.cid!;
-                              String pic = episode.cover!;
-                              String heroTag = Utils.makeHeroTag(cid);
-                              Get.toNamed(
-                                '/video?bvid=$bvid&cid=$cid&seasonId=${i.seasonId}',
-                                arguments: {
-                                  'pic': pic,
-                                  'heroTag': heroTag,
-                                  'videoType': SearchType.media_bangumi,
-                                  'bangumiItem': res['data'],
-                                },
-                              );
-                            }
-                          });
-                        },
-                        child: const Text('观看'),
-                      ),
-                    ),
                   ],
                 ),
               ),
-            ],
+            );
-          ),
+          }, childCount: list.length),
         ),
-      );
+      ],
-    },
+    ),
   );
 }

lib/pages/search_panel/widgets/user_panel.dart

@@ -3,74 +3,79 @@ import 'package:get/get.dart';
 import 'package:PiliPalaX/common/widgets/network_img_layer.dart';
 import 'package:PiliPalaX/utils/utils.dart';
 
+import '../../../common/constants.dart';
+import '../../../utils/grid.dart';
+
 Widget searchUserPanel(BuildContext context, ctr, list) {
   TextStyle style = TextStyle(
       fontSize: Theme.of(context).textTheme.labelSmall!.fontSize,
       color: Theme.of(context).colorScheme.outline);
 
-  return ListView.builder(
+  return CustomScrollView(controller: ctr.scrollController, slivers: [
-    controller: ctr!.scrollController,
+    SliverGrid(
-    addAutomaticKeepAlives: false,
+        gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-    addRepaintBoundaries: false,
+            mainAxisSpacing: StyleString.cardSpace,
-    itemCount: list!.length,
+            crossAxisSpacing: StyleString.safeSpace,
-    itemBuilder: (context, index) {
+            maxCrossAxisExtent: Grid.maxRowWidth * 2,
-      var i = list![index];
+            mainAxisExtent: 52),
-      String heroTag = Utils.makeHeroTag(i!.mid);
+        delegate: SliverChildBuilderDelegate(
-      return InkWell(
+          (BuildContext context, int index) {
-        onTap: () => Get.toNamed('/member?mid=${i.mid}',
+            var i = list![index];
-            arguments: {'heroTag': heroTag, 'face': i.upic}),
+            String heroTag = Utils.makeHeroTag(i!.mid);
-        child: Padding(
+            return InkWell(
-          padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 10),
+              onTap: () => Get.toNamed('/member?mid=${i.mid}',
-          child: Row(
+                  arguments: {'heroTag': heroTag, 'face': i.upic}),
-            children: [
+              child: Row(
-              Hero(
-                tag: heroTag,
-                child: NetworkImgLayer(
-                  width: 42,
-                  height: 42,
-                  src: i.upic,
-                  type: 'avatar',
-                ),
-              ),
-              const SizedBox(width: 10),
-              Column(
-                mainAxisSize: MainAxisSize.max,
-                crossAxisAlignment: CrossAxisAlignment.start,
-                mainAxisAlignment: MainAxisAlignment.center,
                 children: [
-                  Row(
+                  const SizedBox(width: 15),
-                    children: [
+                  Hero(
-                      Text(
+                    tag: heroTag,
-                        i!.uname,
+                    child: NetworkImgLayer(
-                        style: const TextStyle(
+                      width: 42,
-                          fontSize: 14,
+                      height: 42,
-                        ),
+                      src: i.upic,
-                      ),
+                      type: 'avatar',
-                      const SizedBox(width: 6),
-                      Image.asset(
-                        'assets/images/lv/lv${i!.level}.png',
-                        height: 11,
-                        semanticLabel: '等级${i.level}',
-                      ),
-                    ],
-                  ),
-                  Row(
-                    children: [
-                      Text('粉丝：${i.fans} ', style: style),
-                      Text(' 视频：${i.videos}', style: style)
-                    ],
-                  ),
-                  if (i.officialVerify['desc'] != '')
-                    Text(
-                      i.officialVerify['desc'],
-                      style: style,
                     ),
+                  ),
+                  const SizedBox(width: 10),
+                  Column(
+                    mainAxisSize: MainAxisSize.max,
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      Row(
+                        children: [
+                          Text(
+                            i!.uname,
+                            style: const TextStyle(
+                              fontSize: 14,
+                            ),
+                          ),
+                          const SizedBox(width: 6),
+                          Image.asset(
+                            'assets/images/lv/lv${i!.level}.png',
+                            height: 11,
+                            semanticLabel: '等级${i.level}',
+                          ),
+                        ],
+                      ),
+                      Row(
+                        children: [
+                          Text('粉丝：${i.fans} ', style: style),
+                          Text(' 视频：${i.videos}', style: style)
+                        ],
+                      ),
+                      if (i.officialVerify['desc'] != '')
+                        Text(
+                          i.officialVerify['desc'],
+                          style: style,
+                        ),
+                    ],
+                  )
                 ],
-              )
+              ),
-            ],
+            );
-          ),
+          },
-        ),
+        ))
-      );
+  ]);
-    },
-  );
 }

lib/pages/search_panel/widgets/video_panel.dart

@@ -5,53 +5,30 @@ import 'package:PiliPalaX/common/widgets/video_card_h.dart';
 import 'package:PiliPalaX/models/common/search_type.dart';
 import 'package:PiliPalaX/pages/search_panel/index.dart';
 
+import '../../../common/constants.dart';
+import '../../../utils/grid.dart';
+
 class SearchVideoPanel extends StatelessWidget {
   SearchVideoPanel({
-    this.ctr,
+    required this.ctr,
-    this.list,
+    required this.list,
     Key? key,
   }) : super(key: key);
 
-  final SearchPanelController? ctr;
+  final SearchPanelController ctr;
-  final List? list;
+  final List list;
 
   final VideoPanelController controller = Get.put(VideoPanelController());
 
   @override
   Widget build(BuildContext context) {
-    return Stack(
+    return Column(
-      alignment: Alignment.topCenter,
       children: [
-        Padding(
-          padding: const EdgeInsets.only(top: 36),
-          child: ListView.builder(
-            controller: ctr!.scrollController,
-            addAutomaticKeepAlives: false,
-            addRepaintBoundaries: false,
-            itemCount: list!.length,
-            itemBuilder: (context, index) {
-              var i = list![index];
-              return Padding(
-                padding: index == 0
-                    ? const EdgeInsets.only(top: 2)
-                    : EdgeInsets.zero,
-                child: VideoCardH(videoItem: i, showPubdate: true),
-              );
-            },
-          ),
-        ),
         // 分类筛选
         Container(
-          width: double.infinity,
+          width: context.width,
-          height: 36,
+          height: 34,
           padding: const EdgeInsets.only(left: 8, top: 0, right: 12),
-          // decoration: BoxDecoration(
-          //   border: Border(
-          //     bottom: BorderSide(
-          //       color: Theme.of(context).colorScheme.primary.withOpacity(0.1),
-          //     ),
-          //   ),
-          // ),
           child: Row(
             children: [
               Expanded(
@@ -67,11 +44,12 @@ class SearchVideoPanel extends StatelessWidget {
                             type: i['type'],
                             selectedType: controller.selectedType.value,
                             callFn: (bool selected) async {
+                              print('selected: $selected');
                               controller.selectedType.value = i['type'];
-                              ctr!.order.value =
+                              ctr.order.value =
                                   i['type'].toString().split('.').last;
                               SmartDialog.showLoading(msg: 'loading');
-                              await ctr!.onRefresh();
+                              await ctr.onRefresh();
                               SmartDialog.dismiss();
                             },
                           ),
@@ -101,7 +79,29 @@ class SearchVideoPanel extends StatelessWidget {
               ),
             ],
           ),
-        ), // 放置在ListView.builder()上方的组件
+        ),
+        Expanded(
+            child: CustomScrollView(
+          controller: ctr.scrollController,
+          slivers: [
+            SliverGrid(
+              gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
+                  mainAxisSpacing: StyleString.cardSpace,
+                  crossAxisSpacing: StyleString.safeSpace,
+                  maxCrossAxisExtent: Grid.maxRowWidth * 2,
+                  mainAxisExtent: Grid.calculateActualWidth(context,
+                          Grid.maxRowWidth * 2, StyleString.safeSpace) /
+                      1.9 /
+                      StyleString.aspectRatio),
+              delegate: SliverChildBuilderDelegate(
+                (BuildContext context, int index) {
+                  return VideoCardH(videoItem: list[index], showPubdate: true);
+                },
+                childCount: list.length,
+              ),
+            ),
+          ],
+        )),
       ],
     );
   }
@@ -126,7 +126,7 @@ class CustomFilterChip extends StatelessWidget {
     return SizedBox(
       height: 34,
       child: FilterChip(
-        padding: const EdgeInsets.only(left: 11, right: 11),
+        padding: const EdgeInsets.only(left: 8, right: 8),
         labelPadding: EdgeInsets.zero,
         label: Text(
           label!,

lib/pages/subscription/view.dart

@@ -2,6 +2,8 @@ import 'package:easy_debounce/easy_throttle.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:PiliPalaX/common/widgets/http_error.dart';
+import '../../common/constants.dart';
+import '../../utils/grid.dart';
 import 'controller.dart';
 import 'widgets/item.dart';
 
@@ -51,17 +53,28 @@ class _SubPageState extends State<SubPage> {
           if (snapshot.connectionState == ConnectionState.done) {
             Map? data = snapshot.data;
             if (data != null && data['status']) {
-              return Obx(
+              return Obx(() =>
-                () => ListView.builder(
+                  CustomScrollView(controller: scrollController, slivers: [
-                  controller: scrollController,
+                    SliverGrid(
-                  itemCount: _subController.subFolderData.value.list!.length,
+                      gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-                  itemBuilder: (context, index) {
+                          mainAxisSpacing: StyleString.cardSpace,
-                    return SubItem(
+                          crossAxisSpacing: StyleString.safeSpace,
-                        subFolderItem:
+                          maxCrossAxisExtent: Grid.maxRowWidth * 2,
-                            _subController.subFolderData.value.list![index]);
+                          mainAxisExtent: Grid.calculateActualWidth(context,
-                  },
+                                  Grid.maxRowWidth * 2, StyleString.safeSpace) /
-                ),
+                              1.9 /
-              );
+                              StyleString.aspectRatio),
+                      delegate: SliverChildBuilderDelegate(
+                        childCount:
+                            _subController.subFolderData.value.list!.length,
+                        (BuildContext context, int index) {
+                          return SubItem(
+                              subFolderItem: _subController
+                                  .subFolderData.value.list![index]);
+                        },
+                      ),
+                    )
+                  ]));
             } else {
               return CustomScrollView(
                 physics: const NeverScrollableScrollPhysics(),