headingRowColor property
final
The background color for the heading row.
The effective background color can be made to depend on the WidgetState state, i.e. if the row is pressed, hovered, focused when sorted. The color is painted as an overlay to the row. To make sure that the row's InkWell is visible (when pressed, hovered and focused), it is recommended to use a translucent color.
If null, DataTableThemeData.headingRowColor is used.
DataTable(
columns: _columns,
rows: _rows,
headingRowColor: WidgetStateProperty.resolveWith<Color?>((Set<WidgetState> states) {
if (states.contains(WidgetState.hovered)) {
return Theme.of(context).colorScheme.primary.withOpacity(0.08);
}
return null; // Use the default value.
}),
)
See also:
- The Material Design specification for overlay colors and how they match a component's state: material.io/design/interaction/states.html#anatomy.
Implementation
final MaterialStateProperty<Color?>? headingRowColor;