Flutter Table 表格

 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.>

效果图

  

有网友群问合并单元格问题，今天特意查找一些资料，flutter目前并没有提供可用属性或方法，但是我们可以使用代码来实现，只是比较繁琐，我写了一个demo效果图如下，点击源代码下载

 

完整代码

查看完整代码