Display Data Table in Flutter

A data table is used to display information in a grid format of columns and rows.

A DataTable class is used to create a data table. The columns are defined by DataColumn and rows are defined by DataRow. Each DataRow are constructed with DataCell.

import 'package:flutter/material.dart';

void main() => runApp(const MaterialApp(home: MyApp()));

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Data table')),
      body: DataTable(
        columns: const [
          DataColumn(label: Text('ID')),
          DataColumn(label: Text('Name')),
          DataColumn(label: Text('Age')),
        ],
        rows: const [
          DataRow(
            cells: [
              DataCell(Text('1')),
              DataCell(Text('John')),
              DataCell(Text('20')),
            ],
          ),
          DataRow(
            cells: [
              DataCell(Text('2')),
              DataCell(Text('Robert')),
              DataCell(Text('25')),
            ],
          ),
        ],
      ),
    );
  }
}