TableView class

A widget that displays a table, which can scroll in horizontal and vertical directions.

A table consists of rows and columns. Rows fill the horizontal space of the table, while columns fill it vertically. If there is not enough space available to display all the rows at the same time, the table will scroll vertically. If there is not enough space for all the columns, it will scroll horizontally.

Each child TableViewCell can belong to either exactly one row and one column as represented by its TableVicinity, or it can span multiple rows and columns through merging. The table supports lazy rendering and will only instantiate those cells that are currently visible in the table's viewport and those that extend into the cacheExtent. Therefore, when merging cells in a TableView, the same child must be returned from every vicinity the merged cell contains. The build method will only be called once for a merged cell, but since the table's children are lazily laid out, returning the same child ensures the merged cell can be built no matter which part of it is visible.

The layout of the table (e.g. how many rows/columns there are and their extents) as well as the content of the individual cells is defined by the provided delegate, a subclass of TwoDimensionalChildDelegate with the TableCellDelegateMixin. The TableView.builder and TableView.list constructors create their own delegate.

A table with infinite rows and columns can be made by using a TableCellBuilderDelegate, or the TableView.builder constructor, and omitting the row or column count. Returning null from the columnBuilder or rowBuilder in this case will terminate the row or column at that index, representing the end of the table in that axis. In this scenario, until the potential end of the table in either dimension is reached by returning null, the ScrollPosition.maxScrollExtent will reflect double.infinity. This is because as the table is built lazily, it will not know the end has been reached until the ScrollPosition arrives there. This is similar to returning null from ListView.builder to signify the end of the list.

This example shows a TableView of 100 children, all sized 100 by 100 pixels with a few TableSpanDecorations like background colors and borders. The builder constructor is called on demand for the cells that are visible in the TableView.

TableView.builder(
  cellBuilder: (BuildContext context, TableVicinity vicinity) {
    return TableViewCell(
      child: Center(
        child: Text('Cell ${vicinity.column} : ${vicinity.row}'),
      ),
    );
  },
  columnCount: 10,
  columnBuilder: (int column) {
    return TableSpan(
      extent: FixedTableSpanExtent(100),
      foregroundDecoration: TableSpanDecoration(
        border: TableSpanBorder(
          trailing: BorderSide(
           color: Colors.black,
           width: 2,
           style: BorderStyle.solid,
          ),
        ),
      ),
    );
  },
  rowCount: 10,
  rowBuilder: (int row) {
    return TableSpan(
      extent: FixedTableSpanExtent(100),
      backgroundDecoration: TableSpanDecoration(
        color: row.isEven? Colors.blueAccent[100] : Colors.white,
      ),
    );
  },
);

See also:

• TableSpan, describes the configuration for a row or column in the TableView.
• TwoDimensionalScrollView, the super class that is extended by TableView.
• GridView, another scrolling widget that can be used to create tables that scroll in one dimension.

Inheritance

• Object
• DiagnosticableTree
• Widget
• StatelessWidget
• TwoDimensionalScrollView
• TableView

Constructors

TableView({Key? key, bool? primary, Axis mainAxis = Axis.vertical, ScrollableDetails horizontalDetails = const ScrollableDetails.horizontal(), ScrollableDetails verticalDetails = const ScrollableDetails.vertical(), double? cacheExtent, required TableCellDelegateMixin delegate, DiagonalDragBehavior diagonalDragBehavior = DiagonalDragBehavior.none, DragStartBehavior dragStartBehavior = DragStartBehavior.start, ScrollViewKeyboardDismissBehavior keyboardDismissBehavior = ScrollViewKeyboardDismissBehavior.manual, Clip clipBehavior = Clip.hardEdge})

Creates a TableView that scrolls in both dimensions.

const

TableView.builder({Key? key, bool? primary, Axis mainAxis = Axis.vertical, ScrollableDetails horizontalDetails = const ScrollableDetails.horizontal(), ScrollableDetails verticalDetails = const ScrollableDetails.vertical(), double? cacheExtent, DiagonalDragBehavior diagonalDragBehavior = DiagonalDragBehavior.none, DragStartBehavior dragStartBehavior = DragStartBehavior.start, ScrollViewKeyboardDismissBehavior keyboardDismissBehavior = ScrollViewKeyboardDismissBehavior.manual, Clip clipBehavior = Clip.hardEdge, int pinnedRowCount = 0, int pinnedColumnCount = 0, int? columnCount, int? rowCount, required TableSpanBuilder columnBuilder, required TableSpanBuilder rowBuilder, required TableViewCellBuilder cellBuilder})

Creates a TableView of widgets that are created on demand.

TableView.list({Key? key, bool? primary, Axis mainAxis = Axis.vertical, ScrollableDetails horizontalDetails = const ScrollableDetails.horizontal(), ScrollableDetails verticalDetails = const ScrollableDetails.vertical(), double? cacheExtent, DiagonalDragBehavior diagonalDragBehavior = DiagonalDragBehavior.none, DragStartBehavior dragStartBehavior = DragStartBehavior.start, ScrollViewKeyboardDismissBehavior keyboardDismissBehavior = ScrollViewKeyboardDismissBehavior.manual, Clip clipBehavior = Clip.hardEdge, int pinnedRowCount = 0, int pinnedColumnCount = 0, required TableSpanBuilder columnBuilder, required TableSpanBuilder rowBuilder, List<List<TableViewCell>> cells = const <List<TableViewCell>>[]})

Creates a TableView from an explicit two dimensional array of children.

Properties

cacheExtent → double?

The viewport has an area before and after the visible area to cache items that are about to become visible when the user scrolls.

final, inherited

clipBehavior → Clip

The content will be clipped (or not) according to this option.

final, inherited

delegate → TwoDimensionalChildDelegate

A delegate that provides the children for the TwoDimensionalScrollView.

final, inherited

diagonalDragBehavior → DiagonalDragBehavior

Whether scrolling gestures should lock to one axes, allow free movement in both axes, or be evaluated on a weighted scale.

final, inherited

dragStartBehavior → DragStartBehavior

Determines the way that drag start behavior is handled.

final, inherited

hashCode → int

The hash code for this object.

no setter, inherited

horizontalDetails → ScrollableDetails

The configuration of the horizontal Scrollable.

final, inherited

key → Key?

Controls how one widget replaces another widget in the tree.

final, inherited

keyboardDismissBehavior → ScrollViewKeyboardDismissBehavior

ScrollViewKeyboardDismissBehavior the defines how this ScrollView will dismiss the keyboard automatically.

final, inherited

mainAxis → Axis

The main axis of the two.

final, inherited

primary → bool?

Whether this is the primary scroll view associated with the parent PrimaryScrollController.

final, inherited

runtimeType → Type

A representation of the runtime type of the object.

no setter, inherited

verticalDetails → ScrollableDetails

The configuration of the vertical Scrollable.

final, inherited

Methods

build(BuildContext context) → Widget

Describes the part of the user interface represented by this widget.

inherited

buildViewport(BuildContext context, ViewportOffset verticalOffset, ViewportOffset horizontalOffset) → TableViewport

Build the two dimensional viewport.

override

createElement() → StatelessElement

Creates a StatelessElement to manage this widget's location in the tree.

inherited

debugDescribeChildren() → List<DiagnosticsNode>

Returns a list of DiagnosticsNode objects describing this node's children.

inherited

debugFillProperties(DiagnosticPropertiesBuilder properties) → void

Add additional properties associated with the node.

inherited

noSuchMethod(Invocation invocation) → dynamic

Invoked when a nonexistent method or property is accessed.

inherited

toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode

Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.

inherited

toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String

A string representation of this object.

inherited

toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String

Returns a string representation of this node and its descendants.

inherited

toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String

Returns a one-line detailed description of the object.

inherited

toStringShort() → String

A short, textual description of this widget.

inherited

Operators

operator ==(Object other) → bool

The equality operator.

inherited