Table 是一个表格布局组件,官方有话说:如果您只有一行,则Row小部件更合适。如果您只有一列,则SliverList或Column小部件将更合适。
参数详解
属性 | 说明 |
children | List<TableRow>表的行 |
columnWidths | 所有列宽 默认平均等分 FixedColumnWidth 宽度 FlexColumnWidth 宽度比例 |
defaultColumnWidth | 默认FlexColumnWidth(1.0) |
textDirection | 列的排序方向 |
border | 表格边框样式 |
defaultVerticalAlignment | 默认TableCellVerticalAlignment.top |
textBaseline | 对齐基线 |
代码示例
简单的表格布局代码
Table(
//表格边框样式
border: TableBorder.all(
color: Colors.red,
),
children: [
TableRow(
children: [
Text('data'),Text('data'),Text('data'),Text('data'),
]
),
TableRow(
children: [
Text('data'),Text('data'),Text('data'),Text('data'),
]
),
TableRow(
children: [
Text('data'),Text('data'),Text('data'),Text('data'),
]
),
],
),
我们可以使用padding将行高撑起来,也可以使用SizedBox 设置行高。更多方法待您发掘。
注意: 每一行的列数必须相同否则报错。<Table contains irregular row lengths.>
效果图