[two_dimensional_scrollables] Fix another combo of pinned/unpinned merged TableViewCells (flutter#6283)

Fixes flutter/flutter#144100
Picks up doc fix from flutter#6154 as well

Author: Piinks

packages/two_dimensional_scrollables/CHANGELOG.md

@@ -1,3 +1,8 @@
+## 0.1.2
+
+* Fixes a layout issue for unpinned merged cells that follow pinned table spans.
+* Updates outdated sample code.
+
 ## 0.1.1
 
 * Fixes a layout issue when pinned cells are merged.

packages/two_dimensional_scrollables/lib/src/table_view/table.dart

@@ -49,8 +49,10 @@ import 'table_span.dart';
 /// ```dart
 /// TableView.builder(
 ///   cellBuilder: (BuildContext context, TableVicinity vicinity) {
-///     return Center(
-///       child: Text('Cell ${vicinity.column} : ${vicinity.row}'),
+///     return TableViewCell(
+///       child: Center(
+///         child: Text('Cell ${vicinity.column} : ${vicinity.row}'),
+///       ),
 ///     );
 ///   },
 ///   columnCount: 10,
@@ -809,10 +811,10 @@ class RenderTableViewport extends RenderTwoDimensionalViewport {
                 switch ((rowIsInPinnedColumn, rowIsPinned)) {
               // Both row and column are pinned at this cell, or just pinned row.
               (true, true) || (false, true) => 0.0,
-              // Cell is within a pinned column
-              (true, false) => _pinnedRowsExtent - verticalOffset.pixels,
-              // Cell is within a pinned row, or no pinned portion.
-              (false, false) => -verticalOffset.pixels,
+              // Cell is within a pinned column, or no pinned area at all.
+              (true, false) ||
+              (false, false) =>
+                _pinnedRowsExtent - verticalOffset.pixels,
             };
             mergedRowOffset = baseRowOffset +
                 _rowMetrics[firstRow]!.leadingOffset +
@@ -830,10 +832,10 @@ class RenderTableViewport extends RenderTwoDimensionalViewport {
                 switch ((columnIsInPinnedRow, columnIsPinned)) {
               // Both row and column are pinned at this cell, or just pinned column.
               (true, true) || (false, true) => 0.0,
-              // Cell is within a pinned row.
-              (true, false) => _pinnedColumnsExtent - horizontalOffset.pixels,
-              // No pinned portion.
-              (false, false) => -horizontalOffset.pixels,
+              // Cell is within a pinned row, or no pinned area at all.
+              (true, false) ||
+              (false, false) =>
+                _pinnedColumnsExtent - horizontalOffset.pixels,
             };
             mergedColumnOffset = baseColumnOffset +
                 _columnMetrics[firstColumn]!.leadingOffset +

packages/two_dimensional_scrollables/pubspec.yaml

@@ -1,6 +1,6 @@
 name: two_dimensional_scrollables
 description: Widgets that scroll using the two dimensional scrolling foundation.
-version: 0.1.1
+version: 0.1.2
 repository: https://github.com/flutter/packages/tree/main/packages/two_dimensional_scrollables
 issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+two_dimensional_scrollables%22+
 

packages/two_dimensional_scrollables/test/table_view/table_test.dart

@@ -2207,6 +2207,74 @@ void main() {
       });
     });
   });
+
+  testWidgets(
+      'Merged unpinned cells following pinned cells are laid out correctly',
+      (WidgetTester tester) async {
+    final ScrollController verticalController = ScrollController();
+    final ScrollController horizontalController = ScrollController();
+    final Set<TableVicinity> mergedCell = <TableVicinity>{
+      const TableVicinity(row: 2, column: 2),
+      const TableVicinity(row: 3, column: 2),
+      const TableVicinity(row: 2, column: 3),
+      const TableVicinity(row: 3, column: 3),
+    };
+    final TableView tableView = TableView.builder(
+      columnCount: 10,
+      rowCount: 10,
+      columnBuilder: (_) => const TableSpan(extent: FixedTableSpanExtent(100)),
+      rowBuilder: (_) => const TableSpan(extent: FixedTableSpanExtent(100)),
+      cellBuilder: (BuildContext context, TableVicinity vicinity) {
+        if (mergedCell.contains(vicinity)) {
+          return const TableViewCell(
+            rowMergeStart: 2,
+            rowMergeSpan: 2,
+            columnMergeStart: 2,
+            columnMergeSpan: 2,
+            child: Text('Tile c: 2, r: 2'),
+          );
+        }
+        return TableViewCell(
+          child: Text('Tile c: ${vicinity.column}, r: ${vicinity.row}'),
+        );
+      },
+      pinnedRowCount: 1,
+      pinnedColumnCount: 1,
+      verticalDetails: ScrollableDetails.vertical(
+        controller: verticalController,
+      ),
+      horizontalDetails: ScrollableDetails.horizontal(
+        controller: horizontalController,
+      ),
+    );
+    await tester.pumpWidget(MaterialApp(home: tableView));
+    await tester.pumpAndSettle();
+
+    expect(verticalController.position.pixels, 0.0);
+    expect(horizontalController.position.pixels, 0.0);
+    expect(
+      tester.getRect(find.text('Tile c: 2, r: 2')),
+      const Rect.fromLTWH(200.0, 200.0, 200.0, 200.0),
+    );
+
+    verticalController.jumpTo(10.0);
+    await tester.pumpAndSettle();
+    expect(verticalController.position.pixels, 10.0);
+    expect(horizontalController.position.pixels, 0.0);
+    expect(
+      tester.getRect(find.text('Tile c: 2, r: 2')),
+      const Rect.fromLTWH(200.0, 190.0, 200.0, 200.0),
+    );
+
+    horizontalController.jumpTo(10.0);
+    await tester.pumpAndSettle();
+    expect(verticalController.position.pixels, 10.0);
+    expect(horizontalController.position.pixels, 10.0);
+    expect(
+      tester.getRect(find.text('Tile c: 2, r: 2')),
+      const Rect.fromLTWH(190.0, 190.0, 200.0, 200.0),
+    );
+  });
 }
 
 class _NullBuildContext implements BuildContext, TwoDimensionalChildManager {