data_table_2 icon indicating copy to clipboard operation
data_table_2 copied to clipboard

auto columns size by contents, like default implementation of DataTable

Open joo opened this issue 3 years ago • 10 comments

Fixed width columns are faster than default implementation of DataTable which does 2 passes to determine contents size and justify column widths

no, please hold a way, can auto columns size by contents, like default implementation of DataTable.

joo avatar Dec 17 '21 13:12 joo

minWidth set all columns width is very strange, should in DataColumn2's size set auto or fixed width.

joo avatar Dec 17 '21 13:12 joo

minWidth, smRatio, lmRatio, ColumnSize.M(S,L) are not needed, too complex. only DataColumn2 size set auto or fixed width.

joo avatar Dec 17 '21 14:12 joo

HTML table style and CSS is a good practice, no smRatio, lmRatio, Size.M, Size.S, Size.L

joo avatar Dec 17 '21 14:12 joo

No plans to add that feature as of now. PR is welcome

maxim-saplin avatar Dec 19 '21 13:12 maxim-saplin

@maxim-saplin , thanks very much, I typed a small piece of very ugly code, the table automatically sets the column width by content, I know there is a performance problem, but this is my personal solution.

       // Joo  Tsao
        final TextStyle effectiveHeadingTextStyle =
            headingTextStyle ?? theme.dataTableTheme.headingTextStyle ?? theme.textTheme.subtitle2!;
        final TextStyle effectiveDataTextStyle =
            dataTextStyle ?? theme.dataTableTheme.dataTextStyle ?? theme.textTheme.bodyText2!;
        for (var i = 0; i < columns.length; i++) {
          var col = columns[i];
          var label = (col.label as Text);
          var textDirection = col.numeric ? TextDirection.rtl : TextDirection.ltr;
          var size = (TextPainter(
                  text: TextSpan(text: label.data, style: effectiveHeadingTextStyle),
                  maxLines: 1,
                  textScaleFactor: MediaQuery.of(context).textScaleFactor,
                  textDirection: textDirection)
                ..layout())
              .size;
          widths[i] = paddingStart + size.width + paddingEnd;
          if (col.onSort != null) widths[i] += 18;
          for (var j = 0; j < rows.length; j++) {
            var row = rows[j];
            var cell = row.cells[i];
            if (cell.child is! Text) continue;
            var cellText = cell.child as Text;

            var size = (TextPainter(
                    text: TextSpan(text: cellText.data, style: effectiveDataTextStyle),
                    maxLines: 1,
                    textScaleFactor: MediaQuery.of(context).textScaleFactor,
                    textDirection: textDirection)
                  ..layout())
                .size;
            var width = paddingStart + size.width + paddingEnd;
            if (width > widths[i]) widths[i] = width;
          }
        }

截图_选择区域_20211222014902

joo avatar Dec 21 '21 17:12 joo

just like the default data_table, build table performance is ok, 0~4ms. 截图_选择区域_20211222020311 截图_选择区域_20211222020338 截图_选择区域_20211222020510

joo avatar Dec 21 '21 18:12 joo

do not use IntrinsicColumnWidth, calc column max row width by content to set FixedColumnWidth.

joo avatar Dec 21 '21 18:12 joo

Thanks for the attempt! Though a proper GitHub pool request with new feature (not breaking any of the existing capabilities), documented, new example (under /examples folder) showcasing the new capability and with integration tests covering new feature - that might be useful. A snippet of 'ugly' (as you say ;) and slow code is of little help here

maxim-saplin avatar Dec 22 '21 13:12 maxim-saplin

In my spare time, I will PR and test.

joo avatar Dec 22 '21 19:12 joo

Btw, it seems you used TextPainter to calculate cell contents' width. Mind that DataCell can have any widget, not just Text

maxim-saplin avatar Dec 23 '21 10:12 maxim-saplin