In this article, we will show you how to inherit the scrolling from parent widget to Flutter DataTable.
Initialize the SfDataGrid widget with all the necessary properties. To do this, wrap SingleChildScrollView around SfDataGrid as its parent. Then, enable SfDataGrid.shrinkWrapRows to set the height of the datagrid based on the available number of rows. However, note that when using shrinkWrapRows, all rows are constructed during the initial loading to calculate the height of the DataGrid. This approach helps eliminate the inner scroll and enables scrolling through its parent SingleChildScrollView.
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Syncfusion Flutter DataGrid'),
),
body: SingleChildScrollView(
child: Column(
children: [
Container(
height: 200,
color: Colors.green,
child: const Center(
child: Text(
'Container widget 1',
style: TextStyle(
color: Colors.white,
fontSize: 20,
),
),
),
),
SfDataGrid(
shrinkWrapRows: true,
source: employeeDataSource,
columnWidthMode: ColumnWidthMode.fill,
columns: getColumns
),
],
),
),
);
}
You can download this example on GitHub.