CODEWITHSUNDEEP
flutter
Yashwanth Ravula
Yashwanth Ravula

Reputation: 643

How to remove the clickable nature of rows in flutter Data Table class?

I am developing an app where I just want to display data in the table, I don't want the rows to be clickable, but by default they are clickable. How can I turn it off?

DataTable(
      columns: const <DataColumn>[
        DataColumn(
          label: Text(
            'Name',
            style: TextStyle(fontStyle: FontStyle.italic),
          ),
        ),
        DataColumn(
          label: Text(
            'Age',
            style: TextStyle(fontStyle: FontStyle.italic),
          ),
        ),
        DataColumn(
          label: Text(
            'Role',
            style: TextStyle(fontStyle: FontStyle.italic),
          ),
        ),
      ],
      rows: const <DataRow>[
        DataRow(
          cells: <DataCell>[
            DataCell(Text('Sarah')),
            DataCell(Text('19')),
            DataCell(Text('Student')),
          ],
        ),
        DataRow(
          cells: <DataCell>[
            DataCell(Text('Janine')),
            DataCell(Text('43')),
            DataCell(Text('Professor')),
          ],
        ),
        DataRow(
          cells: <DataCell>[
            DataCell(Text('William')),
            DataCell(Text('27')),
            DataCell(Text('Associate Professor')),
          ],
        ),
      ],
    );

This is the sample code from the flutter website.

Upvotes: 0

Views: 551

Answers (1)

Zahra Adelung
Zahra Adelung

Reputation: 11

You can remove the splash effect of rows by setting both splashColor and highlightColor to transparent in MaterialApp theme as bellow:

  return MaterialApp(

  title: 'Flutter Demo',

  theme: ThemeData(

    splashColor: Colors.transparent,
    highlightColor: Colors.transparent,
  ),
  );

That disables tap splash effet.

Upvotes: 1

Related Questions