feat: custom preview quality

Signed-off-by: bggRGjQaUbCoE <githubaccount56556@proton.me>

lib/pages/preview/view.dart

@@ -3,6 +3,7 @@
 import 'dart:io';
 
 import 'package:PiliPalaX/utils/extension.dart';
+import 'package:PiliPalaX/utils/storage.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
 import 'package:get/get.dart';
@@ -36,6 +37,7 @@ class _ImagePreviewState extends State<ImagePreview>
   late DoubleClickAnimationListener _doubleClickAnimationListener;
   List<double> doubleTapScales = <double>[1.0, 2.0];
   List<String>? imgList;
+  int _quality = 80;
 
   @override
   void initState() {
@@ -43,6 +45,9 @@ class _ImagePreviewState extends State<ImagePreview>
 
     imgList = widget.imgList?.map((url) => url.http2https).toList();
 
+    _quality =
+        GStorage.setting.get(SettingBoxKey.previewQuality, defaultValue: 80);
+
     _previewController.initialPage.value = widget.initialPage!;
     _previewController.currentPage.value = widget.initialPage! + 1;
     _previewController.imgList.value = imgList!;
@@ -169,7 +174,7 @@ class _ImagePreviewState extends State<ImagePreview>
                 itemCount: imgList!.length,
                 itemBuilder: (BuildContext context, int index) {
                   return ExtendedImage.network(
-                    imgList![index],
+                    '${imgList![index]}@${_quality}q.webp',
                     fit: BoxFit.contain,
                     mode: ExtendedImageMode.gesture,
                     handleLoadingProgress: true,

lib/pages/setting/controller.dart

@@ -24,6 +24,7 @@ class SettingController extends GetxController {
   RxBool feedBackEnable = false.obs;
   RxDouble toastOpacity = (1.0).obs;
   RxInt picQuality = 10.obs;
+  RxInt previewQ = 80.obs;
   Rx<ThemeType> themeType = ThemeType.system.obs;
   dynamic userInfo;
   Rx<DynamicBadgeMode> dynamicBadgeType = DynamicBadgeMode.number.obs;
@@ -49,6 +50,8 @@ class SettingController extends GetxController {
         defaultValue: DynamicBadgeMode.number.code)];
     defaultHomePage.value =
         setting.get(SettingBoxKey.defaultHomePage, defaultValue: 0);
+    previewQ.value =
+        setting.get(SettingBoxKey.previewQuality, defaultValue: 80);
   }
 
   loginOut(BuildContext context) async {

lib/pages/setting/style_setting.dart

@@ -32,7 +32,6 @@ class _StyleSettingState extends State<StyleSetting> {
       Get.put(ColorSelectController());
 
   Box setting = GStorage.setting;
-  late int picQuality;
   late ThemeType _tempThemeValue;
   late double maxRowWidth;
   late UpPanelPosition upPanelPosition;
@@ -40,7 +39,6 @@ class _StyleSettingState extends State<StyleSetting> {
   @override
   void initState() {
     super.initState();
-    picQuality = setting.get(SettingBoxKey.defaultPicQa, defaultValue: 10);
     _tempThemeValue = settingController.themeType.value;
     maxRowWidth =
         setting.get(SettingBoxKey.maxRowWidth, defaultValue: 240.0) as double;
@@ -221,56 +219,14 @@ class _StyleSettingState extends State<StyleSetting> {
           ListTile(
             dense: false,
             onTap: () {
-              showDialog(
+              _showQualityDialog(
-                context: context,
+                  title: '图片质量',
-                builder: (context) {
+                  initValue: settingController.picQuality.value,
-                  return StatefulBuilder(
+                  callback: (picQuality) {
-                    builder: (context, StateSetter setState) {
+                    setting.put(SettingBoxKey.defaultPicQa, picQuality);
-                      final SettingController settingController =
+                    settingController.picQuality.value = picQuality;
-                          Get.put(SettingController());
+                    GlobalData().imgQuality = picQuality;
-                      return AlertDialog(
+                  });
-                        title: const Text('图片质量'),
-                        contentPadding: const EdgeInsets.only(
-                            top: 20, left: 8, right: 8, bottom: 8),
-                        content: SizedBox(
-                          height: 40,
-                          child: Slider(
-                            value: picQuality.toDouble(),
-                            min: 10,
-                            max: 100,
-                            divisions: 9,
-                            label: '$picQuality%',
-                            onChanged: (double val) {
-                              picQuality = val.toInt();
-                              setState(() {});
-                            },
-                          ),
-                        ),
-                        actions: [
-                          TextButton(
-                              onPressed: () => Get.back(),
-                              child: Text('取消',
-                                  style: TextStyle(
-                                      color: Theme.of(context)
-                                          .colorScheme
-                                          .outline))),
-                          TextButton(
-                            onPressed: () {
-                              setting.put(
-                                  SettingBoxKey.defaultPicQa, picQuality);
-                              Get.back();
-                              settingController.picQuality.value = picQuality;
-                              GlobalData().imgQuality = picQuality;
-                              SmartDialog.showToast('设置成功');
-                            },
-                            child: const Text('确定'),
-                          )
-                        ],
-                      );
-                    },
-                  );
-                },
-              );
             },
             title: Text('图片质量', style: titleStyle),
             subtitle: Text('选择合适的图片清晰度，上限100%', style: subTitleStyle),
@@ -285,6 +241,31 @@ class _StyleSettingState extends State<StyleSetting> {
               ),
             ),
           ),
+          // preview quality
+          ListTile(
+            dense: false,
+            onTap: () {
+              _showQualityDialog(
+                  title: '查看大图质量',
+                  initValue: settingController.previewQ.value,
+                  callback: (picQuality) {
+                    setting.put(SettingBoxKey.previewQuality, picQuality);
+                    settingController.previewQ.value = picQuality;
+                  });
+            },
+            title: Text('查看大图质量', style: titleStyle),
+            subtitle: Text('选择合适的图片清晰度，上限100%', style: subTitleStyle),
+            leading: const Icon(Icons.image_outlined),
+            trailing: Padding(
+              padding: const EdgeInsets.symmetric(horizontal: 8.0),
+              child: Obx(
+                () => Text(
+                  '${settingController.previewQ.value}%',
+                  style: Theme.of(context).textTheme.titleSmall,
+                ),
+              ),
+            ),
+          ),
           ListTile(
             dense: false,
             onTap: () async {
@@ -393,4 +374,53 @@ class _StyleSettingState extends State<StyleSetting> {
       ),
     );
   }
+
+  void _showQualityDialog({
+    required String title,
+    required int initValue,
+    required ValueChanged<int> callback,
+  }) {
+    showDialog(
+      context: context,
+      builder: (context) {
+        int picQuality = initValue;
+        return AlertDialog(
+          title: Text(title),
+          contentPadding:
+              const EdgeInsets.only(top: 20, left: 8, right: 8, bottom: 8),
+          content: SizedBox(
+            height: 40,
+            child: Builder(
+              builder: (context) => Slider(
+                value: picQuality.toDouble(),
+                min: 10,
+                max: 100,
+                divisions: 9,
+                label: '$picQuality%',
+                onChanged: (double val) {
+                  picQuality = val.toInt();
+                  (context as Element).markNeedsBuild();
+                },
+              ),
+            ),
+          ),
+          actions: [
+            TextButton(
+                onPressed: () => Get.back(),
+                child: Text('取消',
+                    style: TextStyle(
+                        color: Theme.of(context).colorScheme.outline))),
+            TextButton(
+              onPressed: () {
+                Get.back();
+                callback(picQuality);
+                SmartDialog.showToast('设置成功');
+              },
+              child: const Text('确定'),
+            )
+          ],
+        );
+      },
+    );
+  }
 }

lib/utils/storage.dart

@@ -250,6 +250,7 @@ class SettingBoxKey {
       blockToast = 'blockToast',
       blockServer = 'blockServer',
       blockTrack = 'blockTrack',
+      previewQuality = 'previewQuality',
 
       // 弹幕相关设置 权重（云屏蔽） 屏蔽类型 显示区域 透明度 字体大小 弹幕时间 描边粗细 字体粗细
       danmakuWeight = 'danmakuWeight',