如何在 Dart / Flutter pdf 庫中使用 drawBox、drawEllipse 或 drawLine 方法

Question

我想在 Flutter 應用程序中生成 PDF 文件，包括自繪圖形。 當然，如果使用 pdf 庫，可以非常簡單地顯示包含例如兩個文本行的 pdf 預覽，但我希望能夠插入一些我想自己繪制的圖形，因為我需要繪制（我自己）一些非常非常規的圖表。 為了做到這一點，我需要能夠在 pdf 小部件（一些線、曲線、點、幾個 colors 等......）中進行繪制。 按照現在，我什至沒有設法畫一個點，，，。 flutter dart 的 pdf 庫描述了幾十種方法。 但沒有顯示任何例子，這實際上是一個遺憾。 是否有人可以幫助我在 PDF Dart Flutter 對象中“繪制”圖形。 PdfLibrary 包括 PdfGraphics class 應該有我嘗試使用但沒有成功的方法！

提前謝謝了

請找到我的代碼：

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

void main() => runApp(const MyApp('Ceci est mon premier PDF'));

class MyApp extends StatelessWidget {
  const MyApp(this.title);

  final String title;

  @override
  Widget build(BuildContext context) {

    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text(title)),
        body: PdfPreview(
          build: (format) => _generatePdf(format, title),
        ),
      ),
    );
  }

  Future<Uint8List> _generatePdf(PdfPageFormat format, String title) async {
    final pdf = pw.Document();

    pdf.addPage(
      pw.Page(
        pageFormat: format,
        build: (context) {
          return pw.Center(
            child: pw.Column (
              children: [
                pw.Text(title),
                pw.Text(title),
                //pw.drawBox(10,10,100,100),     <---- if i remove the comment the app 
                                                       crashes saying "Method not found" 
                                                       otherwise i have a PDF generated with two 
                                                       lines of text, and i want that just under a 
                                                       self drawn graphic could be displayed 

              ],
            ),
          );//pw.Text(title),

        },
      ),
    );

    return pdf.save();
  }
}

Answer 1

您必須使用CustomPaint class 而不是直接繪圖。

嘗試

pw.CustomPaint(
  size: const PdfPoint(110, 110),
  painter: (PdfGraphics canvas, PdfPoint size) {
    canvas
      ..setColor(PdfColors.indigo)
      ..drawRect(10, 10, 100, 100)
      ..fillPath();
  },
);

代替

pw.drawBox(10,10,100,100)

在此處查看可繪制形狀的列表： https://pub.dev/documentation/pdf/latest/pdf/PdfGraphics-class.html

---

對於那些尋找更多信息的人

(pdf's) CustomPaint需要一個孩子和一兩個畫家函數。 不像 Flutter 的CustomPaint

• 這使用PdfGraphics而不是 Canvas
• 繪畫功能是不是 CustomPainters 的功能

---

我掙扎了好幾天才弄清楚這一點，並在此評論中找到了答案： https://github.com/DavBfr/dart_pdf/issues/145#issuecomment-530798498