feat: 投稿、番剧合集整理

lib/common/pages_bottom_sheet.dart

@@ -0,0 +1,135 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
+import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
+import '../models/common/video_episode_type.dart';
+
+class EpisodeBottomSheet {
+  final List<dynamic> episodes;
+  final int currentCid;
+  final dynamic dataType;
+  final BuildContext context;
+  final Function changeFucCall;
+  final int? cid;
+  final double? sheetHeight;
+
+  EpisodeBottomSheet({
+    required this.episodes,
+    required this.currentCid,
+    required this.dataType,
+    required this.context,
+    required this.changeFucCall,
+    this.cid,
+    this.sheetHeight,
+  });
+
+  Widget buildEpisodeListItem(
+    dynamic episode,
+    int index,
+    bool isCurrentIndex,
+  ) {
+    Color primary = Theme.of(context).colorScheme.primary;
+    Color onSurface = Theme.of(context).colorScheme.onSurface;
+
+    String title = '';
+    switch (dataType) {
+      case VideoEpidoesType.videoEpisode:
+        title = episode.title;
+        break;
+      case VideoEpidoesType.videoPart:
+        title = episode.pagePart;
+        break;
+      case VideoEpidoesType.bangumiEpisode:
+        title = '第${episode.title}话  ${episode.longTitle!}';
+        break;
+    }
+    return ListTile(
+      onTap: () {
+        SmartDialog.showToast('切换至「$title」');
+        changeFucCall.call(episode, index);
+      },
+      dense: false,
+      leading: isCurrentIndex
+          ? Image.asset(
+              'assets/images/live.gif',
+              color: primary,
+              height: 12,
+            )
+          : null,
+      title: Text(
+        title,
+        style: TextStyle(
+          fontSize: 14,
+          color: isCurrentIndex ? primary : onSurface,
+        ),
+      ),
+    );
+  }
+
+  Widget buildTitle() {
+    return AppBar(
+      toolbarHeight: 45,
+      automaticallyImplyLeading: false,
+      centerTitle: false,
+      title: Text(
+        '合集（${episodes.length}）',
+        style: Theme.of(context).textTheme.titleMedium,
+      ),
+      actions: [
+        IconButton(
+          icon: const Icon(Icons.close, size: 20),
+          onPressed: () => Navigator.pop(context),
+        ),
+        const SizedBox(width: 14),
+      ],
+    );
+  }
+
+  /// The [BuildContext] of the widget that calls the bottom sheet.
+  PersistentBottomSheetController show(BuildContext context) {
+    final ItemScrollController itemScrollController = ItemScrollController();
+    int currentIndex = episodes.indexWhere((dynamic e) => e.cid == currentCid);
+    final PersistentBottomSheetController btmSheetCtr = showBottomSheet(
+      context: context,
+      builder: (BuildContext context) {
+        return StatefulBuilder(
+            builder: (BuildContext context, StateSetter setState) {
+          WidgetsBinding.instance.addPostFrameCallback((_) {
+            itemScrollController.jumpTo(index: currentIndex);
+          });
+          return Container(
+            height: sheetHeight,
+            color: Theme.of(context).colorScheme.background,
+            child: Column(
+              children: [
+                buildTitle(),
+                Expanded(
+                  child: Material(
+                    child: ScrollablePositionedList.builder(
+                      itemScrollController: itemScrollController,
+                      itemCount: episodes.length + 1,
+                      itemBuilder: (BuildContext context, int index) {
+                        bool isLastItem = index == episodes.length;
+                        bool isCurrentIndex = currentIndex == index;
+                        return isLastItem
+                            ? SizedBox(
+                                height:
+                                    MediaQuery.of(context).padding.bottom + 20,
+                              )
+                            : buildEpisodeListItem(
+                                episodes[index],
+                                index,
+                                isCurrentIndex,
+                              );
+                      },
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          );
+        });
+      },
+    );
+    return btmSheetCtr;
+  }
+}

lib/models/common/video_episode_type.dart

@@ -0,0 +1,5 @@
+enum VideoEpidoesType {
+  videoEpisode,
+  videoPart,
+  bangumiEpisode,
+}

lib/pages/bangumi/introduction/view.dart

@@ -138,6 +138,9 @@ class _BangumiInfoState extends State<BangumiInfo> {
     cid = widget.cid!;
     videoDetailCtr.cid.listen((p0) {
       cid = p0;
+      if (!mounted) {
+        return;
+      }
       setState(() {});
     });
   }
@@ -317,7 +320,7 @@ class _BangumiInfoState extends State<BangumiInfo> {
           if (widget.bangumiDetail!.episodes!.isNotEmpty) ...[
             BangumiPanel(
               pages: widget.bangumiDetail!.episodes!,
-              cid: cid ?? widget.bangumiDetail!.episodes!.first.cid,
+              cid: cid! ?? widget.bangumiDetail!.episodes!.first.cid!,
               sheetHeight: sheetHeight,
               changeFuc: (bvid, cid, aid) =>
                   bangumiIntroController.changeSeasonOrbangu(bvid, cid, aid),

lib/pages/bangumi/widgets/bangumi_panel.dart

@@ -1,3 +1,5 @@
+import 'dart:math';
+
 import 'package:flutter/material.dart';
 import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
 import 'package:get/get.dart';
@@ -6,19 +8,21 @@ import 'package:pilipala/models/bangumi/info.dart';
 import 'package:pilipala/pages/video/detail/index.dart';
 import 'package:pilipala/utils/storage.dart';
 import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
+import '../../../common/pages_bottom_sheet.dart';
+import '../../../models/common/video_episode_type.dart';
 
 class BangumiPanel extends StatefulWidget {
   const BangumiPanel({
     super.key,
     required this.pages,
-    this.cid,
+    required this.cid,
     this.sheetHeight,
     this.changeFuc,
     this.bangumiDetail,
   });
 
   final List<EpisodeItem> pages;
-  final int? cid;
+  final int cid;
   final double? sheetHeight;
   final Function? changeFuc;
   final BangumiInfoModel? bangumiDetail;
@@ -28,9 +32,8 @@ class BangumiPanel extends StatefulWidget {
 }
 
 class _BangumiPanelState extends State<BangumiPanel> {
-  late int currentIndex;
+  late RxInt currentIndex = (-1).obs;
   final ScrollController listViewScrollCtr = ScrollController();
-  final ScrollController listViewScrollCtr_2 = ScrollController();
   Box userInfoCache = GStrorage.userInfo;
   dynamic userInfo;
   // 默认未开通
@@ -39,169 +42,68 @@ class _BangumiPanelState extends State<BangumiPanel> {
   String heroTag = Get.arguments['heroTag'];
   late final VideoDetailController videoDetailCtr;
   final ItemScrollController itemScrollController = ItemScrollController();
+  late PersistentBottomSheetController? _bottomSheetController;
 
   @override
   void initState() {
     super.initState();
-    cid = widget.cid!;
+    cid = widget.cid;
-    currentIndex = widget.pages.indexWhere((e) => e.cid == cid);
+    videoDetailCtr = Get.find<VideoDetailController>(tag: heroTag);
+    currentIndex.value =
+        widget.pages.indexWhere((EpisodeItem e) => e.cid == cid);
     scrollToIndex();
+    videoDetailCtr.cid.listen((int p0) {
+      cid = p0;
+      currentIndex.value =
+          widget.pages.indexWhere((EpisodeItem e) => e.cid == cid);
+      scrollToIndex();
+    });
+
+    /// 获取大会员状态
     userInfo = userInfoCache.get('userInfoCache');
     if (userInfo != null) {
       vipStatus = userInfo.vipStatus;
     }
-    videoDetailCtr = Get.find<VideoDetailController>(tag: heroTag);
-
-    videoDetailCtr.cid.listen((int p0) {
-      cid = p0;
-      setState(() {});
-      currentIndex = widget.pages.indexWhere((EpisodeItem e) => e.cid == cid);
-      scrollToIndex();
-    });
   }
 
   @override
   void dispose() {
     listViewScrollCtr.dispose();
-    listViewScrollCtr_2.dispose();
     super.dispose();
   }
 
-  Widget buildPageListItem(
-    EpisodeItem page,
-    int index,
-    bool isCurrentIndex,
-  ) {
-    Color primary = Theme.of(context).colorScheme.primary;
-    return ListTile(
-      onTap: () {
-        Get.back();
-        setState(() {
-          changeFucCall(page, index);
-        });
-      },
-      dense: false,
-      leading: isCurrentIndex
-          ? Image.asset(
-              'assets/images/live.gif',
-              color: primary,
-              height: 12,
-            )
-          : null,
-      title: Text(
-        '第${page.title}话  ${page.longTitle!}',
-        style: TextStyle(
-          fontSize: 14,
-          color: isCurrentIndex
-              ? primary
-              : Theme.of(context).colorScheme.onSurface,
-        ),
-      ),
-      trailing: page.badge != null
-          ? Text(
-              page.badge!,
-              style: TextStyle(
-                color: Theme.of(context).colorScheme.primary,
-              ),
-            )
-          : const SizedBox(),
-    );
-  }
-
-  void showBangumiPanel() {
-    showBottomSheet(
-      context: context,
-      builder: (BuildContext context) {
-        return StatefulBuilder(
-          builder: (BuildContext context, StateSetter setState) {
-            WidgetsBinding.instance.addPostFrameCallback((_) async {
-              // await Future.delayed(const Duration(milliseconds: 200));
-              // listViewScrollCtr_2.animateTo(currentIndex * 56,
-              //     duration: const Duration(milliseconds: 500),
-              //     curve: Curves.easeInOut);
-              itemScrollController.jumpTo(index: currentIndex);
-            });
-            // 在这里使用 setState 更新状态
-            return Container(
-              height: widget.sheetHeight,
-              color: Theme.of(context).colorScheme.background,
-              child: Column(
-                children: [
-                  AppBar(
-                    toolbarHeight: 45,
-                    automaticallyImplyLeading: false,
-                    title: Row(
-                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                      children: [
-                        Text(
-                          '合集（${widget.pages.length}）',
-                          style: Theme.of(context).textTheme.titleMedium,
-                        ),
-                        IconButton(
-                          icon: const Icon(Icons.close),
-                          onPressed: () => Navigator.pop(context),
-                        ),
-                      ],
-                    ),
-                    titleSpacing: 10,
-                  ),
-                  Expanded(
-                    child: Material(
-                      child: ScrollablePositionedList.builder(
-                        itemCount: widget.pages.length + 1,
-                        itemBuilder: (BuildContext context, int index) {
-                          bool isLastItem = index == widget.pages.length;
-                          bool isCurrentIndex = currentIndex == index;
-                          return isLastItem
-                              ? SizedBox(
-                                  height:
-                                      MediaQuery.of(context).padding.bottom +
-                                          20,
-                                )
-                              : buildPageListItem(
-                                  widget.pages[index],
-                                  index,
-                                  isCurrentIndex,
-                                );
-                        },
-                        itemScrollController: itemScrollController,
-                      ),
-                    ),
-                  ),
-                ],
-              ),
-            );
-          },
-        );
-      },
-    );
-  }
-
   void changeFucCall(item, i) async {
     if (item.badge != null && item.badge == '会员' && vipStatus != 1) {
       SmartDialog.showToast('需要大会员');
       return;
     }
-    await widget.changeFuc!(
+    widget.changeFuc?.call(
       item.bvid,
       item.cid,
       item.aid,
     );
+    _bottomSheetController?.close();
     currentIndex = i;
-    setState(() {});
     scrollToIndex();
   }
 
   void scrollToIndex() {
     WidgetsBinding.instance.addPostFrameCallback((_) {
       // 在回调函数中获取更新后的状态
-      listViewScrollCtr.animateTo(currentIndex * 150,
+      final double offset = min((currentIndex * 150) - 75,
-          duration: const Duration(milliseconds: 500), curve: Curves.easeInOut);
+          listViewScrollCtr.position.maxScrollExtent);
+      listViewScrollCtr.animateTo(
+        offset,
+        duration: const Duration(milliseconds: 300),
+        curve: Curves.easeInOut,
+      );
     });
   }
 
   @override
   Widget build(BuildContext context) {
+    Color primary = Theme.of(context).colorScheme.primary;
+    Color onSurface = Theme.of(context).colorScheme.onSurface;
     return Column(
       children: [
         Padding(
@@ -211,12 +113,14 @@ class _BangumiPanelState extends State<BangumiPanel> {
             children: [
               const Text('选集 '),
               Expanded(
-                child: Text(
+                child: Obx(
-                  ' 正在播放：${widget.pages[currentIndex].longTitle}',
+                  () => Text(
-                  overflow: TextOverflow.ellipsis,
+                    ' 正在播放：${widget.pages[currentIndex.value].longTitle}',
-                  style: TextStyle(
+                    overflow: TextOverflow.ellipsis,
-                    fontSize: 12,
+                    style: TextStyle(
-                    color: Theme.of(context).colorScheme.outline,
+                      fontSize: 12,
+                      color: Theme.of(context).colorScheme.outline,
+                    ),
                   ),
                 ),
               ),
@@ -227,7 +131,16 @@ class _BangumiPanelState extends State<BangumiPanel> {
                   style: ButtonStyle(
                     padding: MaterialStateProperty.all(EdgeInsets.zero),
                   ),
-                  onPressed: () => showBangumiPanel(),
+                  onPressed: () {
+                    _bottomSheetController = EpisodeBottomSheet(
+                      currentCid: cid,
+                      episodes: widget.pages,
+                      changeFucCall: changeFucCall,
+                      sheetHeight: widget.sheetHeight,
+                      dataType: VideoEpidoesType.bangumiEpisode,
+                      context: context,
+                    ).show(context);
+                  },
                   child: Text(
                     '${widget.bangumiDetail!.newEp!['desc']}',
                     style: const TextStyle(fontSize: 13),
@@ -245,6 +158,8 @@ class _BangumiPanelState extends State<BangumiPanel> {
             itemCount: widget.pages.length,
             itemExtent: 150,
             itemBuilder: (BuildContext context, int i) {
+              var page = widget.pages[i];
+              bool isSelected = i == currentIndex.value;
               return Container(
                 width: 150,
                 margin: const EdgeInsets.only(right: 10),
@@ -253,42 +168,37 @@ class _BangumiPanelState extends State<BangumiPanel> {
                   borderRadius: BorderRadius.circular(6),
                   clipBehavior: Clip.hardEdge,
                   child: InkWell(
-                    onTap: () => changeFucCall(widget.pages[i], i),
+                    onTap: () => changeFucCall(page, i),
                     child: Padding(
                       padding: const EdgeInsets.symmetric(
-                          vertical: 8, horizontal: 10),
+                        vertical: 8,
+                        horizontal: 10,
+                      ),
                       child: Column(
                         crossAxisAlignment: CrossAxisAlignment.start,
                         children: <Widget>[
                           Row(
                             children: [
-                              if (i == currentIndex) ...<Widget>[
+                              if (isSelected) ...<Widget>[
-                                Image.asset(
+                                Image.asset('assets/images/live.png',
-                                  'assets/images/live.png',
+                                    color: primary, height: 12),
-                                  color: Theme.of(context).colorScheme.primary,
-                                  height: 12,
-                                ),
                                 const SizedBox(width: 6)
                               ],
                               Text(
                                 '第${i + 1}话',
                                 style: TextStyle(
-                                    fontSize: 13,
+                                  fontSize: 13,
-                                    color: i == currentIndex
+                                  color: isSelected ? primary : onSurface,
-                                        ? Theme.of(context).colorScheme.primary
+                                ),
-                                        : Theme.of(context)
-                                            .colorScheme
-                                            .onSurface),
                               ),
                               const SizedBox(width: 2),
-                              if (widget.pages[i].badge != null) ...[
+                              if (page.badge != null) ...[
                                 const Spacer(),
                                 Text(
-                                  widget.pages[i].badge!,
+                                  page.badge!,
                                   style: TextStyle(
                                     fontSize: 12,
-                                    color:
+                                    color: primary,
-                                        Theme.of(context).colorScheme.primary,
                                   ),
                                 ),
                               ]
@@ -296,13 +206,12 @@ class _BangumiPanelState extends State<BangumiPanel> {
                           ),
                           const SizedBox(height: 3),
                           Text(
-                            widget.pages[i].longTitle!,
+                            page.longTitle!,
                             maxLines: 1,
                             style: TextStyle(
-                                fontSize: 13,
+                              fontSize: 13,
-                                color: i == currentIndex
+                              color: isSelected ? primary : onSurface,
-                                    ? Theme.of(context).colorScheme.primary
+                            ),
-                                    : Theme.of(context).colorScheme.onSurface),
                             overflow: TextOverflow.ellipsis,
                           )
                         ],

lib/pages/video/detail/introduction/controller.dart

@@ -25,15 +25,10 @@ class VideoIntroController extends GetxController {
   VideoIntroController({required this.bvid});
   // 视频bvid
   String bvid;
-  // 请求状态
-  RxBool isLoading = false.obs;
-
   // 视频详情 请求返回
   Rx<VideoDetailData> videoDetail = VideoDetailData().obs;
-
   // up主粉丝数
   Map userStat = {'follower': '-'};
-
   // 是否点赞
   RxBool hasLike = false.obs;
   // 是否投币
@@ -59,6 +54,7 @@ class VideoIntroController extends GetxController {
   bool isPaused = false;
   String heroTag = '';
   late ModelResult modelResult;
+  late PersistentBottomSheetController? bottomSheetController;
 
   @override
   void onInit() {
@@ -562,4 +558,8 @@ class VideoIntroController extends GetxController {
     }
     return res;
   }
+
+  hiddenEpisodeBottomSheet() {
+    bottomSheetController?.close();
+  }
 }

lib/pages/video/detail/introduction/view.dart

@@ -20,8 +20,8 @@ import '../../../../http/user.dart';
 import 'widgets/action_item.dart';
 import 'widgets/fav_panel.dart';
 import 'widgets/intro_detail.dart';
-import 'widgets/page.dart';
+import 'widgets/page_panel.dart';
-import 'widgets/season.dart';
+import 'widgets/season_panel.dart';
 
 class VideoIntroPanel extends StatefulWidget {
   final String bvid;
@@ -384,18 +384,25 @@ class _VideoInfoState extends State<VideoInfo> with TickerProviderStateMixin {
                 sheetHeight: sheetHeight,
                 changeFuc: (bvid, cid, aid) =>
                     videoIntroController.changeSeasonOrbangu(bvid, cid, aid),
+                videoIntroCtr: videoIntroController,
               ),
             )
           ],
           if (widget.videoDetail!.pages != null &&
               widget.videoDetail!.pages!.length > 1) ...[
-            Obx(() => PagesPanel(
+            Obx(
-                  pages: widget.videoDetail!.pages!,
+              () => PagesPanel(
-                  cid: videoIntroController.lastPlayCid.value,
+                pages: widget.videoDetail!.pages!,
-                  sheetHeight: sheetHeight,
+                cid: videoIntroController.lastPlayCid.value,
-                  changeFuc: (cid) => videoIntroController.changeSeasonOrbangu(
+                sheetHeight: sheetHeight,
-                      videoIntroController.bvid, cid, null),
+                changeFuc: (cid) => videoIntroController.changeSeasonOrbangu(
-                ))
+                  videoIntroController.bvid,
+                  cid,
+                  null,
+                ),
+                videoIntroCtr: videoIntroController,
+              ),
+            )
           ],
           GestureDetector(
             onTap: onPushMember,

lib/pages/video/detail/introduction/widgets/page.dart

@@ -1,258 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:get/get.dart';
-import 'package:pilipala/models/video_detail_res.dart';
-import 'package:pilipala/pages/video/detail/index.dart';
-
-class PagesPanel extends StatefulWidget {
-  const PagesPanel({
-    super.key,
-    required this.pages,
-    this.cid,
-    this.sheetHeight,
-    this.changeFuc,
-  });
-  final List<Part> pages;
-  final int? cid;
-  final double? sheetHeight;
-  final Function? changeFuc;
-
-  @override
-  State<PagesPanel> createState() => _PagesPanelState();
-}
-
-class _PagesPanelState extends State<PagesPanel> {
-  late List<Part> episodes;
-  late int cid;
-  late int currentIndex;
-  final String heroTag = Get.arguments['heroTag'];
-  late VideoDetailController _videoDetailController;
-  final ScrollController _scrollController = ScrollController();
-
-  @override
-  void initState() {
-    super.initState();
-    cid = widget.cid!;
-    episodes = widget.pages;
-    _videoDetailController = Get.find<VideoDetailController>(tag: heroTag);
-    currentIndex = episodes.indexWhere((Part e) => e.cid == cid);
-    _videoDetailController.cid.listen((int p0) {
-      cid = p0;
-      setState(() {});
-      currentIndex = episodes.indexWhere((Part e) => e.cid == cid);
-    });
-  }
-
-  void changeFucCall(item, i) async {
-    await widget.changeFuc!(
-      item.cid,
-    );
-    currentIndex = i;
-    setState(() {});
-  }
-
-  @override
-  void dispose() {
-    _scrollController.dispose();
-    super.dispose();
-  }
-
-  Widget buildEpisodeListItem(
-    Part episode,
-    int index,
-    bool isCurrentIndex,
-  ) {
-    Color primary = Theme.of(context).colorScheme.primary;
-    return ListTile(
-      onTap: () {
-        changeFucCall(episode, index);
-        Get.back();
-      },
-      dense: false,
-      leading: isCurrentIndex
-          ? Image.asset(
-              'assets/images/live.gif',
-              color: primary,
-              height: 12,
-            )
-          : null,
-      title: Text(
-        episode.pagePart!,
-        style: TextStyle(
-          fontSize: 14,
-          color: isCurrentIndex
-              ? primary
-              : Theme.of(context).colorScheme.onSurface,
-        ),
-      ),
-    );
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Column(
-      children: <Widget>[
-        Padding(
-          padding: const EdgeInsets.only(top: 10, bottom: 2),
-          child: Row(
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-            children: [
-              const Text('视频选集 '),
-              Expanded(
-                child: Text(
-                  ' 正在播放：${widget.pages[currentIndex].pagePart}',
-                  overflow: TextOverflow.ellipsis,
-                  style: TextStyle(
-                    fontSize: 12,
-                    color: Theme.of(context).colorScheme.outline,
-                  ),
-                ),
-              ),
-              const SizedBox(width: 10),
-              SizedBox(
-                height: 34,
-                child: TextButton(
-                  style: ButtonStyle(
-                    padding: MaterialStateProperty.all(EdgeInsets.zero),
-                  ),
-                  onPressed: () {
-                    showBottomSheet(
-                      context: context,
-                      builder: (BuildContext context) {
-                        return StatefulBuilder(builder:
-                            (BuildContext context, StateSetter setState) {
-                          WidgetsBinding.instance
-                              .addPostFrameCallback((_) async {
-                            await Future.delayed(
-                                const Duration(milliseconds: 200));
-                            _scrollController.jumpTo(currentIndex * 56);
-                          });
-                          return Container(
-                            height: widget.sheetHeight,
-                            color: Theme.of(context).colorScheme.background,
-                            child: Column(
-                              children: [
-                                Container(
-                                  height: 45,
-                                  padding: const EdgeInsets.only(
-                                      left: 14, right: 14),
-                                  child: Row(
-                                    mainAxisAlignment:
-                                        MainAxisAlignment.spaceBetween,
-                                    children: [
-                                      Text(
-                                        '合集（${episodes.length}）',
-                                        style: Theme.of(context)
-                                            .textTheme
-                                            .titleMedium,
-                                      ),
-                                      IconButton(
-                                        icon: const Icon(Icons.close),
-                                        onPressed: () => Navigator.pop(context),
-                                      ),
-                                    ],
-                                  ),
-                                ),
-                                Divider(
-                                  height: 1,
-                                  color: Theme.of(context)
-                                      .dividerColor
-                                      .withOpacity(0.1),
-                                ),
-                                Expanded(
-                                  child: Material(
-                                    child: ListView.builder(
-                                      controller: _scrollController,
-                                      itemCount: episodes.length + 1,
-                                      itemBuilder:
-                                          (BuildContext context, int index) {
-                                        bool isLastItem =
-                                            index == episodes.length;
-                                        bool isCurrentIndex =
-                                            currentIndex == index;
-                                        return isLastItem
-                                            ? SizedBox(
-                                                height: MediaQuery.of(context)
-                                                        .padding
-                                                        .bottom +
-                                                    20,
-                                              )
-                                            : buildEpisodeListItem(
-                                                episodes[index],
-                                                index,
-                                                isCurrentIndex,
-                                              );
-                                      },
-                                    ),
-                                  ),
-                                ),
-                              ],
-                            ),
-                          );
-                        });
-                      },
-                    );
-                  },
-                  child: Text(
-                    '共${widget.pages.length}集',
-                    style: const TextStyle(fontSize: 13),
-                  ),
-                ),
-              ),
-            ],
-          ),
-        ),
-        Container(
-          height: 35,
-          margin: const EdgeInsets.only(bottom: 8),
-          child: ListView.builder(
-            scrollDirection: Axis.horizontal,
-            itemCount: widget.pages.length,
-            itemExtent: 150,
-            itemBuilder: (BuildContext context, int i) {
-              bool isCurrentIndex = currentIndex == i;
-              return Container(
-                width: 150,
-                margin: const EdgeInsets.only(right: 10),
-                child: Material(
-                  color: Theme.of(context).colorScheme.onInverseSurface,
-                  borderRadius: BorderRadius.circular(6),
-                  clipBehavior: Clip.hardEdge,
-                  child: InkWell(
-                    onTap: () => changeFucCall(widget.pages[i], i),
-                    child: Padding(
-                      padding: const EdgeInsets.symmetric(
-                          vertical: 8, horizontal: 8),
-                      child: Row(
-                        children: <Widget>[
-                          if (isCurrentIndex) ...<Widget>[
-                            Image.asset(
-                              'assets/images/live.gif',
-                              color: Theme.of(context).colorScheme.primary,
-                              height: 12,
-                            ),
-                            const SizedBox(width: 6)
-                          ],
-                          Expanded(
-                              child: Text(
-                            widget.pages[i].pagePart!,
-                            maxLines: 1,
-                            style: TextStyle(
-                                fontSize: 13,
-                                color: isCurrentIndex
-                                    ? Theme.of(context).colorScheme.primary
-                                    : Theme.of(context).colorScheme.onSurface),
-                            overflow: TextOverflow.ellipsis,
-                          ))
-                        ],
-                      ),
-                    ),
-                  ),
-                ),
-              );
-            },
-          ),
-        )
-      ],
-    );
-  }
-}

lib/pages/video/detail/introduction/widgets/page_panel.dart

@@ -0,0 +1,184 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:pilipala/models/video_detail_res.dart';
+import 'package:pilipala/pages/video/detail/index.dart';
+import 'package:pilipala/pages/video/detail/introduction/index.dart';
+import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
+import '../../../../../common/pages_bottom_sheet.dart';
+import '../../../../../models/common/video_episode_type.dart';
+
+class PagesPanel extends StatefulWidget {
+  const PagesPanel({
+    super.key,
+    required this.pages,
+    required this.cid,
+    this.sheetHeight,
+    this.changeFuc,
+    required this.videoIntroCtr,
+  });
+  final List<Part> pages;
+  final int cid;
+  final double? sheetHeight;
+  final Function? changeFuc;
+  final VideoIntroController videoIntroCtr;
+
+  @override
+  State<PagesPanel> createState() => _PagesPanelState();
+}
+
+class _PagesPanelState extends State<PagesPanel> {
+  late List<Part> episodes;
+  late int cid;
+  late RxInt currentIndex = (-1).obs;
+  final String heroTag = Get.arguments['heroTag'];
+  late VideoDetailController _videoDetailController;
+  final ScrollController listViewScrollCtr = ScrollController();
+  final ItemScrollController itemScrollController = ItemScrollController();
+  late PersistentBottomSheetController? _bottomSheetController;
+
+  @override
+  void initState() {
+    super.initState();
+    cid = widget.cid;
+    episodes = widget.pages;
+    _videoDetailController = Get.find<VideoDetailController>(tag: heroTag);
+    currentIndex.value = episodes.indexWhere((Part e) => e.cid == cid);
+    scrollToIndex();
+    _videoDetailController.cid.listen((int p0) {
+      cid = p0;
+      currentIndex.value = episodes.indexWhere((Part e) => e.cid == cid);
+      scrollToIndex();
+    });
+  }
+
+  @override
+  void dispose() {
+    listViewScrollCtr.dispose();
+    super.dispose();
+  }
+
+  void changeFucCall(item, i) async {
+    widget.changeFuc?.call(item.cid);
+    currentIndex.value = i;
+    _bottomSheetController?.close();
+    scrollToIndex();
+  }
+
+  void scrollToIndex() {
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      // 在回调函数中获取更新后的状态
+      final double offset = min((currentIndex * 150) - 75,
+          listViewScrollCtr.position.maxScrollExtent);
+      listViewScrollCtr.animateTo(
+        offset,
+        duration: const Duration(milliseconds: 300),
+        curve: Curves.easeInOut,
+      );
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: <Widget>[
+        Padding(
+          padding: const EdgeInsets.only(top: 10, bottom: 2),
+          child: Row(
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            children: [
+              const Text('视频选集 '),
+              Expanded(
+                child: Obx(() => Text(
+                      ' 正在播放：${widget.pages[currentIndex.value].pagePart}',
+                      overflow: TextOverflow.ellipsis,
+                      style: TextStyle(
+                        fontSize: 12,
+                        color: Theme.of(context).colorScheme.outline,
+                      ),
+                    )),
+              ),
+              const SizedBox(width: 10),
+              SizedBox(
+                height: 34,
+                child: TextButton(
+                  style: ButtonStyle(
+                    padding: MaterialStateProperty.all(EdgeInsets.zero),
+                  ),
+                  onPressed: () {
+                    widget.videoIntroCtr.bottomSheetController =
+                        _bottomSheetController = EpisodeBottomSheet(
+                      currentCid: cid,
+                      episodes: episodes,
+                      changeFucCall: changeFucCall,
+                      sheetHeight: widget.sheetHeight,
+                      dataType: VideoEpidoesType.videoPart,
+                      context: context,
+                    ).show(context);
+                  },
+                  child: Text(
+                    '共${widget.pages.length}集',
+                    style: const TextStyle(fontSize: 13),
+                  ),
+                ),
+              ),
+            ],
+          ),
+        ),
+        Container(
+          height: 35,
+          margin: const EdgeInsets.only(bottom: 8),
+          child: ListView.builder(
+            scrollDirection: Axis.horizontal,
+            controller: listViewScrollCtr,
+            itemCount: widget.pages.length,
+            itemExtent: 150,
+            itemBuilder: (BuildContext context, int i) {
+              bool isCurrentIndex = currentIndex.value == i;
+              return Container(
+                width: 150,
+                margin: const EdgeInsets.only(right: 10),
+                child: Material(
+                  color: Theme.of(context).colorScheme.onInverseSurface,
+                  borderRadius: BorderRadius.circular(6),
+                  clipBehavior: Clip.hardEdge,
+                  child: InkWell(
+                    onTap: () => changeFucCall(widget.pages[i], i),
+                    child: Padding(
+                      padding: const EdgeInsets.symmetric(
+                          vertical: 8, horizontal: 8),
+                      child: Row(
+                        children: <Widget>[
+                          if (isCurrentIndex) ...<Widget>[
+                            Image.asset(
+                              'assets/images/live.gif',
+                              color: Theme.of(context).colorScheme.primary,
+                              height: 12,
+                            ),
+                            const SizedBox(width: 6)
+                          ],
+                          Expanded(
+                              child: Text(
+                            widget.pages[i].pagePart!,
+                            maxLines: 1,
+                            style: TextStyle(
+                                fontSize: 13,
+                                color: isCurrentIndex
+                                    ? Theme.of(context).colorScheme.primary
+                                    : Theme.of(context).colorScheme.onSurface),
+                            overflow: TextOverflow.ellipsis,
+                          ))
+                        ],
+                      ),
+                    ),
+                  ),
+                ),
+              );
+            },
+          ),
+        )
+      ],
+    );
+  }
+}

lib/pages/video/detail/introduction/widgets/season_panel.dart

@@ -1,9 +1,12 @@
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
+import 'package:pilipala/common/pages_bottom_sheet.dart';
 import 'package:pilipala/models/video_detail_res.dart';
 import 'package:pilipala/pages/video/detail/index.dart';
 import 'package:pilipala/utils/id_utils.dart';
 import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
+import '../../../../../models/common/video_episode_type.dart';
+import '../controller.dart';
 
 class SeasonPanel extends StatefulWidget {
   const SeasonPanel({
@@ -12,11 +15,13 @@ class SeasonPanel extends StatefulWidget {
     this.cid,
     this.sheetHeight,
     this.changeFuc,
+    required this.videoIntroCtr,
   });
   final UgcSeason ugcSeason;
   final int? cid;
   final double? sheetHeight;
   final Function? changeFuc;
+  final VideoIntroController videoIntroCtr;
 
   @override
   State<SeasonPanel> createState() => _SeasonPanelState();
@@ -28,8 +33,8 @@ class _SeasonPanelState extends State<SeasonPanel> {
   late int currentIndex;
   final String heroTag = Get.arguments['heroTag'];
   late VideoDetailController _videoDetailController;
-  final ScrollController _scrollController = ScrollController();
   final ItemScrollController itemScrollController = ItemScrollController();
+  late PersistentBottomSheetController? _bottomSheetController;
 
   @override
   void initState() {
@@ -52,9 +57,6 @@ class _SeasonPanelState extends State<SeasonPanel> {
     }
 
     /// 取对应 season_id 的 episodes
-    // episodes = widget.ugcSeason.sections!
-    //     .firstWhere((e) => e.seasonId == widget.ugcSeason.id)
-    //     .episodes!;
     currentIndex = episodes.indexWhere((EpisodeItem e) => e.cid == cid);
     _videoDetailController.cid.listen((int p0) {
       cid = p0;
@@ -64,22 +66,16 @@ class _SeasonPanelState extends State<SeasonPanel> {
   }
 
   void changeFucCall(item, int i) async {
-    await widget.changeFuc!(
+    widget.changeFuc?.call(
       IdUtils.av2bv(item.aid),
       item.cid,
       item.aid,
     );
     currentIndex = i;
-    Get.back();
+    _bottomSheetController?.close();
     setState(() {});
   }
 
-  @override
-  void dispose() {
-    _scrollController.dispose();
-    super.dispose();
-  }
-
   Widget buildEpisodeListItem(
     EpisodeItem episode,
     int index,
@@ -123,71 +119,17 @@ class _SeasonPanelState extends State<SeasonPanel> {
           borderRadius: BorderRadius.circular(6),
           clipBehavior: Clip.hardEdge,
           child: InkWell(
-            onTap: () => showBottomSheet(
+            onTap: () {
-              context: context,
+              widget.videoIntroCtr.bottomSheetController =
-              builder: (BuildContext context) {
+                  _bottomSheetController = EpisodeBottomSheet(
-                return StatefulBuilder(
+                currentCid: cid,
-                    builder: (BuildContext context, StateSetter setState) {
+                episodes: episodes,
-                  WidgetsBinding.instance.addPostFrameCallback((_) async {
+                changeFucCall: changeFucCall,
-                    itemScrollController.jumpTo(index: currentIndex);
+                sheetHeight: widget.sheetHeight,
-                  });
+                dataType: VideoEpidoesType.videoEpisode,
-                  return Container(
+                context: context,
-                    height: widget.sheetHeight,
+              ).show(context);
-                    color: Theme.of(context).colorScheme.background,
+            },
-                    child: Column(
-                      children: [
-                        Container(
-                          height: 45,
-                          padding: const EdgeInsets.only(left: 14, right: 14),
-                          child: Row(
-                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                            children: [
-                              Text(
-                                '合集（${episodes.length}）',
-                                style: Theme.of(context).textTheme.titleMedium,
-                              ),
-                              IconButton(
-                                icon: const Icon(Icons.close),
-                                onPressed: () => Navigator.pop(context),
-                              ),
-                            ],
-                          ),
-                        ),
-                        Divider(
-                          height: 1,
-                          color:
-                              Theme.of(context).dividerColor.withOpacity(0.1),
-                        ),
-                        Expanded(
-                          child: Material(
-                            child: ScrollablePositionedList.builder(
-                              itemCount: episodes.length + 1,
-                              itemBuilder: (BuildContext context, int index) {
-                                bool isLastItem = index == episodes.length;
-                                bool isCurrentIndex = currentIndex == index;
-                                return isLastItem
-                                    ? SizedBox(
-                                        height: MediaQuery.of(context)
-                                                .padding
-                                                .bottom +
-                                            20,
-                                      )
-                                    : buildEpisodeListItem(
-                                        episodes[index],
-                                        index,
-                                        isCurrentIndex,
-                                      );
-                              },
-                              itemScrollController: itemScrollController,
-                            ),
-                          ),
-                        ),
-                      ],
-                    ),
-                  );
-                });
-              },
-            ),
             child: Padding(
               padding: const EdgeInsets.fromLTRB(8, 12, 8, 12),
               child: Row(

lib/pages/video/detail/view.dart

@@ -177,6 +177,7 @@ class _VideoDetailPageState extends State<VideoDetailPage>
     plPlayerController?.isFullScreen.listen((bool isFullScreen) {
       if (isFullScreen) {
         vdCtr.hiddenReplyReplyPanel();
+        videoIntroController.hiddenEpisodeBottomSheet();
       }
     });
   }

lib/pages/video/detail/widgets/header_control.dart

@@ -82,6 +82,7 @@ class _HeaderControlState extends State<HeaderControl> {
 
   /// 设置面板
   void showSettingSheet() {
+    // Scaffold.of(context).openDrawer();
     showModalBottomSheet(
       elevation: 0,
       context: context,
@@ -158,7 +159,7 @@ class _HeaderControlState extends State<HeaderControl> {
                       dense: true,
                       leading:
                           const Icon(Icons.hourglass_top_outlined, size: 20),
-                      title: const Text('定时关闭（测试）', style: titleStyle),
+                      title: const Text('定时关闭', style: titleStyle),
                     ),
                     ListTile(
                       onTap: () => {Get.back(), showSetVideoQa()},

lib/pages/video/detail/widgets/right_drawer.dart

@@ -0,0 +1,19 @@
+import 'package:flutter/material.dart';
+
+class RightDrawer extends StatefulWidget {
+  const RightDrawer({super.key});
+
+  @override
+  State<RightDrawer> createState() => _RightDrawerState();
+}
+
+class _RightDrawerState extends State<RightDrawer> {
+  @override
+  Widget build(BuildContext context) {
+    return Drawer(
+        shadowColor: Colors.transparent,
+        elevation: 0,
+        backgroundColor:
+            Theme.of(context).colorScheme.surface.withOpacity(0.8));
+  }
+}