'How to decorate Table's header in flutter
Am trying to add some circular radius to the header of a table ,,
when i use clipRRect the Strings which are in the header are hidden by the blue color
the image in light blue is what i've tried , and the one in darker blue is the desired one.
here's my code snippet:
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Center(
child: ClipRRect(
borderRadius: BorderRadius.circular(12),
child: Container(
child: Table(
border: TableBorder(top: BorderSide(color: Colors.blue, width: 50)),
columnWidths: {
0:FractionColumnWidth(0.5),
1:FractionColumnWidth(0.25),
2:FractionColumnWidth(0.25),
},
children: [
buildRow(['Name','Total Hours','Defult Hours'],),
buildFirstRow(['Motasim Osman Ali Himat','4','3']),
buildFirstRow(['Rami Yassin Mahmoud','2','3']),
buildFirstRow(['Ahmed Omer Almobark','4','3']),
buildFirstRow(['Ahmed Omer Almobark','4','3']),
],
),
),
),
),
),
);
}
TableRow buildRow(List<String> cells) {
return TableRow(
children:
cells.map((cell) {
return Padding(padding: EdgeInsets.only(top: 12,bottom: 35),
child: Center(
child:Text(cell,style: TextStyle(fontWeight: FontWeight.bold,
fontSize: 11,color: Colors.white))),
);}).toList()
);
}
TableRow buildFirstRow(List<String> cells) {
return TableRow(
children:
cells.map((cell) {
return Padding(padding: EdgeInsets.only(bottom: 10),
child: Center(
child:Text(cell,style: TextStyle(//fontWeight: FontWeight.bold,
fontSize: 10))),
);}).toList()
);
}}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|


