collection/filter grids: keep items in view when switching device orientation

lib/model/highlight.dart

@@ -1,15 +1,22 @@
 import 'package:event_bus/event_bus.dart';
 import 'package:flutter/foundation.dart';
+import 'package:flutter/widgets.dart';
 
 class HighlightInfo extends ChangeNotifier {
   final EventBus eventBus = EventBus();
 
   void trackItem<T>(
     T item, {
-    required bool animate,
+    Alignment? alignment,
-    Object? highlight,
+    bool? animate,
+    Object? highlightItem,
   }) =>
-      eventBus.fire(TrackEvent<T>(item, animate, highlight));
+      eventBus.fire(TrackEvent<T>(
+        item,
+        alignment ?? Alignment.center,
+        animate ?? true,
+        highlightItem,
+      ));
 
   Object? _item;
 
@@ -36,8 +43,14 @@ class HighlightInfo extends ChangeNotifier {
 @immutable
 class TrackEvent<T> {
   final T item;
+  final Alignment alignment;
   final bool animate;
-  final Object? highlight;
+  final Object? highlightItem;
 
-  const TrackEvent(this.item, this.animate, this.highlight);
+  const TrackEvent(
+    this.item,
+    this.alignment,
+    this.animate,
+    this.highlightItem,
+  );
 }

lib/widgets/collection/collection_grid.dart

@@ -130,7 +130,7 @@ class _CollectionSectionedContent extends StatefulWidget {
   _CollectionSectionedContentState createState() => _CollectionSectionedContentState();
 }
 
-class _CollectionSectionedContentState extends State<_CollectionSectionedContent> with GridItemTrackerMixin<AvesEntry, _CollectionSectionedContent> {
+class _CollectionSectionedContentState extends State<_CollectionSectionedContent> with WidgetsBindingObserver, GridItemTrackerMixin<AvesEntry, _CollectionSectionedContent> {
   CollectionLens get collection => widget.collection;
 
   @override

lib/widgets/collection/entry_set_action_delegate.dart

@@ -168,7 +168,7 @@ class EntrySetActionDelegate with FeedbackMixin, PermissionAwareMixin, SizeAware
                 final newUris = movedOps.map((v) => v.newFields['uri'] as String?).toSet();
                 final targetEntry = targetCollection.sortedEntries.firstWhereOrNull((entry) => newUris.contains(entry.uri));
                 if (targetEntry != null) {
-                  highlightInfo.trackItem(targetEntry, animate: true, highlight: targetEntry);
+                  highlightInfo.trackItem(targetEntry, highlightItem: targetEntry);
                 }
               },
             ),

lib/widgets/common/grid/item_tracker.dart

@@ -3,32 +3,56 @@ import 'dart:async';
 import 'package:aves/model/highlight.dart';
 import 'package:aves/theme/durations.dart';
 import 'package:aves/widgets/common/grid/section_layout.dart';
+import 'package:collection/collection.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 
-mixin GridItemTrackerMixin<T, U extends StatefulWidget> on State<U> {
+mixin GridItemTrackerMixin<T, U extends StatefulWidget> on State<U>, WidgetsBindingObserver {
   ValueNotifier<double> get appBarHeightNotifier;
 
-  GlobalKey get scrollableKey;
-
   ScrollController get scrollController;
 
+  GlobalKey get scrollableKey;
+
+  Size get scrollableSize {
+    final scrollableContext = scrollableKey.currentContext!;
+    return (scrollableContext.findRenderObject() as RenderBox).size;
+  }
+
+  Orientation get _windowOrientation {
+    final size = WidgetsBinding.instance!.window.physicalSize;
+    return size.width > size.height ? Orientation.landscape : Orientation.portrait;
+  }
+
   final List<StreamSubscription> _subscriptions = [];
 
+  // grid section metrics before the app is laid out with the new orientation
+  late SectionedListLayout<T> _lastSectionedListLayout;
+  late Size _lastScrollableSize;
+  late Orientation _lastOrientation;
+
   @override
   void initState() {
     super.initState();
     final highlightInfo = context.read<HighlightInfo>();
     _subscriptions.add(highlightInfo.eventBus.on<TrackEvent<T>>().listen((e) => _trackItem(
           e.item,
+          alignment: e.alignment,
           animate: e.animate,
-          highlight: e.highlight,
+          highlightItem: e.highlightItem,
         )));
+    WidgetsBinding.instance!.addObserver(this);
+    WidgetsBinding.instance!.addPostFrameCallback((_) {
+      _lastSectionedListLayout = context.read<SectionedListLayout<T>>();
+      _lastScrollableSize = scrollableSize;
+      _lastOrientation = _windowOrientation;
+    });
   }
 
   @override
   void dispose() {
+    WidgetsBinding.instance!.removeObserver(this);
     _subscriptions
       ..forEach((sub) => sub.cancel())
       ..clear();
@@ -39,18 +63,20 @@ mixin GridItemTrackerMixin<T, U extends StatefulWidget> on State<U> {
   // `Scrollable.ensureVisible` only works on already rendered objects
   // `RenderViewport.showOnScreen` can find any `RenderSliver`, but not always a `RenderMetadata`
   // `RenderViewport.scrollOffsetOf` is a good alternative
-  Future<void> _trackItem(T item, {required bool animate, required Object? highlight}) async {
+  Future<void> _trackItem(
+    T item, {
+    required Alignment alignment,
+    required bool animate,
+    required Object? highlightItem,
+  }) async {
     final sectionedListLayout = context.read<SectionedListLayout<T>>();
     final tileRect = sectionedListLayout.getTileRect(item);
     if (tileRect == null) return;
 
-    final scrollableContext = scrollableKey.currentContext!;
-    final scrollableHeight = (scrollableContext.findRenderObject() as RenderBox).size.height;
-
     // most of the time the app bar will be scrolled away after scaling,
     // so we compensate for it to center the focal point thumbnail
     final appBarHeight = appBarHeightNotifier.value;
-    final scrollOffset = tileRect.top + (tileRect.height - scrollableHeight) / 2 + appBarHeight;
+    final scrollOffset = appBarHeight + tileRect.top + (tileRect.height - scrollableSize.height) * ((alignment.y + 1) / 2);
 
     if (animate) {
       if (scrollOffset > 0) {
@@ -66,8 +92,43 @@ mixin GridItemTrackerMixin<T, U extends StatefulWidget> on State<U> {
       await Future.delayed(Durations.highlightJumpDelay);
     }
 
-    if (highlight != null) {
+    if (highlightItem != null) {
-      context.read<HighlightInfo>().set(highlight);
+      context.read<HighlightInfo>().set(highlightItem);
     }
   }
+
+  @override
+  void didChangeMetrics() {
+    // the timing of `didChangeMetrics` is unreliable w.r.t. `MediaQuery` update (and following app layout)
+    // most of the time, this is called before `MediaQuery` is updated, but not all the time
+    final orientation = _windowOrientation;
+    if (_lastOrientation != orientation) {
+      _lastOrientation = orientation;
+      _onWindowOrientationChange();
+    }
+  }
+
+  void _onWindowOrientationChange() {
+    final layout = _lastSectionedListLayout;
+    final halfSize = _lastScrollableSize / 2;
+    final center = Offset(
+      halfSize.width,
+      halfSize.height + scrollController.offset - appBarHeightNotifier.value,
+    );
+    var pivotItem = layout.getItemAt(center) ?? layout.getItemAt(Offset(0, center.dy));
+    if (pivotItem == null) {
+      final pivotSectionKey = layout.getSectionAt(center.dy)?.sectionKey;
+      if (pivotSectionKey != null) {
+        pivotItem = layout.sections[pivotSectionKey]?.firstOrNull;
+      }
+    }
+
+    WidgetsBinding.instance!.addPostFrameCallback((_) {
+      if (pivotItem != null) {
+        context.read<HighlightInfo>().trackItem(pivotItem, animate: false);
+      }
+      _lastSectionedListLayout = context.read<SectionedListLayout<T>>();
+      _lastScrollableSize = scrollableSize;
+    });
+  }
 }

lib/widgets/common/scaling.dart

@@ -113,7 +113,7 @@ class _GridScaleGestureDetectorState<T> extends State<GridScaleGestureDetector<T
           WidgetsBinding.instance!.addPostFrameCallback((_) {
             final trackItem = _metadata!.item;
             final highlightItem = widget.highlightItem?.call(trackItem) ?? trackItem;
-            context.read<HighlightInfo>().trackItem(trackItem, animate: false, highlight: highlightItem);
+            context.read<HighlightInfo>().trackItem(trackItem, animate: false, highlightItem: highlightItem);
             _applyingScale = false;
           });
         }

lib/widgets/filter_grids/common/filter_grid_page.dart

@@ -281,7 +281,7 @@ class _FilterSectionedContent<T extends CollectionFilter> extends StatefulWidget
   _FilterSectionedContentState createState() => _FilterSectionedContentState<T>();
 }
 
-class _FilterSectionedContentState<T extends CollectionFilter> extends State<_FilterSectionedContent<T>> with GridItemTrackerMixin<FilterGridItem<T>, _FilterSectionedContent<T>> {
+class _FilterSectionedContentState<T extends CollectionFilter> extends State<_FilterSectionedContent<T>> with WidgetsBindingObserver, GridItemTrackerMixin<FilterGridItem<T>, _FilterSectionedContent<T>> {
   Widget get appBar => widget.appBar;
 
   @override
@@ -332,7 +332,7 @@ class _FilterSectionedContentState<T extends CollectionFilter> extends State<_Fi
       final gridItem = visibleFilterSections.values.expand((list) => list).firstWhereOrNull((gridItem) => gridItem.filter == filter);
       if (gridItem != null) {
         await Future.delayed(Durations.highlightScrollInitDelay);
-        highlightInfo.trackItem(gridItem, animate: true, highlight: filter);
+        highlightInfo.trackItem(gridItem, highlightItem: filter);
       }
     }
   }

lib/widgets/viewer/entry_action_delegate.dart

@@ -223,7 +223,7 @@ class EntryActionDelegate with FeedbackMixin, PermissionAwareMixin, SizeAwareMix
                   final newUris = movedOps.map((v) => v.newFields['uri'] as String?).toSet();
                   final targetEntry = targetCollection.sortedEntries.firstWhereOrNull((entry) => newUris.contains(entry.uri));
                   if (targetEntry != null) {
-                    highlightInfo.trackItem(targetEntry, animate: true, highlight: targetEntry);
+                    highlightInfo.trackItem(targetEntry, highlightItem: targetEntry);
                   }
                 },
               )