sticky_header: Handle GrowthDirection.reverse

This resolves the last of the "TODO dir" comments in this library.

We had originally written this library to rely on the assumption
that `constraints.growthDirection` was `GrowthDirection.forward`,
i.e. that the direction in which `constraints.scrollOffset` increases
was the same as `constraints.axisDirection`, in order to keep down
the number of distinct directions one needs to keep track of in
writing and reading (and debugging) the implementation.

But now that this logic is relatively solid within that case --
and now that we have a solid test suite for this library -- we can
go back and identify the handful of places that need to be flipped
around for `GrowthDirection.reverse`, and do so.

This support isn't yet especially *useful*: there are a couple of
unrelated bugs which are triggered when the area allotted to this
sliver isn't the entire viewport, and there isn't a lot of reason
to have a sliver with GrowthDirection.reverse when no other sliver
is potentially occupying part of the viewport.  We'll fix those
separately.

Author: gnprice

lib/widgets/sticky_header.dart

@@ -272,7 +272,29 @@ class StickyHeaderListView extends BoxScrollView {
 /// For example if the list scrolls to the left, then
 /// [scrollingStart] means the right edge of the list, regardless of whether
 /// the ambient [Directionality] is RTL or LTR.
-enum HeaderPlacement { scrollingStart, scrollingEnd }
+enum HeaderPlacement {
+  scrollingStart,
+  scrollingEnd;
+
+  _HeaderGrowthPlacement _byGrowth(GrowthDirection growthDirection) {
+    return switch ((growthDirection, this)) {
+      (GrowthDirection.forward, scrollingStart) => _HeaderGrowthPlacement.growthStart,
+      (GrowthDirection.forward, scrollingEnd)   => _HeaderGrowthPlacement.growthEnd,
+      (GrowthDirection.reverse, scrollingStart) => _HeaderGrowthPlacement.growthEnd,
+      (GrowthDirection.reverse, scrollingEnd)   => _HeaderGrowthPlacement.growthStart,
+    };
+  }
+}
+
+/// Where a header goes, in terms of the list sliver's growth direction.
+///
+/// This will agree with the [HeaderPlacement] value if the growth direction
+/// is [GrowthDirection.forward], but contrast with it if the growth direction
+/// is [GrowthDirection.reverse].  See [HeaderPlacement._byGrowth].
+enum _HeaderGrowthPlacement {
+  growthStart,
+  growthEnd
+}
 
 class SliverStickyHeaderList extends RenderObjectWidget {
   SliverStickyHeaderList({
@@ -427,10 +449,10 @@ class _RenderSliverStickyHeaderList extends RenderSliver with RenderSliverHelper
     double? endBound;
     if (item != null && !item.allowOverflow) {
       final childParentData = listChild!.parentData! as SliverMultiBoxAdaptorParentData;
-      endBound = switch (_widget.headerPlacement) {
-        HeaderPlacement.scrollingStart =>
+      endBound = switch (_widget.headerPlacement._byGrowth(constraints.growthDirection)) {
+        _HeaderGrowthPlacement.growthStart =>
           childParentData.layoutOffset! + listChild.size.onAxis(constraints.axis),
-        HeaderPlacement.scrollingEnd =>
+        _HeaderGrowthPlacement.growthEnd =>
           childParentData.layoutOffset!,
       };
     }
@@ -562,7 +584,7 @@ class _RenderSliverStickyHeaderList extends RenderSliver with RenderSliverHelper
       } else {
         // The limiting edge of the header's item,
         // in the outer, non-scrolling coordinates.
-        final endBoundAbsolute = axisDirectionIsReversed(constraints.axisDirection)
+        final endBoundAbsolute = axisDirectionIsReversed(constraints.growthAxisDirection)
           ? geometry.layoutExtent - (_headerEndBound! - constraints.scrollOffset)
           : _headerEndBound! - constraints.scrollOffset;
 
@@ -614,7 +636,7 @@ class _RenderSliverStickyHeaderList extends RenderSliver with RenderSliverHelper
     // need to convert to the sliver's coordinate system.
     final headerParentData = (header!.parentData as SliverPhysicalParentData);
     final paintOffset = headerParentData.paintOffset;
-    return switch (constraints.axisDirection) {
+    return switch (constraints.growthAxisDirection) {
       AxisDirection.right => paintOffset.dx,
       AxisDirection.left  => geometry!.layoutExtent - header!.size.width  - paintOffset.dx,
       AxisDirection.down  => paintOffset.dy,
@@ -710,18 +732,36 @@ class _RenderSliverStickyHeaderListInner extends RenderSliverList {
 
   @override
   void performLayout() {
-    assert(constraints.growthDirection == GrowthDirection.forward); // TODO dir
-
     super.performLayout();
 
-    final child = switch (widget.headerPlacement) {
-      HeaderPlacement.scrollingStart => _findChildAtStart(),
-      HeaderPlacement.scrollingEnd   => _findChildAtEnd(),
-    };
+    final RenderBox? child;
+    switch (widget.headerPlacement._byGrowth(constraints.growthDirection)) {
+      case _HeaderGrowthPlacement.growthEnd:
+        child = _findChildAtEnd();
+      case _HeaderGrowthPlacement.growthStart:
+        child = _findChildAtStart();
+    }
+
     (parent! as _RenderSliverStickyHeaderList)._rebuildHeader(child);
   }
 }
 
+extension SliverConstraintsGrowthAxisDirection on SliverConstraints {
+  AxisDirection get growthAxisDirection => switch (growthDirection) {
+    GrowthDirection.forward => axisDirection,
+    GrowthDirection.reverse => axisDirection.reversed,
+  };
+}
+
+extension AxisDirectionReversed on AxisDirection {
+  AxisDirection get reversed => switch (this) {
+    AxisDirection.down => AxisDirection.up,
+    AxisDirection.up => AxisDirection.down,
+    AxisDirection.right => AxisDirection.left,
+    AxisDirection.left => AxisDirection.right,
+  };
+}
+
 extension AxisCoordinateDirection on Axis {
   AxisDirection get coordinateDirection => switch (this) {
     Axis.horizontal => AxisDirection.right,

test/widgets/sticky_header_test.dart

@@ -67,38 +67,38 @@ void main() {
 
   for (final reverse in [true, false]) {
     for (final reverseHeader in [true, false]) {
-      for (final allowOverflow in [true, false]) {
-        final name = 'sticky headers: '
-          'scroll ${reverse ? 'up' : 'down'}, '
-          'header at ${reverseHeader ? 'bottom' : 'top'}, '
-          'headers ${allowOverflow ? 'overflow' : 'bounded'}';
-        testWidgets(name, (tester) =>
-          _checkSequence(tester,
-            Axis.vertical,
-            reverse: reverse,
-            reverseHeader: reverseHeader,
-            allowOverflow: allowOverflow,
-          ));
-      }
-    }
-  }
-
-  for (final reverse in [true, false]) {
-    for (final reverseHeader in [true, false]) {
-      for (final allowOverflow in [true, false]) {
-        for (final textDirection in TextDirection.values) {
+      for (final growthDirection in GrowthDirection.values) {
+        for (final allowOverflow in [true, false]) {
           final name = 'sticky headers: '
-            '${textDirection.name.toUpperCase()} '
-            'scroll ${reverse ? 'backward' : 'forward'}, '
-            'header at ${reverseHeader ? 'end' : 'start'}, '
+            'scroll ${reverse ? 'up' : 'down'}, '
+            'header at ${reverseHeader ? 'bottom' : 'top'}, '
+            '$growthDirection, '
             'headers ${allowOverflow ? 'overflow' : 'bounded'}';
           testWidgets(name, (tester) =>
             _checkSequence(tester,
-              Axis.horizontal, textDirection: textDirection,
+              Axis.vertical,
               reverse: reverse,
               reverseHeader: reverseHeader,
+              growthDirection: growthDirection,
               allowOverflow: allowOverflow,
             ));
+
+          for (final textDirection in TextDirection.values) {
+            final name = 'sticky headers: '
+              '${textDirection.name.toUpperCase()} '
+              'scroll ${reverse ? 'backward' : 'forward'}, '
+              'header at ${reverseHeader ? 'end' : 'start'}, '
+              '$growthDirection, '
+              'headers ${allowOverflow ? 'overflow' : 'bounded'}';
+            testWidgets(name, (tester) =>
+              _checkSequence(tester,
+                Axis.horizontal, textDirection: textDirection,
+                reverse: reverse,
+                reverseHeader: reverseHeader,
+                growthDirection: growthDirection,
+                allowOverflow: allowOverflow,
+              ));
+          }
         }
       }
     }
@@ -111,28 +111,43 @@ Future<void> _checkSequence(
   TextDirection? textDirection,
   bool reverse = false,
   bool reverseHeader = false,
+  GrowthDirection growthDirection = GrowthDirection.forward,
   required bool allowOverflow,
 }) async {
   assert(textDirection != null || axis == Axis.vertical);
   final headerAtCoordinateEnd = switch (axis) {
     Axis.horizontal => reverseHeader ^ (textDirection == TextDirection.rtl),
     Axis.vertical   => reverseHeader,
   };
+  final reverseGrowth = (growthDirection == GrowthDirection.reverse);
 
   final controller = ScrollController();
+  const listKey = ValueKey("list");
+  const emptyKey = ValueKey("empty");
   await tester.pumpWidget(Directionality(
     textDirection: textDirection ?? TextDirection.rtl,
-    child: StickyHeaderListView(
+    child: CustomScrollView(
       controller: controller,
       scrollDirection: axis,
       reverse: reverse,
-      reverseHeader: reverseHeader,
-      children: List.generate(100, (i) => StickyHeaderItem(
-        allowOverflow: allowOverflow,
-        header: _Header(i, height: 20),
-        child: _Item(i, height: 100))))));
-
-  final overallSize = tester.getSize(find.byType(StickyHeaderListView));
+      anchor: reverseGrowth ? 1.0 : 0.0,
+      center: reverseGrowth ? emptyKey : listKey,
+      slivers: [
+        SliverStickyHeaderList(
+          key: listKey,
+          headerPlacement: (reverseHeader ^ reverse)
+            ? HeaderPlacement.scrollingEnd : HeaderPlacement.scrollingStart,
+          delegate: SliverChildListDelegate(
+            List.generate(100, (i) => StickyHeaderItem(
+              allowOverflow: allowOverflow,
+              header: _Header(i, height: 20),
+              child: _Item(i, height: 100))))),
+        const SliverPadding(
+          key: emptyKey,
+          padding: EdgeInsets.zero),
+      ])));
+
+  final overallSize = tester.getSize(find.byType(CustomScrollView));
   final extent = overallSize.onAxis(axis);
   assert(extent % 100 == 0);
 
@@ -143,7 +158,7 @@ Future<void> _checkSequence(
           (extent / 2 - inset) * (headerAtCoordinateEnd ? 1 : -1));
   }
 
-  final first = !(reverse ^ reverseHeader);
+  final first = !(reverse ^ reverseHeader ^ reverseGrowth);
 
   final itemFinder = first ? find.byType(_Item).first : find.byType(_Item).last;
 
@@ -155,10 +170,11 @@ Future<void> _checkSequence(
 
   Future<void> checkState() async {
     // Check the header comes from the expected item.
-    final scrollOffset = controller.position.pixels;
+    final scrollOffset = controller.position.pixels * (reverseGrowth ? -1 : 1);
     final expectedHeaderIndex = first
       ? (scrollOffset / 100).floor()
       : (extent ~/ 100 - 1) + (scrollOffset / 100).ceil();
+    // print("$scrollOffset, $extent, $expectedHeaderIndex");
     check(tester.widget<_Item>(itemFinder).index).equals(expectedHeaderIndex);
     check(_headerIndex(tester)).equals(expectedHeaderIndex);
 
@@ -180,7 +196,7 @@ Future<void> _checkSequence(
   }
 
   Future<void> jumpAndCheck(double position) async {
-    controller.jumpTo(position);
+    controller.jumpTo(position * (reverseGrowth ? -1 : 1));
     await tester.pump();
     await checkState();
   }