- Optimize the scrolling experience in read page

- Optimize the double-tap zoom logic in read page - Remove the gesture of tag drag to scale in read page e bug that the local cache is not updated after reloading the image on the reading page - 优化阅读页放大滚动体验 - 优化阅读页双击放大逻辑 - 移除阅读页点击后拖拽放大手势 - 修复阅读页切换为双列模式时页面渲染异常的bug
jiangtian616 · Nov 3, 2024 · 5d9661b · 5d9661b
1 parent ddbad26
commit 5d9661b
Show file tree

Hide file tree

Showing 9 changed files with 90 additions and 67 deletions.
diff --git a/changelog/v8.0.5+267.md b/changelog/v8.0.5+267.md
@@ -1,13 +1,21 @@
 - 优化搜索标签提示
 - 适配E站不再能查看非本人上传画廊的排行数据的变动
 - 优化从分享链接打开app的跳转逻辑
+- 优化阅读页放大滚动体验
+- 优化阅读页双击放大逻辑
+- 移除阅读页点击后拖拽放大手势
 - 修复移动端退出主路由的问题
 - 修复阅读页重载图片后，本地缓存未更新的bug
+- 修复阅读页切换为双列模式时页面渲染异常的bug
 
 --------------------
 
 - Optimize the search tag prompt
 - Adapt to the change that users can no longer view the ranking data of galleries uploaded by others
 - Optimize the jump logic from the shared link to open the app
+- Optimize the scrolling experience in read page
+- Optimize the double-tap zoom logic in read page
+- Remove the gesture of tag drag to scale in read page    
+- Remove the gesture of dragging and zooming after clicking on the reading page
 - Fix the problem of exiting the main route on the mobile terminal
 - Fix the bug that the local cache is not updated after reloading the image on the reading page
diff --git a/lib/src/pages/read/layout/base/base_layout.dart b/lib/src/pages/read/layout/base/base_layout.dart
@@ -6,6 +6,7 @@ import 'package:get/get.dart';
 import 'package:jhentai/src/extension/get_logic_extension.dart';
 import 'package:jhentai/src/model/read_page_info.dart';
 import 'package:jhentai/src/setting/read_setting.dart';
+import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
 
 import '../../../../config/ui_config.dart';
 import '../../../../service/gallery_download_service.dart';
@@ -18,6 +19,25 @@ import '../../read_page_logic.dart';
 import '../../read_page_state.dart';
 import 'base_layout_logic.dart';
 
