import 'package:flutter/material.dart';

​

void main() {

  runApp(MyApp());

}

​

class MyApp extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      home: Scaffold(

        appBar: AppBar(

          title: Text('Scrollable Table Example'),

        ),

        body: ScrollableTable(),

      ),

    );

  }

}

​

class ScrollableTable extends StatelessWidget {

  @override

  Widget build(BuildContext context) {

    return SingleChildScrollView(

      scrollDirection: Axis.vertical,

      child: Table(

        border: TableBorder.all(),

        columnWidths: const <int, TableColumnWidth>{

          0: FixedColumnWidth(100),

          1: FixedColumnWidth(150),

          2: FixedColumnWidth(150),

        },

        defaultVerticalAlignment: TableCellVerticalAlignment.middle,

        children: [

          _buildTableHeader(),

          for (int i = 1; i <= 20; i++) _buildTableRow(i),

        ],

      ),

    );

  }

​

  TableRow _buildTableHeader() {

    return TableRow(

      children: [

        _buildHeaderCell('ID'),

        _buildHeaderCell('Name'),

        _buildHeaderCell('Score'),

      ],

    );

  }

​

  TableRow _buildTableRow(int id) {

    return TableRow(

      children: [

        _buildCell(id.toString()),

        _buildCell('Name $id'),

        _buildCell((id * 10).toString()),

      ],

    );

  }

​

  Widget _buildHeaderCell(String text) {

    return Padding(

      padding: const EdgeInsets.all(8.0),

      child: Text(

        text,

        style: TextStyle(fontWeight: FontWeight.bold),

        textAlign: TextAlign.center,

      ),

    );

  }

​

  Widget _buildCell(String text) {

    return Padding(

      padding: const EdgeInsets.all(8.0),

      child: Text(

        text,

        textAlign: TextAlign.center,

      ),

    );

  }

}

​