PaginatedDataTable fills more than the available size of its card, making it...

PaginatedDataTable fills more than the available size of its card, making it needlessly scroll horizontally 2 (#95390)

* fixed PaginatedDataTable not incorporating the margin of its surrounding Card in its width calculation

* fixed PaginatedDataTable not incorporating the margin of its surrounding Card in its width calculation

packages/flutter/lib/src/material/paginated_data_table.dart

@@ -466,11 +466,11 @@ class PaginatedDataTableState extends State<PaginatedDataTable> {
     ]);
 
     // CARD
-    return LayoutBuilder(
-      builder: (BuildContext context, BoxConstraints constraints) {
-        return Card(
-          semanticContainer: false,
-          child: Column(
+    return Card(
+      semanticContainer: false,
+      child: LayoutBuilder(
+        builder: (BuildContext context, BoxConstraints constraints) {
+          return Column(
             crossAxisAlignment: CrossAxisAlignment.stretch,
             children: <Widget>[
               if (headerWidgets.isNotEmpty)
@@ -547,9 +547,9 @@ class PaginatedDataTableState extends State<PaginatedDataTable> {
                 ),
               ),
             ],
-          ),
-        );
-      },
+          );
+        },
+      ),
     );
   }
 }

packages/flutter/test/material/paginated_data_table_test.dart

@@ -770,13 +770,17 @@ void main() {
     final TestDataSource source = TestDataSource();
 
     // Note: 800 is wide enough to ensure that all of the columns fit in the
-    // Card. The DataTable can be larger than its containing Card, but this test
-    // is only concerned with ensuring the DataTable is at least as wide as the
-    // Card.
+    // Card. The test makes sure that the DataTable is exactly as wide
+    // as the Card, minus the Card's margin.
     const double _originalWidth = 800;
     const double _expandedWidth = 1600;
     const double _height = 400;
 
+    // By default, the margin of a Card is 4 in all directions, so
+    // the size of the DataTable (inside the Card) is horizontically
+    // reduced by 4 * 2; the left and right margins.
+    const double _cardMargin = 8;
+
     final Size originalSize = binding.renderView.size;
 
     Widget buildWidget() => MaterialApp(
@@ -800,21 +804,23 @@ void main() {
     await binding.setSurfaceSize(const Size(_originalWidth, _height));
     await tester.pumpWidget(buildWidget());
 
+    double cardWidth = tester.renderObject<RenderBox>(find.byType(Card).first).size.width;
+
     // Widths should be equal before we resize...
     expect(
       tester.renderObject<RenderBox>(find.byType(DataTable).first).size.width,
-      moreOrLessEquals(tester.renderObject<RenderBox>(find.byType(Card).first).size.width),
+      moreOrLessEquals(cardWidth - _cardMargin),
     );
 
     await binding.setSurfaceSize(const Size(_expandedWidth, _height));
     await tester.pumpWidget(buildWidget());
 
-    final double cardWidth = tester.renderObject<RenderBox>(find.byType(Card).first).size.width;
+    cardWidth = tester.renderObject<RenderBox>(find.byType(Card).first).size.width;
 
     // ... and should still be equal after the resize.
     expect(
       tester.renderObject<RenderBox>(find.byType(DataTable).first).size.width,
-      moreOrLessEquals(cardWidth),
+      moreOrLessEquals(cardWidth - _cardMargin),
     );
 
     // Double check to ensure we actually resized the surface properly.