Flutter DataTable Examples

Let us look at a simple Flutter datatable example.

Example 1: Datatable

This example will comprise the following files:

  • data_table_example.dart

Step 1: Create Project.

  1. Open your favorite Flutter IDE.
  2. Go to File-->New-->Project to create a new project.

Step 2: Dependencies.

No external dependencies are needed for this project.

Step 4: Write Dart Code

Write your code as follows:

*(a). data_table_example.dart

Create a file Dart named data_table_example.dart

Here is the full code

import 'package:flutter/material.dart';
class DataClassExample extends StatelessWidget {
  final String title;
  const DataClassExample(this.title);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Center(
        child: DataTable(
          sortColumnIndex: 1,
          columns: const [
            DataColumn(
              label: Text("One"),
              numeric: true,
              tooltip: "This is first column",
            ),
            DataColumn(
              label: Text("Two"),
            )
          ],
          rows: [
            DataRow(
              cells: [
                DataCell(
                  const Text("Cell 1"),
                  showEditIcon: true,
                  onTap: () {
                    print("Cell 1 tapped");
                  },
                ),
                DataCell(
                  const Text("Cell 2"),
                  onTap: () {},
                ),
              ],
            ),
            DataRow(
              cells: [
                DataCell(
                  const Text("Cell 3"),
                  onTap: () {},
                ),
                DataCell(
                  const Text("Cell 4"),
                  onTap: () {},
                ),
              ],
            ),
            DataRow(
              cells: [
                DataCell(
                  const Text("Cell 5"),
                  onTap: () {},
                ),
                DataCell(
                  const Text("Cell 6"),
                  onTap: () {},
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

Run

Simply copy the source code into your Flutter Project, Build and Run.

Reference.

Download code here.
Follow code author here.