Skip to content

Commit

Permalink
Fix DataTable example not being scrollable (#131556)
Browse files Browse the repository at this point in the history
  • Loading branch information
Chinmay-KB authored Sep 11, 2023
1 parent 0770c60 commit 4a3ab68
Show file tree
Hide file tree
Showing 4 changed files with 33 additions and 4 deletions.
1 change: 0 additions & 1 deletion dev/bots/check_code_samples.dart
Original file line number Diff line number Diff line change
Expand Up @@ -292,7 +292,6 @@ final Set<String> _knownMissingTests = <String>{
'examples/api/test/material/stepper/stepper.controls_builder.0_test.dart',
'examples/api/test/material/stepper/stepper.0_test.dart',
'examples/api/test/material/flexible_space_bar/flexible_space_bar.0_test.dart',
'examples/api/test/material/data_table/data_table.1_test.dart',
'examples/api/test/material/data_table/data_table.0_test.dart',
'examples/api/test/material/floating_action_button_location/standard_fab_location.0_test.dart',
'examples/api/test/material/chip/deletable_chip_attributes.on_deleted.0_test.dart',
Expand Down
5 changes: 2 additions & 3 deletions examples/api/lib/material/data_table/data_table.1.dart
Original file line number Diff line number Diff line change
Expand Up @@ -30,13 +30,12 @@ class DataTableExample extends StatefulWidget {
}

class _DataTableExampleState extends State<DataTableExample> {
static const int numItems = 10;
static const int numItems = 20;
List<bool> selected = List<bool>.generate(numItems, (int index) => false);

@override
Widget build(BuildContext context) {
return SizedBox(
width: double.infinity,
return SingleChildScrollView(
child: DataTable(
columns: const <DataColumn>[
DataColumn(
Expand Down
24 changes: 24 additions & 0 deletions examples/api/test/material/data_table/data_table.1_test.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
// Copyright 2014 The Flutter Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

import 'package:flutter/material.dart';
import 'package:flutter_api_samples/material/data_table/data_table.1.dart' as example;
import 'package:flutter_test/flutter_test.dart';

void main() {
testWidgets('DataTable is scrollable', (WidgetTester tester) async {
await tester.pumpWidget(
const example.DataTableExampleApp(),
);

expect(find.byType(SingleChildScrollView), findsOneWidget);

expect(tester.getTopLeft(find.text('Row 5')), const Offset(66.0, 366.0));

await tester.drag(find.byType(SingleChildScrollView), const Offset(0.0, -200.0));
await tester.pumpAndSettle();

expect(tester.getTopLeft(find.text('Row 5')), const Offset(66.0, 186.0));
});
}
7 changes: 7 additions & 0 deletions packages/flutter/lib/src/material/data_table.dart
Original file line number Diff line number Diff line change
Expand Up @@ -357,6 +357,13 @@ class DataCell {
/// [PaginatedDataTable] which automatically splits the data into
/// multiple pages.
///
/// ## Performance considerations when wrapping [DataTable] with [SingleChildScrollView]
///
/// Wrapping a [DataTable] with [SingleChildScrollView] is expensive as [SingleChildScrollView]
/// mounts and paints the entire [DataTable] even when only some rows are visible. If scrolling in
/// one direction is necessary, then consider using a [CustomScrollView], otherwise use [PaginatedDataTable]
/// to split the data into smaller pages.
///
/// {@tool dartpad}
/// This sample shows how to display a [DataTable] with three columns: name, age, and
/// role. The columns are defined by three [DataColumn] objects. The table
Expand Down

0 comments on commit 4a3ab68

Please sign in to comment.