#278 viewer: black background when overlay is disabled with light theme

CHANGELOG.md

@@ -12,6 +12,7 @@ All notable changes to this project will be documented in this file.
 
 ### Changed
 
+- viewer: black background when overlay is disabled with light theme
 - upgraded Flutter to beta v3.1.0-9.0.pre
 
 ## <a id="v1.6.9"></a>[v1.6.9] - 2022-06-18

lib/widgets/viewer/entry_vertical_pager.dart

@@ -23,6 +23,7 @@ class ViewerVerticalPageView extends StatefulWidget {
   final CollectionLens? collection;
   final ValueNotifier<AvesEntry?> entryNotifier;
   final ViewerController viewerController;
+  final Animation<double> overlayOpacity;
   final PageController horizontalPager, verticalPager;
   final void Function(int page) onVerticalPageChanged, onHorizontalPageChanged;
   final VoidCallback onImagePageRequested;
@@ -33,6 +34,7 @@ class ViewerVerticalPageView extends StatefulWidget {
     required this.collection,
     required this.entryNotifier,
     required this.viewerController,
+    required this.overlayOpacity,
     required this.verticalPager,
     required this.horizontalPager,
     required this.onVerticalPageChanged,
@@ -145,9 +147,15 @@ class _ViewerVerticalPageViewState extends State<ViewerVerticalPageView> {
     return ValueListenableBuilder<double>(
       valueListenable: _backgroundOpacityNotifier,
       builder: (context, backgroundOpacity, child) {
-        final background = Theme.of(context).brightness == Brightness.dark ? Colors.black : Colors.white;
+        return ValueListenableBuilder<double>(
-        return Container(
+          valueListenable: widget.overlayOpacity,
-          color: background.withOpacity(backgroundOpacity),
+          builder: (context, overlayOpacity, child) {
+            final background = Theme.of(context).brightness == Brightness.dark ? Colors.black : Color.lerp(Colors.black, Colors.white, overlayOpacity)!;
+            return Container(
+              color: background.withOpacity(backgroundOpacity),
+              child: child,
+            );
+          },
           child: child,
         );
       },

lib/widgets/viewer/entry_viewer_stack.dart

@@ -62,9 +62,10 @@ class _EntryViewerStackState extends State<EntryViewerStack> with EntryViewContr
   late ValueNotifier<int> _currentVerticalPage;
   late PageController _horizontalPager, _verticalPager;
   final AChangeNotifier _verticalScrollNotifier = AChangeNotifier();
+  bool _overlayInitialized = false;
   final ValueNotifier<bool> _overlayVisible = ValueNotifier(true);
   late AnimationController _overlayAnimationController;
-  late Animation<double> _overlayButtonScale, _overlayVideoControlScale;
+  late Animation<double> _overlayButtonScale, _overlayVideoControlScale, _overlayOpacity;
   late Animation<Offset> _overlayTopOffset;
   EdgeInsets? _frozenViewInsets, _frozenViewPadding;
   late VideoActionDelegate _videoActionDelegate;
@@ -129,6 +130,10 @@ class _EntryViewerStackState extends State<EntryViewerStack> with EntryViewContr
       // no bounce at the bottom, to avoid video controller displacement
       curve: Curves.easeOutQuad,
     );
+    _overlayOpacity = CurvedAnimation(
+      parent: _overlayAnimationController,
+      curve: Curves.easeOutQuad,
+    );
     _overlayTopOffset = Tween(begin: const Offset(0, -1), end: const Offset(0, 0)).animate(CurvedAnimation(
       parent: _overlayAnimationController,
       curve: Curves.easeOutQuad,
@@ -259,6 +264,11 @@ class _EntryViewerStackState extends State<EntryViewerStack> with EntryViewContr
                 collection: collection,
                 entryNotifier: entryNotifier,
                 viewerController: viewerController,
+                overlayOpacity: _overlayInitialized
+                    ? _overlayOpacity
+                    : settings.showOverlayOnOpening
+                        ? kAlwaysCompleteAnimation
+                        : kAlwaysDismissedAnimation,
                 verticalPager: _verticalPager,
                 horizontalPager: _horizontalPager,
                 onVerticalPageChanged: _onVerticalPageChanged,
@@ -644,6 +654,7 @@ class _EntryViewerStackState extends State<EntryViewerStack> with EntryViewContr
     // to show overlay after hero animation is complete
     await Future.delayed(ModalRoute.of(context)!.transitionDuration * timeDilation);
     await _onOverlayVisibleChange();
+    _overlayInitialized = true;
   }
 
   Future<void> _onOverlayVisibleChange({bool animate = true}) async {