How can i make a table's header or column fixed

something like
jQuery-Plugin-For-Fixed-Table-Header-Footer-Columns-TableHeadFixer

Thanks

Please consider asking in one of the channels http://flutter.io/support .

Thank you~~

So, how can i do it? i cant understand

I have the same need. We are working on making some kind of workaround using DataTable and external scroll controllers.

You can follow and contribute to the thread here:
StackOverflow Thread

I've tried making some changes to the workaround, I'm looking to make only the header row sticky (fixed). I have some issues when scrolling, the header row scrolling is out of sync with the data table.

Nice work!

This is happening because the top table (header) and main table have different sizes and column count. That makes them out of sync.

Looking at DataTable code i've found out that the width is build using tableColumns[displayColumnIndex] = const IntrinsicColumnWidth(flex: 1.0); to make them dynamic acordingly to the content.

On the end it uses:

    return Table(
      columnWidths: tableColumns.asMap(),
      children: tableRows,
    );

I'll try to fork the DataTable object and use this columnWidths

I updated my answer on StackOverflow with a CustomDataTable where you can set the data to fill the table, set the width of the cells, and set an optional fixed column / fixed row. I think with this you can get an idea of how to improve it:
Fixed column and row header for DataTable on Flutter Dart

@pablobarrera

Hi @pablobarrera, I'm trying to follow your solution, how can we use the _rowsCells, _fixedColCells, and _fixedRowCells ? As these are not widget list.

I updated the custom widget to receive any lists of data and an optional cellBuilder, you can see in the example how to use it. I also added the option to set the height of the cells.
Fixed column and row header for DataTable on Flutter Dart

I won't keep improving it because is just a workaround, as I mentioned in the answer, we're hiding headers of DataTable. It would be good if we could remove headers on DataTable, so this could be a better solution. Anyway, you're free to use it and improve it the way you want.

Closing as this discussion should occur on Stack Overflow or one of our support channels at http://flutter.dev/support. Thanks for using Flutter!

Could you please reopen the issue? It should be possible to fix table header.

Please reopen this issue.

JIC, I've taken appart DataTable and PaginatedDataTable, made the changes to fix top/header row and published these versions as a separate package: https://pub.dev/packages/data_table_2

i found this, it solve my problem

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

How can i make a table's header or column fixed #21165

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

How can i make a table's header or column fixed #21165

Description

Activity

zoechi commented on Aug 30, 2018

okjesse commented on Sep 1, 2018

werytert commented on Apr 18, 2019

Goostavo commented on Oct 24, 2019

kismet- commented on Oct 24, 2019

Goostavo commented on Oct 24, 2019

pablobarrera commented on Oct 24, 2019

kismet- commented on Oct 24, 2019

pablobarrera commented on Oct 25, 2019

kf6gpe commented on Jan 6, 2020

deadsoul44 commented on Mar 23, 2020

lukele1607 commented on Jul 16, 2020

maxim-saplin commented on Apr 24, 2021

edilson14 commented on Jun 17, 2021

github-actions commented on Jul 31, 2021

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions