Material DataTable: added support of setting table row border thickness (#49692)
This commit is contained in:
parent
92a028cf6d
commit
a70e4aec93
@ -331,6 +331,7 @@ class DataTable extends StatelessWidget {
|
|||||||
this.horizontalMargin = 24.0,
|
this.horizontalMargin = 24.0,
|
||||||
this.columnSpacing = 56.0,
|
this.columnSpacing = 56.0,
|
||||||
this.showCheckboxColumn = true,
|
this.showCheckboxColumn = true,
|
||||||
|
this.dividerThickness = 1.0,
|
||||||
@required this.rows,
|
@required this.rows,
|
||||||
}) : assert(columns != null),
|
}) : assert(columns != null),
|
||||||
assert(columns.isNotEmpty),
|
assert(columns.isNotEmpty),
|
||||||
@ -343,6 +344,7 @@ class DataTable extends StatelessWidget {
|
|||||||
assert(showCheckboxColumn != null),
|
assert(showCheckboxColumn != null),
|
||||||
assert(rows != null),
|
assert(rows != null),
|
||||||
assert(!rows.any((DataRow row) => row.cells.length != columns.length)),
|
assert(!rows.any((DataRow row) => row.cells.length != columns.length)),
|
||||||
|
assert(dividerThickness != null && dividerThickness >= 0),
|
||||||
_onlyTextColumn = _initOnlyTextColumn(columns),
|
_onlyTextColumn = _initOnlyTextColumn(columns),
|
||||||
super(key: key);
|
super(key: key);
|
||||||
|
|
||||||
@ -467,6 +469,12 @@ class DataTable extends StatelessWidget {
|
|||||||
static const Color _grey100Opacity = Color(0x0A000000); // Grey 100 as opacity instead of solid color
|
static const Color _grey100Opacity = Color(0x0A000000); // Grey 100 as opacity instead of solid color
|
||||||
static const Color _grey300Opacity = Color(0x1E000000); // Dark theme variant is just a guess.
|
static const Color _grey300Opacity = Color(0x1E000000); // Dark theme variant is just a guess.
|
||||||
|
|
||||||
|
/// The width of the divider that appears between [TableRow]s.
|
||||||
|
///
|
||||||
|
/// Must be non-null and greater than or equal to zero.
|
||||||
|
/// This value defaults to 1.0.
|
||||||
|
final double dividerThickness;
|
||||||
|
|
||||||
Widget _buildCheckbox({
|
Widget _buildCheckbox({
|
||||||
Color color,
|
Color color,
|
||||||
bool checked,
|
bool checked,
|
||||||
@ -613,12 +621,12 @@ class DataTable extends StatelessWidget {
|
|||||||
|
|
||||||
final ThemeData theme = Theme.of(context);
|
final ThemeData theme = Theme.of(context);
|
||||||
final BoxDecoration _kSelectedDecoration = BoxDecoration(
|
final BoxDecoration _kSelectedDecoration = BoxDecoration(
|
||||||
border: Border(bottom: Divider.createBorderSide(context, width: 1.0)),
|
border: Border(bottom: Divider.createBorderSide(context, width: dividerThickness)),
|
||||||
// The backgroundColor has to be transparent so you can see the ink on the material
|
// The backgroundColor has to be transparent so you can see the ink on the material
|
||||||
color: (Theme.of(context).brightness == Brightness.light) ? _grey100Opacity : _grey300Opacity,
|
color: (Theme.of(context).brightness == Brightness.light) ? _grey100Opacity : _grey300Opacity,
|
||||||
);
|
);
|
||||||
final BoxDecoration _kUnselectedDecoration = BoxDecoration(
|
final BoxDecoration _kUnselectedDecoration = BoxDecoration(
|
||||||
border: Border(bottom: Divider.createBorderSide(context, width: 1.0)),
|
border: Border(bottom: Divider.createBorderSide(context, width: dividerThickness)),
|
||||||
);
|
);
|
||||||
|
|
||||||
final bool displayCheckboxColumn = showCheckboxColumn && rows.any((DataRow row) => row.onSelectChanged != null);
|
final bool displayCheckboxColumn = showCheckboxColumn && rows.any((DataRow row) => row.onSelectChanged != null);
|
||||||
|
@ -866,4 +866,56 @@ void main() {
|
|||||||
_customHorizontalMargin,
|
_customHorizontalMargin,
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
testWidgets('DataTable set border width test', (WidgetTester tester) async {
|
||||||
|
const List<DataColumn> columns = <DataColumn>[
|
||||||
|
DataColumn(label: Text('column1')),
|
||||||
|
DataColumn(label: Text('column2')),
|
||||||
|
];
|
||||||
|
|
||||||
|
const List<DataCell> cells = <DataCell>[
|
||||||
|
DataCell(Text('cell1')),
|
||||||
|
DataCell(Text('cell2')),
|
||||||
|
];
|
||||||
|
|
||||||
|
const List<DataRow> rows = <DataRow>[
|
||||||
|
DataRow(cells: cells),
|
||||||
|
DataRow(cells: cells),
|
||||||
|
];
|
||||||
|
|
||||||
|
// no thickness provided - border should be default: i.e "1.0" as it
|
||||||
|
// set in DataTable constructor
|
||||||
|
await tester.pumpWidget(
|
||||||
|
MaterialApp(
|
||||||
|
home: Material(
|
||||||
|
child: DataTable(
|
||||||
|
columns: columns,
|
||||||
|
rows: rows,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
|
||||||
|
Table table = tester.widget(find.byType(Table));
|
||||||
|
TableRow tableRow = table.children.first;
|
||||||
|
BoxDecoration boxDecoration = tableRow.decoration as BoxDecoration;
|
||||||
|
expect(boxDecoration.border.bottom.width, 1.0);
|
||||||
|
|
||||||
|
const double thickness = 4.2;
|
||||||
|
await tester.pumpWidget(
|
||||||
|
MaterialApp(
|
||||||
|
home: Material(
|
||||||
|
child: DataTable(
|
||||||
|
dividerThickness: thickness,
|
||||||
|
columns: columns,
|
||||||
|
rows: rows,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
table = tester.widget(find.byType(Table));
|
||||||
|
tableRow = table.children.first;
|
||||||
|
boxDecoration = tableRow.decoration as BoxDecoration;
|
||||||
|
expect(boxDecoration.border.bottom.width, thickness);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user