setting to control modal barrier

This commit is contained in:
Fabian Freund
2026-03-11 15:54:18 +01:00
parent cdd7a3ffd5
commit c751c6fe15
9 changed files with 76 additions and 3 deletions
@@ -54,6 +54,8 @@ class BottomSheetPage<T> extends Page<T> {
shape: Theme.of(context).bottomSheetTheme.shape,
clipBehavior: Clip.antiAlias,
constraints: Theme.of(context).bottomSheetTheme.constraints,
modalBarrierColor:
barrierColor ?? Theme.of(context).bottomSheetTheme.modalBarrierColor,
isScrollControlled: isScrollControlled,
isDismissible: barrierDismissible,
useSafeArea: useSafeArea,
@@ -33,7 +33,7 @@ class DialogPage<T> extends Page<T> {
const DialogPage({
required this.builder,
this.anchorPoint,
this.barrierColor = Colors.black54,
this.barrierColor,
this.barrierDismissible = true,
this.barrierLabel,
this.useSafeArea = true,
@@ -505,7 +505,7 @@ class BrowserScreen extends HookConsumerWidget {
// Theme with dynamic snackbar margin to position above bottom toolbar
final themeData = Theme.of(context).copyWith(
bottomSheetTheme: BottomSheetThemeData(
bottomSheetTheme: Theme.of(context).bottomSheetTheme.copyWith(
constraints: BoxConstraints(
maxWidth:
MediaQuery.of(context).size.width -
@@ -69,6 +69,7 @@ class _VisualSection extends StatelessWidget {
SettingSection(name: 'Visual'),
_UiZoomSection(),
_DisableAnimationsTile(),
_ShowModalBarrierTile(),
_ThemeSection(),
],
);
@@ -177,6 +178,34 @@ class _DisableAnimationsTile extends HookConsumerWidget {
}
}
class _ShowModalBarrierTile extends HookConsumerWidget {
const _ShowModalBarrierTile();
@override
Widget build(BuildContext context, WidgetRef ref) {
final showModalBarrier = ref.watch(
generalSettingsWithDefaultsProvider.select((s) => s.showModalBarrier),
);
return SwitchListTile.adaptive(
title: const Text('Show Modal Barrier'),
subtitle: const Text(
'Dim the background behind dialogs and bottom sheets',
),
secondary: const Icon(Icons.layers),
value: showModalBarrier,
onChanged: (value) async {
await ref
.read(saveGeneralSettingsControllerProvider.notifier)
.save(
(currentSettings) =>
currentSettings.copyWith.showModalBarrier(value),
);
},
);
}
}
class _TabBarSection extends StatelessWidget {
const _TabBarSection();
@@ -69,6 +69,7 @@ class GeneralSettings with FastEquatable {
final ThemeMode themeMode;
final double uiScaleFactor;
final bool disableAnimations;
final bool showModalBarrier;
final bool enableReadability;
final bool enforceReadability;
final Set<DeleteBrowsingDataType>? deleteBrowsingDataOnQuit;
@@ -119,6 +120,7 @@ class GeneralSettings with FastEquatable {
required this.themeMode,
required this.uiScaleFactor,
required this.disableAnimations,
required this.showModalBarrier,
required this.enableReadability,
required this.enforceReadability,
required this.deleteBrowsingDataOnQuit,
@@ -168,6 +170,7 @@ class GeneralSettings with FastEquatable {
ThemeMode? themeMode,
double? uiScaleFactor,
bool? disableAnimations,
bool? showModalBarrier,
bool? enableReadability,
bool? enforceReadability,
this.deleteBrowsingDataOnQuit,
@@ -214,6 +217,7 @@ class GeneralSettings with FastEquatable {
}) : themeMode = themeMode ?? ThemeMode.dark,
uiScaleFactor = uiScaleFactor ?? defaultUiScaleFactor,
disableAnimations = disableAnimations ?? false,
showModalBarrier = showModalBarrier ?? true,
enableReadability = enableReadability ?? true,
enforceReadability = enforceReadability ?? false,
defaultSearchProvider = defaultSearchProvider ?? _fallbackSearchProvider,
@@ -293,6 +297,7 @@ class GeneralSettings with FastEquatable {
themeMode,
uiScaleFactor,
disableAnimations,
showModalBarrier,
enableReadability,
enforceReadability,
deleteBrowsingDataOnQuit,
@@ -13,6 +13,8 @@ abstract class _$GeneralSettingsCWProxy {
GeneralSettings disableAnimations(bool disableAnimations);
GeneralSettings showModalBarrier(bool showModalBarrier);
GeneralSettings enableReadability(bool enableReadability);
GeneralSettings enforceReadability(bool enforceReadability);
@@ -128,6 +130,7 @@ abstract class _$GeneralSettingsCWProxy {
ThemeMode themeMode,
double uiScaleFactor,
bool disableAnimations,
bool showModalBarrier,
bool enableReadability,
bool enforceReadability,
Set<DeleteBrowsingDataType>? deleteBrowsingDataOnQuit,
@@ -192,6 +195,10 @@ class _$GeneralSettingsCWProxyImpl implements _$GeneralSettingsCWProxy {
GeneralSettings disableAnimations(bool disableAnimations) =>
call(disableAnimations: disableAnimations);
@override
GeneralSettings showModalBarrier(bool showModalBarrier) =>
call(showModalBarrier: showModalBarrier);
@override
GeneralSettings enableReadability(bool enableReadability) =>
call(enableReadability: enableReadability);
@@ -389,6 +396,7 @@ class _$GeneralSettingsCWProxyImpl implements _$GeneralSettingsCWProxy {
Object? themeMode = const $CopyWithPlaceholder(),
Object? uiScaleFactor = const $CopyWithPlaceholder(),
Object? disableAnimations = const $CopyWithPlaceholder(),
Object? showModalBarrier = const $CopyWithPlaceholder(),
Object? enableReadability = const $CopyWithPlaceholder(),
Object? enforceReadability = const $CopyWithPlaceholder(),
Object? deleteBrowsingDataOnQuit = const $CopyWithPlaceholder(),
@@ -450,6 +458,12 @@ class _$GeneralSettingsCWProxyImpl implements _$GeneralSettingsCWProxy {
? _value.disableAnimations
// ignore: cast_nullable_to_non_nullable
: disableAnimations as bool,
showModalBarrier:
showModalBarrier == const $CopyWithPlaceholder() ||
showModalBarrier == null
? _value.showModalBarrier
// ignore: cast_nullable_to_non_nullable
: showModalBarrier as bool,
enableReadability:
enableReadability == const $CopyWithPlaceholder() ||
enableReadability == null
@@ -726,6 +740,7 @@ GeneralSettings _$GeneralSettingsFromJson(
themeMode: $enumDecodeNullable(_$ThemeModeEnumMap, json['themeMode']),
uiScaleFactor: (json['uiScaleFactor'] as num?)?.toDouble(),
disableAnimations: json['disableAnimations'] as bool?,
showModalBarrier: json['showModalBarrier'] as bool?,
enableReadability: json['enableReadability'] as bool?,
enforceReadability: json['enforceReadability'] as bool?,
deleteBrowsingDataOnQuit: (json['deleteBrowsingDataOnQuit'] as List<dynamic>?)
@@ -815,6 +830,7 @@ Map<String, dynamic> _$GeneralSettingsToJson(
'themeMode': _$ThemeModeEnumMap[instance.themeMode]!,
'uiScaleFactor': instance.uiScaleFactor,
'disableAnimations': instance.disableAnimations,
'showModalBarrier': instance.showModalBarrier,
'enableReadability': instance.enableReadability,
'enforceReadability': instance.enforceReadability,
'deleteBrowsingDataOnQuit': instance.deleteBrowsingDataOnQuit
@@ -56,6 +56,10 @@ class GeneralSettingsRepository extends _$GeneralSettingsRepository {
DriftSqlType.bool,
db.typeMapping,
),
'showModalBarrier': settings['showModalBarrier']?.readAs(
DriftSqlType.bool,
db.typeMapping,
),
'enableReadability': settings['enableReadability']?.readAs(
DriftSqlType.bool,
db.typeMapping,
@@ -35,7 +35,7 @@ final class GeneralSettingsRepositoryProvider
}
String _$generalSettingsRepositoryHash() =>
r'12e49ad38ff25c6bad1680b3eb3a01274ebfb35f';
r'7a30fefa2cdc934232e08e8809c62a83e99635fd';
abstract class _$GeneralSettingsRepository
extends $StreamNotifier<GeneralSettings> {
+17
View File
@@ -163,6 +163,11 @@ class _MainWidget extends HookConsumerWidget {
(value) => value.disableAnimations,
),
);
final showModalBarrier = ref.watch(
generalSettingsWithDefaultsProvider.select(
(value) => value.showModalBarrier,
),
);
useOnInitialization(() async {
await CountryCodes.init();
@@ -286,6 +291,12 @@ class _MainWidget extends HookConsumerWidget {
pageTransitionsTheme: disableAnimations
? _noAnimationPageTransitionsTheme
: null,
dialogTheme: DialogThemeData(
barrierColor: showModalBarrier ? null : Colors.transparent,
),
bottomSheetTheme: BottomSheetThemeData(
modalBarrierColor: showModalBarrier ? null : Colors.transparent,
),
extensions: const <ThemeExtension<dynamic>>[AppColors.light],
),
darkTheme: ThemeData(
@@ -294,6 +305,12 @@ class _MainWidget extends HookConsumerWidget {
pageTransitionsTheme: disableAnimations
? _noAnimationPageTransitionsTheme
: null,
dialogTheme: DialogThemeData(
barrierColor: showModalBarrier ? null : Colors.transparent,
),
bottomSheetTheme: BottomSheetThemeData(
modalBarrierColor: showModalBarrier ? null : Colors.transparent,
),
extensions: const <ThemeExtension<dynamic>>[AppColors.dark],
),
themeMode: themeMode,