We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Trusted by the world’s leading companies

Syncfusion Trusted Companies


The Syncfusion Flutter DataGrid (also known as Flutter DataTable) is used to display and manipulate data in a tabular view. Its rich feature set includes row selection, sorting, column sizing, row-height customization, swiping, and more. It has also been optimized to handle high-frequency, real-time updates.

High performance

The Flutter DataGrid was built from the ground up for the best possible performance, even when loading large amounts of data.

Flutter DataGrid performance.

Responsive DataGrid

Responsive features allow the Flutter DataGrid layout to be viewed on various devices. It is also possible to hide specific columns based on the device. Customize the width of all the columns or individual columns with the built-in column sizing options.

Flutter DataGrid performance.

Real-time updates

The Flutter DataGrid can handle high-frequency updates even for demanding scenarios.

Real-time updates in Flutter DataGrid.

Column types

  • Load any widget or multiple widgets in the cells for better data visualization.
  • Show a checkbox column with a checkbox in each row to select an entire row when checked. Users can select or deselect all the rows in a data grid by selecting the checkbox in the header cell.

Flutter DataGrid shows different column types.


  • Show any widget, such as a text field, date-picker, or combo box, as a cell editor.
  • Navigate using the keyboard in web and desktop platforms.
  • Commit or rollback the edited values through an intuitive API.

Editing in flutter datagrid

Data operations

Columns are sorted in Flutter DataGrid.


Sort data against one or more columns in ascending or descending order. Also perform tri-state sorting and display sort numbers to indicate the sort order.

Table summary in Flutter DataGrid


Show an additional unbound row to display summaries or totals. Display the different aggregate types such as sum, minimum, maximum, average, and count.


  • Select a row with any of the four built-in selection modes: single, multiple, single deselect, and none. The single deselect mode clears a selected row when it is tapped again.
  • Keep track of the last row and cell interaction using the current cell. Use the keyboard to navigate through rows and cells in web platforms.
  • Customize the selection background and foreground color, as well as the border color and border width, for the current cell.

Flutter DataGrid shows rows with selection.

Column sizing

  • The column width can be adjusted to enhance the readability of the content.
  • Fit the columns based on the value of the cells or name of the column.

Row and column customization

Flutter DataGrid shows rows in auto-fit.

Row height

Users can adjust the row height to enhance the readability of the content. It is also possible to set the row height conditionally.

First row and column are frozen in Flutter DataGrid.

Freeze panes

Users can freeze rows and columns at the top, bottom, left, and right positions, similar to Excel. Horizontal and vertical scrolling can be performed, except on fixed columns and rows.

Flutter DataGrid shows multiple column headers.

Stacked headers

Show unbound header rows along with the column header row. Unbound header rows span header cells across multiple rows and columns.

Column resizing in Flutter DataGrid

Column resizing

Resize a column dynamically by just tapping and dragging the right end of the column header in web and desktop platforms. In mobile platforms, resize columns by dragging the indicator line, which will be shown when the column header is long-pressed.

Infinite scrolling and load more

  • Load more rows in a data grid at run time when vertical scrolling reaches its maximum offset.
  • Users can do infinite or endless scrolling to load more rows continuously.
  • The loading indicator or any widget can be shown at the bottom of a data grid to indicate lazy loading.

Infinite scrolling in Flutter DataGrid.

Pull to refresh

Refresh the data at run time when the datagrid is pulled down.

Pull to refresh in Flutter DataGrid.


Swipe a row right to left or left to right for custom actions such as deleting, editing, and so on. When the user swipes a row, the row will be moved, and swipe view will be shown for custom actions.

Swiping Flutter DataGrid.

  • Show an additional row below the last row.
  • Load any widget in the footer to perform custom actions.
  • Change the height to improve the appearance.

Footer in Flutter DataGrid.


Manipulate data using the DataPager widget to view rows in multiple pages.

Flutter DataGrid shows rows in page segments.


Styling in Flutter DataGrid.


Customize vertical or horizontal grid line borders, or both. Customize the border color and border thickness, as well.

Styling in Flutter DataGrid.

Conditional styles

Customize row appearances conditionally, based on the data.

Export to Excel and Pdf

Export the DataGrid content, such as column headers, rows, stacked header rows, and table summary rows, to Excel and PDF documents with several customization options.

Flutter DataGrid supports exporting data to Excel and Pdf


Greatness—it’s one thing to say you have it, but it means more when others recognize it. Syncfusion is proud to hold the following industry awards.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile