Using the package two_dimensional_scrollables I want to expand and animate the size of a specific column when tapping on it. The code below listens to the user action to change the column size and ref.read(poolSizeControllerProvider).cellWidth(index) calculates the size for the specific column. When a column size changes, I would like to animate the size of that column. How can I achieve this? I guess I need to somehow wrap FixedTableSpanExtent(columnWidth) in an animator, or loop over the width and rebuild the whole table for each iteration but that does not feel very efficient.

  Widget build(BuildContext context) {
    final cells = widget.tableDetails.getCells();

    ref.watch(tableSizeControllerProvider);

    final cellHeight = ref.read(tableSizeControllerProvider).cellHeight;

    return SizedBox(
        height: cells.length * cellHeight,
        child: TableView.list(
          horizontalDetails: _horizontalScrollableDetails,
          verticalDetails: _verticalScrollableDetails,
          mainAxis: Axis.horizontal,
          diagonalDragBehavior: DiagonalDragBehavior.free,
          pinnedColumnCount: 2,
          pinnedRowCount: 1,
          columnBuilder: _columnBuildSpan,
          rowBuilder: _rowBuildSpan,
          cells: cells,
        ),
    );
  }

  TableSpan _columnBuildSpan(int index) {
    final columnWidth = ref.read(tableSizeControllerProvider).cellWidth(index);

    const TableSpanDecoration decoration = TableSpanDecoration();
    return TableSpan(
      backgroundDecoration: decoration,
      extent: FixedTableSpanExtent(columnWidth),
      cursor: SystemMouseCursors.click,
    );
  }

  TableSpan _rowBuildSpan(int index) {
    final columnHeight = ref.read(tableSizeControllerProvider).cellHeight;

    const TableSpanDecoration decoration = TableSpanDecoration();
    return TableSpan(
      backgroundDecoration: decoration,
      extent: FixedTableSpanExtent(columnHeight),
      cursor: SystemMouseCursors.click,
    );
  }