+class ScrollOffsetToScrollController extends ScrollController {
+  ScrollOffsetToScrollController({required this.scrollOffsetController});
+
+  final ScrollOffsetController scrollOffsetController;
+
+  @override
+  ScrollPosition get position => scrollOffsetController.position;
+
+  @override
+  Future<void> animateTo(double offset, {required Duration duration, required Curve curve}) async {
+    await position.animateTo(offset, duration: duration, curve: curve);
+  }
+
+  @override
+  void jumpTo(double value) {
+    scrollOffsetController.jumpTo(value: value);
+  }
+}
+
 abstract class BaseLayout extends StatelessWidget {
   BaseLayout({Key? key}) : super(key: key);
 

diff --git a/lib/src/pages/read/layout/horizontal_double_column/horizontal_double_column_layout.dart b/lib/src/pages/read/layout/horizontal_double_column/horizontal_double_column_layout.dart
@@ -25,26 +25,34 @@ class HorizontalDoubleColumnLayout extends BaseLayout {
   Widget buildBody(BuildContext context) {
     return EHWheelListener(
       onPointerScroll: logic.onPointerScroll,
-      child: PhotoViewGallery.builder(
-        scrollPhysics: const ClampingScrollPhysics(),
-        pageController: state.pageController,
-        cacheExtent: readPageState.readPageInfo.mode == ReadMode.online
-            ? (readSetting.preloadPageCount.value.toDouble() + 1) / 2
-            : (readSetting.preloadPageCountLocal.value.toDouble() + 1) / 2,
-        reverse: readSetting.isInRight2LeftDirection,
-        itemCount: state.pageCount,
-        builder: (context, index) => PhotoViewGalleryPageOptions.customChild(
-          initialScale: 1.0,
-          minScale: 1.0,
-          maxScale: 2.5,
-          scaleStateCycle: readSetting.enableDoubleTapToScaleUp.isTrue ? logic.scaleStateCycle : null,
-          enableTapDragZoom: readSetting.enableTapDragToScaleUp.isTrue,
-          child: index < 0 || index >= state.pageCount
-              ? null
-              : readPageState.readPageInfo.mode == ReadMode.online
-                  ? _buildDoubleColumnItemInOnlineMode(context, index)
-                  : _buildDoubleColumnItemInLocalMode(context, index),
-        ),
+      child: FutureBuilder(
+        future: logic.initCompleter.future,
+        builder: (context, snapshot) {
+          if (snapshot.connectionState == ConnectionState.done) {
+            return PhotoViewGallery.builder(
+              scrollPhysics: const ClampingScrollPhysics(),
+              pageController: state.pageController,
+              cacheExtent: readPageState.readPageInfo.mode == ReadMode.online
+                  ? (readSetting.preloadPageCount.value.toDouble() + 1) / 2
+                  : (readSetting.preloadPageCountLocal.value.toDouble() + 1) / 2,
+              reverse: readSetting.isInRight2LeftDirection,
+              itemCount: state.pageCount,
+              builder: (context, index) => PhotoViewGalleryPageOptions.customChild(
+                initialScale: 1.0,
+                minScale: 1.0,
+                maxScale: 2.5,
+                scaleStateCycle: readSetting.enableDoubleTapToScaleUp.isTrue ? logic.scaleStateCycle : null,
+                enableTapDragZoom: readSetting.enableTapDragToScaleUp.isTrue,
+                child: index < 0 || index >= state.pageCount
+                    ? null
+                    : readPageState.readPageInfo.mode == ReadMode.online
+                        ? _buildDoubleColumnItemInOnlineMode(context, index)
+                        : _buildDoubleColumnItemInLocalMode(context, index),
+              ),
+            );
+          }
+          return Container();
+        },
       ),
     );
   }

diff --git a/...src/pages/read/layout/horizontal_double_column/horizontal_double_column_layout_logic.dart b/...src/pages/read/layout/horizontal_double_column/horizontal_double_column_layout_logic.dart
@@ -16,6 +16,8 @@ import 'horizontal_double_column_layout_state.dart';
 class HorizontalDoubleColumnLayoutLogic extends BaseLayoutLogic {
   HorizontalDoubleColumnLayoutState state = HorizontalDoubleColumnLayoutState();
 
+  Completer<void> initCompleter = Completer<void>();
+
   @override
   Future<void> onInit() async {
     super.onInit();
@@ -35,6 +37,8 @@ class HorizontalDoubleColumnLayoutLogic extends BaseLayoutLogic {
 
     /// record reading progress and sync thumbnails list index
     state.pageController.addListener(_readProgressListener);
+
+    initCompleter.complete();
   }
 
   @override

diff --git a/lib/src/pages/read/layout/horizontal_list/horizontal_list_layout.dart b/lib/src/pages/read/layout/horizontal_list/horizontal_list_layout.dart
@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:jhentai/src/pages/read/layout/horizontal_list/horizontal_list_layout_state.dart';
-import 'package:photo_view/photo_view_gallery.dart';
 import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';
+import 'package:zoom_view/zoom_view.dart';
 
 import '../../../../model/read_page_info.dart';
 import '../../../../setting/read_setting.dart';
@@ -22,33 +22,27 @@ class HorizontalListLayout extends BaseLayout {
   @override
   Widget buildBody(BuildContext context) {
     /// user PhotoViewGallery to scale up the whole gallery list, so set itemCount to 1
-    return PhotoViewGallery.builder(
-      itemCount: 1,
-      builder: (_, __) => PhotoViewGalleryPageOptions.customChild(
-        controller: state.photoViewController,
-        initialScale: 1.0,
-        minScale: 1.0,
-        maxScale: 2.5,
-        scaleStateCycle: readSetting.enableDoubleTapToScaleUp.isTrue ? logic.scaleStateCycle : null,
-        enableTapDragZoom: readSetting.enableTapDragToScaleUp.isTrue,
-        child: EHWheelSpeedControllerForReadPage(
+    return ZoomView(
+      controller: ScrollOffsetToScrollController(scrollOffsetController: state.scrollOffsetController),
+      doubleTapScaleCircle: readSetting.enableDoubleTapToScaleUp.isTrue ? [1, 2] : [],
+      scrollAxis: Axis.horizontal,
+      child: EHWheelSpeedControllerForReadPage(
+        scrollOffsetController: state.scrollOffsetController,
+        child: ScrollablePositionedList.separated(
+          scrollDirection: Axis.horizontal,
+          reverse: readSetting.isInRight2LeftDirection,
+          physics: const ClampingScrollPhysics(),
+          minCacheExtent: readPageState.readPageInfo.mode == ReadMode.online
+              ? readSetting.preloadDistance * screenHeight * 1
+              : readSetting.preloadDistanceLocal * screenHeight * 1,
+          initialScrollIndex: readPageState.readPageInfo.initialIndex,
+          itemCount: readPageState.readPageInfo.pageCount,
+          itemScrollController: state.itemScrollController,
+          itemPositionsListener: state.itemPositionsListener,
           scrollOffsetController: state.scrollOffsetController,
-          child: ScrollablePositionedList.separated(
-            scrollDirection: Axis.horizontal,
-            reverse: readSetting.isInRight2LeftDirection,
-            physics: const ClampingScrollPhysics(),
-            minCacheExtent: readPageState.readPageInfo.mode == ReadMode.online
-                ? readSetting.preloadDistance * screenHeight * 1
-                : readSetting.preloadDistanceLocal * screenHeight * 1,
-            initialScrollIndex: readPageState.readPageInfo.initialIndex,
-            itemCount: readPageState.readPageInfo.pageCount,
-            itemScrollController: state.itemScrollController,
-            itemPositionsListener: state.itemPositionsListener,
-            scrollOffsetController: state.scrollOffsetController,
-            itemBuilder: (context, index) =>
-                readPageState.readPageInfo.mode == ReadMode.online ? buildItemInOnlineMode(context, index) : buildItemInLocalMode(context, index),
-            separatorBuilder: (_, __) => Obx(() => SizedBox(width: readSetting.imageSpace.value.toDouble())),
-          ),
+          itemBuilder: (context, index) =>
+              readPageState.readPageInfo.mode == ReadMode.online ? buildItemInOnlineMode(context, index) : buildItemInLocalMode(context, index),
+          separatorBuilder: (_, __) => Obx(() => SizedBox(width: readSetting.imageSpace.value.toDouble())),
         ),
       ),
     );

diff --git a/lib/src/pages/read/layout/vertical_list/vertical_list_layout.dart b/lib/src/pages/read/layout/vertical_list/vertical_list_layout.dart
@@ -11,20 +11,6 @@ import '../../../../widget/eh_wheel_speed_controller_for_read_page.dart';
 import '../base/base_layout.dart';
 import 'vertical_list_layout_logic.dart';
 
-class ScrollOffsetToScrollController extends ScrollController {
-  ScrollOffsetToScrollController({required this.scrollOffsetController});
-
-  final ScrollOffsetController scrollOffsetController;
-
-  @override
-  ScrollPosition get position => scrollOffsetController.position;
-
-  @override
-  void jumpTo(double value) {
-    scrollOffsetController.jumpTo(value: value);
-  }
-}
-
 class VerticalListLayout extends BaseLayout {
   VerticalListLayout({Key? key}) : super(key: key);
 
@@ -37,6 +23,7 @@ class VerticalListLayout extends BaseLayout {
     return GetBuilder<VerticalListLayoutLogic>(
       id: logic.verticalLayoutId,
       builder: (_) => ZoomView(
+        doubleTapScaleCircle: readSetting.enableDoubleTapToScaleUp.isTrue ? [1, 2] : [],
         controller: ScrollOffsetToScrollController(scrollOffsetController: state.scrollOffsetController),
         child: EHWheelSpeedControllerForReadPage(
           scrollOffsetController: state.scrollOffsetController,

diff --git a/lib/src/pages/setting/read/setting_read_page.dart b/lib/src/pages/setting/read/setting_read_page.dart
@@ -36,7 +36,7 @@ class SettingReadPage extends StatelessWidget {
               if (GetPlatform.isAndroid) _buildEnablePageTurnByVolumeKeys().center(),
               _buildEnablePageTurnAnime().center(),
               _buildEnableDoubleTapToScaleUp().center(),
-              _buildEnableTapDragToScaleUp().center(),
+              // _buildEnableTapDragToScaleUp().center(),
               _buildEnableBottomMenu().center(),
               _buildReverseTurnPageDirection().center(),
               _buildDisableTurnPageOnTap().center(),

diff --git a/pubspec.lock b/pubspec.lock
@@ -2081,10 +2081,11 @@ packages:
   zoom_view:
     dependency: "direct main"
     description:
-      name: zoom_view
-      sha256: fe1c6a0f5112836a7ac81d61396fef742151e419aa84bde57d47e72fd8669bee
-      url: "https://pub.dev"
-    source: hosted
+      path: "."
+      ref: HEAD
+      resolved-ref: ecb504e695dd848b8154a662870a2a43e8593d51
+      url: "https://github.com/jiangtian616/zoom_view"
+    source: git
     version: "0.0.15"
   zoom_widget:
     dependency: "direct main"

diff --git a/pubspec.yaml b/pubspec.yaml
@@ -63,7 +63,8 @@ dependencies:
     git:
       url: https://github.com/jiangtian616/photo_view
       ref: separate
-  zoom_view: 0.0.15
+  zoom_view: 
+    git: https://github.com/jiangtian616/zoom_view
   package_info_plus: 8.0.3
   file_picker: 8.1.3
   local_auth: 2.2.0