[timetable] immersive wallpaper

plum-tech · Sep 23, 2024 · 91c3705 · 91c3705
1 parent e7cfc85
commit 91c3705
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 33 deletions.
diff --git a/lib/index.dart b/lib/index.dart
@@ -112,31 +112,35 @@ class _MainStagePageState extends ConsumerState<MainStagePage> {
 
   @override
   Widget build(BuildContext context) {
-    return buildBody();
-    return [
-      Positioned.fill(
-        child: ColoredBox(color: context.colorScheme.surface),
-      ),
-      Positioned.fill(
-        child: WallpaperWidget(
-          background: Settings.timetable.backgroundImage ?? BackgroundImage.disabled(),
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
+    if (immersiveWallpaper) {
+      return [
+        Positioned.fill(
+          child: ColoredBox(color: context.colorScheme.surface),
         ),
-      ),
-      buildBody(),
-    ].stack();
+        Positioned.fill(
+          child: WallpaperWidget(
+            background: Settings.timetable.backgroundImage ?? const BackgroundImage.disabled(),
+          ),
+        ),
+        buildBody(),
+      ].stack();
+    }
+    return buildBody();
   }
 
   Widget buildBody() {
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
     final items = buildItems();
     if (context.isPortrait) {
       return Scaffold(
-        // backgroundColor: Colors.transparent,
+        backgroundColor: immersiveWallpaper ? Colors.transparent : null,
         body: widget.navigationShell,
         bottomNavigationBar: buildNavigationBar(items),
       );
     } else {
       return Scaffold(
-        // backgroundColor: Colors.transparent,
+        backgroundColor: immersiveWallpaper ? Colors.transparent : null,
         body: [
           buildNavigationRail(items),
           const VerticalDivider(),
@@ -147,17 +151,23 @@ class _MainStagePageState extends ConsumerState<MainStagePage> {
   }
 
   Widget buildNavigationBar(NavigationItems items) {
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
     return NavigationBar(
-      // backgroundColor: context.colorScheme.surfaceContainer.withOpacity(0.6),
+      backgroundColor: immersiveWallpaper
+          ? context.colorScheme.surfaceContainer.withOpacity(Settings.timetable.immersiveOpacity)
+          : null,
       selectedIndex: getSelectedIndex(items),
       onDestinationSelected: (index) => onItemTapped(index, items),
       destinations: items.map((e) => e.item.toBarItem()).toList(),
     );
   }
 
   Widget buildNavigationRail(NavigationItems items) {
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
     return NavigationRail(
-      // backgroundColor: context.colorScheme.surfaceContainer.withOpacity(0.6),
+      backgroundColor: immersiveWallpaper
+          ? context.colorScheme.surfaceContainer.withOpacity(Settings.timetable.immersiveOpacity)
+          : null,
       labelType: NavigationRailLabelType.all,
       selectedIndex: getSelectedIndex(items),
       onDestinationSelected: (index) => onItemTapped(index, items),

diff --git a/lib/timetable/p13n/page/background.dart b/lib/timetable/p13n/page/background.dart
@@ -4,6 +4,7 @@ import 'dart:io';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_platform_widgets/flutter_platform_widgets.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:go_router/go_router.dart';
 import 'package:image_picker/image_picker.dart';
 import 'package:mimir/utils/permission.dart';
@@ -24,21 +25,21 @@ import "../../i18n.dart";
 import '../entity/background.dart';
 
 /// It persists changes to storage before route popping
-class TimetableBackgroundEditor extends StatefulWidget {
+class TimetableBackgroundEditor extends ConsumerStatefulWidget {
   const TimetableBackgroundEditor({super.key});
 
   @override
-  State<TimetableBackgroundEditor> createState() => _TimetableBackgroundEditorState();
+  ConsumerState<TimetableBackgroundEditor> createState() => _TimetableBackgroundEditorState();
 }
 
-class _TimetableBackgroundEditorState extends State<TimetableBackgroundEditor> with SingleTickerProviderStateMixin {
+class _TimetableBackgroundEditorState extends ConsumerState<TimetableBackgroundEditor>
+    with SingleTickerProviderStateMixin {
   String? rawPath;
   File? renderImageFile;
   double opacity = 1.0;
   bool repeat = true;
   bool antialias = true;
   bool hidden = false;
-  bool immersive = false;
   late final AnimationController $opacity;
 
   _TimetableBackgroundEditorState() {
@@ -51,7 +52,6 @@ class _TimetableBackgroundEditorState extends State<TimetableBackgroundEditor> w
     repeat = bk?.repeat ?? true;
     antialias = bk?.antialias ?? true;
     hidden = bk?.hidden ?? false;
-    immersive = bk?.immersive ?? false;
   }
 
   @override
@@ -240,7 +240,7 @@ class _TimetableBackgroundEditorState extends State<TimetableBackgroundEditor> w
         icon: Icon(context.icons.create),
         label: i18n.choose.text(),
       ).center().expanded(flex: 3),
-      IconButton.outlined(
+      IconButton.filledTonal(
         onPressed: hasImage
             ? () {
                 setState(() {
@@ -316,13 +316,12 @@ class _TimetableBackgroundEditorState extends State<TimetableBackgroundEditor> w
   }
 
   Widget buildImmersive() {
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
     return SwitchListTile.adaptive(
       title: "Immersive".text(),
-      value: immersive,
+      value: immersiveWallpaper,
       onChanged: (v) {
-        setState(() {
-          immersive = v;
-        });
+        ref.read(Settings.timetable.$immersiveWallpaper.notifier).set(v);
       },
     );
   }

diff --git a/lib/timetable/page/timetable.dart b/lib/timetable/page/timetable.dart
@@ -57,11 +57,13 @@ class _TimetableBoardPageState extends ConsumerState<TimetableBoardPage> {
 
   @override
   Widget build(BuildContext context) {
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
     return Scaffold(
-      // backgroundColor: Colors.transparent,
+      backgroundColor: immersiveWallpaper ? Colors.transparent : null,
       resizeToAvoidBottomInset: false,
       appBar: AppBar(
-        // backgroundColor: context.colorScheme.surface.withOpacity(0.6),
+        backgroundColor:
+            immersiveWallpaper ? context.colorScheme.surface.withOpacity(Settings.timetable.immersiveOpacity) : null,
         title: $currentPos >> (ctx, pos) => i18n.weekOrderedName(number: pos.weekIndex + 1).text(),
         actions: [
           buildSwitchViewButton(),

diff --git a/lib/timetable/settings.dart b/lib/timetable/settings.dart
@@ -21,6 +21,7 @@ class _K {
   static const showTimetableNavigation = '$ns/showTimetableNavigation';
   static const autoSyncTimetable = '$ns/autoSyncTimetable';
   static const lastSyncTimetableTime = '$ns/lastSyncTimetableTime';
+  static const immersiveWallpaper = '$ns/immersiveWallpaper';
 }
 
 class TimetableSettings {
@@ -98,4 +99,12 @@ class TimetableSettings {
   DateTime? get lastSyncTimetableTime => box.safeGet<DateTime>(_K.lastSyncTimetableTime);
 
   set lastSyncTimetableTime(DateTime? newV) => box.safePut<DateTime>(_K.lastSyncTimetableTime, newV);
+
+  bool get immersiveWallpaper => box.safeGet<bool>(_K.immersiveWallpaper) ?? false;
+
+  set immersiveWallpaper(bool newV) => box.safePut<bool>(_K.immersiveWallpaper, newV);
+
+  late final $immersiveWallpaper = box.providerWithDefault<bool>(_K.immersiveWallpaper, () => false);
+
+  final immersiveOpacity = 0.6;
 }
diff --git a/lib/timetable/widget/timetable/board.dart b/lib/timetable/widget/timetable/board.dart
@@ -1,4 +1,6 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:mimir/settings/settings.dart';
 import 'package:mimir/timetable/p13n/widget/wallpaper.dart';
 import 'package:rettulf/rettulf.dart';
 import 'package:mimir/timetable/p13n/widget/style.dart';
@@ -9,7 +11,7 @@ import '../../entity/timetable_entity.dart';
 import 'daily.dart';
 import 'weekly.dart';
 
-class TimetableBoard extends StatelessWidget {
+class TimetableBoard extends ConsumerWidget {
   final TimetableEntity timetable;
 
   final ValueNotifier<DisplayMode> $displayMode;
@@ -24,13 +26,18 @@ class TimetableBoard extends StatelessWidget {
   });
 
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     final style = TimetableStyle.of(context);
     final background = style.background;
-    return WithWallpaper(
-      background: background,
-      child: buildBoard(),
-    );
+    final immersiveWallpaper = ref.watch(Settings.timetable.$immersiveWallpaper);
+    if (immersiveWallpaper) {
+      return buildBoard();
+    } else {
+      return WithWallpaper(
+        background: background,
+        child: buildBoard(),
+      );
+    }
   }
 
   Widget buildBoard() {