HCha/PiliPlus
1
0
Fork 0
mirror of https://github.com/HChaZZY/PiliPlus.git synced 2025-12-06 09:13:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: reduce luminosity in dark mode (#988)

Browse Source
This commit is contained in:
My-Responsitories
2025-08-11 10:57:08 +08:00
committed by GitHub
parent 88c2ba8059
commit dc61d9007f
7 changed files with 108 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/common/widgets/dialog/dialog.dart
View File

@@ -1,13 +1,13 @@
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void showConfirmDialog({
Future<void> showConfirmDialog({
required BuildContext context,
required String title,
dynamic content,
required VoidCallback onConfirm,
}) {
showDialog(
return showDialog(
context: context,
builder: (context) {
return AlertDialog(

4
lib/common/widgets/image/image_view.dart
View File

@@ -151,8 +151,8 @@ Widget imageView(
src: item.url,
width: imageWidth,
height: imageHeight,
isLongPic: () => item.isLongPic,
callback: () => item.width <= item.height,
isLongPic: item.isLongPic,
forceUseCacheWidth: item.width <= item.height,
getPlaceHolder: () {
return Container(
width: imageWidth,

42
lib/common/widgets/image/network_img_layer.dart
View File

@@ -1,7 +1,9 @@
import 'package:PiliPlus/common/constants.dart';
import 'package:PiliPlus/models/common/image_type.dart';
import 'package:PiliPlus/utils/context_ext.dart';
import 'package:PiliPlus/utils/extension.dart';
import 'package:PiliPlus/utils/image_util.dart';
import 'package:PiliPlus/utils/storage_pref.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
@@ -19,8 +21,8 @@ class NetworkImgLayer extends StatelessWidget {
this.semanticsLabel,
this.radius,
this.imageBuilder,
this.isLongPic,
this.callback,
this.isLongPic = false,
this.forceUseCacheWidth = false,
this.getPlaceHolder,
this.boxFit,
});
@@ -35,30 +37,34 @@ class NetworkImgLayer extends StatelessWidget {
final String? semanticsLabel;
final double? radius;
final ImageWidgetBuilder? imageBuilder;
final Function? isLongPic;
final Function? callback;
final Function? getPlaceHolder;
final bool isLongPic;
final bool forceUseCacheWidth;
final Widget Function()? getPlaceHolder;
final BoxFit? boxFit;
static Color? reduceLuxColor = Pref.reduceLuxColor;
@override
Widget build(BuildContext context) {
final reduce =
quality != 100 && reduceLuxColor != null && context.isDarkMode;
return src?.isNotEmpty == true
? type == ImageType.avatar
? ClipOval(child: _buildImage(context))
? ClipOval(child: _buildImage(context, reduce))
: radius == 0 || type == ImageType.emote
? _buildImage(context)
? _buildImage(context, reduce)
: ClipRRect(
borderRadius: radius != null
? BorderRadius.circular(radius!)
: StyleString.mdRadius,
child: _buildImage(context),
child: _buildImage(context, reduce),
)
: getPlaceHolder?.call() ?? placeholder(context);
: getPlaceHolder?.call() ?? _placeholder(context, reduce);
}
Widget _buildImage(BuildContext context) {
Widget _buildImage(BuildContext context, bool reduce) {
int? memCacheWidth, memCacheHeight;
if (height == null || callback?.call() == true || width <= height!) {
if (height == null || forceUseCacheWidth || width <= height!) {
memCacheWidth = width.cacheSize(context);
} else {
memCacheHeight = height.cacheSize(context);
@@ -70,20 +76,20 @@ class NetworkImgLayer extends StatelessWidget {
memCacheWidth: memCacheWidth,
memCacheHeight: memCacheHeight,
fit: boxFit ?? BoxFit.cover,
alignment: isLongPic?.call() == true
? Alignment.topCenter
: Alignment.center,
alignment: isLongPic ? Alignment.topCenter : Alignment.center,
fadeOutDuration: fadeOutDuration ?? const Duration(milliseconds: 120),
fadeInDuration: fadeInDuration ?? const Duration(milliseconds: 120),
filterQuality: FilterQuality.low,
placeholder: (BuildContext context, String url) =>
getPlaceHolder?.call() ?? placeholder(context),
getPlaceHolder?.call() ?? _placeholder(context, reduce),
imageBuilder: imageBuilder,
errorWidget: (context, url, error) => placeholder(context),
errorWidget: (context, url, error) => _placeholder(context, reduce),
colorBlendMode: reduce ? BlendMode.modulate : null,
color: reduce ? reduceLuxColor : null,
);
}
Widget placeholder(BuildContext context) {
Widget _placeholder(BuildContext context, bool reduce) {
return Container(
width: width,
height: height,
@@ -108,6 +114,8 @@ class NetworkImgLayer extends StatelessWidget {
width: width,
height: height,
cacheWidth: width.cacheSize(context),
colorBlendMode: reduce ? BlendMode.modulate : null,
color: reduce ? reduceLuxColor : null,
),
),
);

64
lib/pages/setting/models/style_settings.dart
View File

@@ -2,6 +2,8 @@ import 'dart:io';
import 'dart:math';
import 'package:PiliPlus/common/widgets/custom_toast.dart';
import 'package:PiliPlus/common/widgets/dialog/dialog.dart';
import 'package:PiliPlus/common/widgets/image/network_img_layer.dart';
import 'package:PiliPlus/common/widgets/scroll_physics.dart';
import 'package:PiliPlus/main.dart';
import 'package:PiliPlus/models/common/dynamic/dynamic_badge_mode.dart';
@@ -15,6 +17,7 @@ import 'package:PiliPlus/pages/main/controller.dart';
import 'package:PiliPlus/pages/mine/controller.dart';
import 'package:PiliPlus/pages/setting/models/model.dart';
import 'package:PiliPlus/pages/setting/pages/color_select.dart';
import 'package:PiliPlus/pages/setting/slide_color_picker.dart';
import 'package:PiliPlus/pages/setting/widgets/multi_select_dialog.dart';
import 'package:PiliPlus/pages/setting/widgets/select_dialog.dart';
import 'package:PiliPlus/pages/setting/widgets/slide_dialog.dart';
@@ -451,6 +454,67 @@ List<SettingsModel> get styleSettings => [
),
),
),
SettingsModel(
settingsType: SettingsType.normal,
onTap: (setState) {
showDialog(
context: Get.context!,
builder: (context) => AlertDialog(
clipBehavior: Clip.hardEdge,
contentPadding: const EdgeInsets.symmetric(vertical: 16),
title: const Text('Color Picker'),
content: SlideColorPicker(
showResetBtn: false,
color: Pref.reduceLuxColor ?? Colors.white,
callback: (Color? color) async {
if (color != null && color != Pref.reduceLuxColor) {
if (color == Colors.white) {
NetworkImgLayer.reduceLuxColor = null;
GStorage.setting.delete(SettingBoxKey.reduceLuxColor);
SmartDialog.showToast('设置成功');
setState();
} else {
void onConfirm() {
NetworkImgLayer.reduceLuxColor = color;
GStorage.setting.put(
SettingBoxKey.reduceLuxColor,
color.toARGB32(),
);
SmartDialog.showToast('设置成功');
setState();
}
if (color.computeLuminance() < 0.2) {
await showConfirmDialog(
context: context,
title:
'确认使用#${(color.toARGB32() & 0xFFFFFF).toRadixString(16).toUpperCase().padLeft(6)}？',
content: '所选颜色过于昏暗，可能会影响图片观看',
onConfirm: onConfirm,
);
} else {
onConfirm();
}
}
}
},
),
),
);
},
title: '深色下图片颜色叠加',
subtitle: '显示颜色=图片原色x所选颜色，大图查看不受影响',
leading: const Icon(Icons.format_color_fill_outlined),
getTrailing: () => Container(
padding: const EdgeInsets.only(right: 8.0),
width: 20,
height: 20,
decoration: BoxDecoration(
color: Pref.reduceLuxColor ?? Colors.white,
shape: BoxShape.circle,
),
),
),
SettingsModel(
settingsType: SettingsType.normal,
onTap: (setState) async {

13
lib/pages/video/view.dart
View File

@@ -5,6 +5,7 @@ import 'dart:ui';
import 'package:PiliPlus/common/constants.dart';
import 'package:PiliPlus/common/widgets/custom_icon.dart';
import 'package:PiliPlus/common/widgets/image/network_img_layer.dart';
import 'package:PiliPlus/common/widgets/scroll_physics.dart';
import 'package:PiliPlus/grpc/bilibili/main/community/reply/v1.pb.dart'
show ReplyInfo;
@@ -50,7 +51,6 @@ import 'package:PiliPlus/utils/page_utils.dart';
import 'package:PiliPlus/utils/storage.dart';
import 'package:PiliPlus/utils/storage_key.dart';
import 'package:auto_orientation/auto_orientation.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:easy_debounce/easy_throttle.dart';
import 'package:extended_nested_scroll_view/extended_nested_scroll_view.dart';
import 'package:floating/floating.dart';
@@ -1640,17 +1640,14 @@ class _VideoDetailPageVState extends State<VideoDetailPageV>
child: GestureDetector(
onTap: handlePlay,
child: Obx(
() => CachedNetworkImage(
imageUrl: videoDetailController.cover.value.http2https,
() => NetworkImgLayer(
src: videoDetailController.cover.value,
width: width,
height: height,
fit: BoxFit.cover,
boxFit: BoxFit.cover,
fadeOutDuration: const Duration(milliseconds: 120),
fadeInDuration: const Duration(milliseconds: 120),
memCacheWidth: width.cacheSize(context),
placeholder: (context, url) => Center(
child: Image.asset('assets/images/loading.png'),
),
forceUseCacheWidth: true,
),
),
),

3
lib/utils/storage_key.dart
View File

@@ -202,7 +202,8 @@ class SettingBoxKey {
hiddenSettingUnlocked = 'hiddenSettingUnlocked',
enableGradientBg = 'enableGradientBg',
navBarSort = 'navBarSort',
tempPlayerConf = 'tempPlayerConf';
tempPlayerConf = 'tempPlayerConf',
reduceLuxColor = 'reduceLuxColor';
}
class LocalCacheKey {

8
lib/utils/storage_pref.dart
View File

@@ -779,4 +779,12 @@ class Pref {
static bool get tempPlayerConf =>
_setting.get(SettingBoxKey.tempPlayerConf, defaultValue: false);
static Color? get reduceLuxColor {
final int? color = _setting.get(SettingBoxKey.reduceLuxColor);
if (color != null && color != 0xFFFFFFFF) {
return Color(color);
}
return null;
}
}