You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter中能否定义TableRow的尺寸?

如何在Flutter中定义TableRow的尺寸?

Flutter 的 TableRow 本身没有直接设置宽高的属性,但可以通过以下几种方式间接控制它的尺寸:

1. 通过 TableCell 的子组件约束尺寸

你可以在 TableCell 的子组件外层包裹 SizedBox、Container 或 ConstrainedBox,直接指定宽高值,从而控制整个行的高度(或列的宽度)。

修改你的表头代码示例:

Table(
  border: TableBorder.all(color: Colors.white30),
  defaultVerticalAlignment: TableCellVerticalAlignment.middle,
  children: [
    TableRow(
      decoration: BoxDecoration(
        color: Colors.blueGrey,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(12),
          topRight: Radius.circular(12),
        ),
      ),
      children: [
        for (var header in [
          "Id produção",
          "Id funcionário",
          "Cod Referencia",
          "Quantidade",
          "Hora Incial",
          "Hora Final",
          "Obs"
        ])
          TableCell(
            verticalAlignment: TableCellVerticalAlignment.middle,
            child: SizedBox(
              height: 60, // 强制设置表头行的高度
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  header,
                  style: TextStyle(color: Colors.white),
                  textAlign: TextAlign.center,
                ),
              ),
            ),
          ),
      ],
    ),
  ],
)

2. 给 Table 设置 columnWidths 控制列宽

如果需要控制行的整体宽度,可以通过 Table 的 columnWidths 属性为每一列指定固定宽度或自适应规则,TableRow 的宽度会自动适配列宽总和。

示例:

Table(
  border: TableBorder.all(color: Colors.white30),
  defaultVerticalAlignment: TableCellVerticalAlignment.middle,
  // 为每列设置固定宽度
  columnWidths: const {
    0: FixedColumnWidth(80),
    1: FixedColumnWidth(100),
    2: FixedColumnWidth(120),
    3: FixedColumnWidth(90),
    4: FixedColumnWidth(100),
    5: FixedColumnWidth(100),
    6: FlexColumnWidth(), // 剩余空间分配给最后一列
  },
  children: [
    // 你的 TableRow 代码...
  ],
)

3. 使用 ConstrainedBox 限制行的最大/最小尺寸

如果需要更灵活的约束,可以给 TableRow 的每个 TableCell 子组件添加 ConstrainedBox,设置最小/最大宽高:

TableCell(
  child: ConstrainedBox(
    constraints: BoxConstraints(
      minHeight: 50,
      maxHeight: 70,
      minWidth: 80,
    ),
    child: Padding(
      padding: const EdgeInsets.all(8.0),
      child: Text(header),
    ),
  ),
)

内容的提问来源于stack exchange,提问作者Marques960

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.23 14:55:05