♻️ grater tooltip

niuhuan · Sep 3, 2024 · 850d8f3 · 850d8f3
1 parent 52f1302
commit 850d8f3
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 21 deletions.
diff --git a/ci/version.info.txt b/ci/version.info.txt
@@ -4,7 +4,8 @@ v1.8.1
 - [x] ✨ 漫画更新提醒
 - [x] ✨ 批量下载支持更多种UI (封面/图文)
 - [x] ✨ 超时自动锁定（一定程度上支持）
-- [x] ♻️ 优化画廊阅读器体验（包括单页与双页），提前缓存一些图片，提高阅读流畅度。
+- [x] ♻️ 拖动滚动条时，居中现实当前页数，更加直观
+- [x] ♻️ 优化画廊阅读器体验（包括单页与双页），提前缓存一些图片，提高阅读流畅度
 - [x] ♻️ 优化画廊阅读器性能（包括单页与双页），减少耗电，更加流畅。（缓存了控件数据）
 - [x] ♻️ 调整了一些设置页的UI
 

diff --git a/lib/screens/components/ImageReader.dart b/lib/screens/components/ImageReader.dart
@@ -232,10 +232,38 @@ class _ImageReaderContent extends StatefulWidget {
 }
 
 abstract class _ImageReaderContentState extends State<_ImageReaderContent> {
+  bool _sliderDragging = false;
+
   // 阅读器
   Widget _buildViewer();
 
-  Widget _buildViewerProcess() => processImageFilter(_buildViewer());
+  Widget _buildViewerProcess() {
+    return Stack(
+      children: [
+        processImageFilter(_buildViewer()),
+        if (_sliderDragging) _sliderDraggingText(),
+      ],
+    );
+  }
+
+  Widget _sliderDraggingText() {
+    return Center(
+      child: Container(
+        padding: const EdgeInsets.all(10),
+        decoration: BoxDecoration(
+          color: const Color(0x88000000),
+          borderRadius: BorderRadius.circular(10),
+        ),
+        child: Text(
+          "${_slider + 1} / ${widget.struct.images.length}",
+          style: const TextStyle(
+            color: Colors.white,
+            fontSize: 30,
+          ),
+        ),
+      ),
+    );
+  }
 
   // 键盘, 音量键 等事件
   void _needJumpTo(int index, bool animation);
@@ -557,10 +585,20 @@ abstract class _ImageReaderContentState extends State<_ImageReaderContent> {
       values: [_slider.toDouble()],
       min: 0,
       max: (widget.struct.images.length - 1).toDouble(),
+      onDragStarted: (handlerIndex, lowerValue, upperValue) {
+        setState(() {
+          _sliderDragging = true;
+        });
+      },
       onDragging: (handlerIndex, lowerValue, upperValue) {
-        _slider = (lowerValue.toInt());
+        setState(() {
+          _slider = (lowerValue.toInt());
+        });
       },
       onDragCompleted: (handlerIndex, lowerValue, upperValue) {
+        setState(() {
+          _sliderDragging = false;
+        });
         _slider = (lowerValue.toInt());
         if (_slider != _current) {
           _needJumpTo(_slider, false);
@@ -580,24 +618,7 @@ abstract class _ImageReaderContentState extends State<_ImageReaderContent> {
         step: 1,
         isPercentRange: false,
       ),
-      tooltip: FlutterSliderTooltip(custom: (value) {
-        double a = value + 1;
-        return Container(
-          padding: const EdgeInsets.all(8),
-          decoration: ShapeDecoration(
-            color: Colors.black.withAlpha(0xCC),
-            shape: RoundedRectangleBorder(
-                borderRadius: BorderRadiusDirectional.circular(3)),
-          ),
-          child: Text(
-            '${a.toInt()}',
-            style: const TextStyle(
-              color: Colors.white,
-              fontSize: 18,
-            ),
-          ),
-        );
-      }),
+      tooltip: FlutterSliderTooltip(disabled: true),
     );
   }
 
@@ -1678,6 +1699,7 @@ class _GalleryReaderState extends _ImageReaderContentState {
         precacheImage(ip, context);
       }
     }
+
     if (init) {
       WidgetsBinding.instance?.addPostFrameCallback((_) => fn());
     } else {
@@ -1959,6 +1981,7 @@ class _TwoPageGalleryReaderState extends _ImageReaderContentState {
         precacheImage(ip, context);
       }
     }
+
     if (init) {
       WidgetsBinding.instance?.addPostFrameCallback((_) => fn());
     } else {