如何让图像填满整个PDF页面？

Question

我使用 Flutter 中的 snapshot 和 pdf 包来捕获 WebView 的屏幕截图并将其转换为 PDF（然后打印）。但是，当生成的 PDF 在打印对话框中打开时，图像周围始终有边距。

这是我的代码：

Future<void> printWebView() async {
  screenshotController.capture().then((image) async {
    try {
      await Printing.layoutPdf(
        onLayout: (PdfPageFormat format) async => convertImageToPdf(image!).save(),
      );
    } catch (e) {
      print(e);
    }
  }).catchError((onError) {
    print(onError);
  });
}

pw.Document convertImageToPdf(Uint8List screenshotImage) {
  final image = pw.MemoryImage(screenshotImage);
  final pdfObj = pw.Document();
  pdfObj.addPage(pw.Page(
    pageFormat: PdfPageFormat.a4,
    build: (pw.Context context) {
      return pw.Center(child: pw.Image(image));
    }
  ));
  return pdfObj;
}

结果如下：

我尝试过使用 Expanded 小部件并将适合设置为

BoxFit.contain

，但到目前为止没有任何效果。

怎样才能让图片充满整个PDF页面而不留任何边距？

如有任何帮助，我们将不胜感激 - 谢谢:)

Answer 1

import 'dart:io';
import 'dart:typed_data';

import 'package:open_filex/open_filex.dart';
import 'package:path_provider/path_provider.dart';
import 'package:pdf/pdf.dart';
import 'package:pdf/widgets.dart' as pw;

Future<void> createPdf(Uint8List imgData) async {
  final image = pw.MemoryImage(imgData);

  final pdf = pw.Document();
  

  pdf.addPage(
    pw.Page(
      pageFormat: PdfPageFormat.a4,
      margin: pw.EdgeInsets.zero,
      build: (pw.Context context) {
        return pw.Center(
          child: pw.Image(
            image,
            fit: pw.BoxFit.fill, // Now adjust fill according your requirement.
          ),
        );
      },
    ),
  );

  final dir = (await getApplicationDocumentsDirectory()).path;

  final file = File("$dir/example.pdf");
  await file.writeAsBytes(await pdf.save());
  OpenFilex.open(file.path);
}