使用pdf包时Container宽度无法铺满页面的问题

在flutter_pdf库中，直接设置固定width无法让Container自适应页面宽度，因为父布局可能存在约束，且页面本身有默认边距。以下是两种可行的解决方法：

方法1：使用Expanded填充可用宽度 #

将Container包裹在Expanded组件中，让它自动填充父布局的剩余宽度（适用于Row/Column等布局容器内）：

Row(
  children: [
    Expanded(
      child: Container(
        height: 40,
        decoration: BoxDecoration(
          border: Border.all(width: 1, color: PdfColors.black),
        ),
        child: Column(
          mainAxisAlignment: pw.MainAxisAlignment.start,
          children: [
            pw.Text("O:",
                style: pw.TextStyle(
                    fontSize: 11, fontWeight: FontWeight.bold)),
            pw.SizedBox(height: 10),
          ],
        ),
      ),
    ),
  ],
)

方法2：通过MediaQuery获取页面实际宽度 #

如果需要精确控制宽度（比如减去页面边距），可以通过MediaQuery获取当前页面的尺寸，计算出可用宽度后赋值给Container：

pw.MediaQuery(
  data: pw.MediaQueryData(),
  child: Builder(
    builder: (context) {
      // 获取页面宽度，减去默认边距（通常左右各20）
      final pageWidth = pw.MediaQuery.of(context).size.width - 40;
      return Container(
        width: pageWidth,
        height: 40,
        decoration: BoxDecoration(
          border: Border.all(width: 1, color: PdfColors.black),
        ),
        child: Column(
          mainAxisAlignment: pw.MainAxisAlignment.start,
          children: [
            pw.Text("O:",
                style: pw.TextStyle(
                    fontSize: 11, fontWeight: FontWeight.bold)),
            pw.SizedBox(height: 10),
          ],
        ),
      );
    },
  ),
)

关键说明 #

• 直接设置超大固定width无效的原因：pdf布局会受父组件约束，超出页面范围的部分会被隐藏，且无法自适应不同尺寸的页面。
• 使用Expanded是最简洁的自适应方式，适合大多数场景；MediaQuery则适合需要精确调整边距的情况。

内容的提问来源于stack exchange，提问作者mvasco