【问题标题】:Image not showing in Flutter on pdf creation在创建 pdf 时,图像未在 Flutter 中显示
【发布时间】:2020-07-11 18:36:43
【问题描述】:

我有一个问题,在生成 pdf 时,来自资产的图像没有呈现在屏幕上。

我安装了 pdf 和打印包。打印包用于从我的图像文件夹加载图像。

这是我的代码

final pdf = pw.Document(deflate: zlib.encode);

writeOnPdf() async {

const imageProvider = const AssetImage('images/sig1.png');

final PdfImage sig1 = await pdfImageFromImageProvider(pdf: pdf.document, image: imageProvider);

pdf.addPage(pw.Page(
  pageFormat: PdfPageFormat.a4,
  build: (pw.Context context) {
    return pw.Column(
      children: [
        pw.Row(
          mainAxisAlignment: pw.MainAxisAlignment.spaceBetween,
          children: [
            pw.Text("Dexandra Inventory", style: pw.TextStyle(fontSize: 28.0)),
            pw.Text("RECEIPT#1", style: pw.TextStyle(fontSize: 28.0))
          ]
        ),
        pw.SizedBox(
          height: 30.0
        ),
        pw.Row(
          mainAxisAlignment: pw.MainAxisAlignment.start,
          children: [
            pw.Text("Luqman +60186661360", style: pw.TextStyle(fontSize: 18.0)),
          ]
        ),
        pw.SizedBox(
            height: 30.0
        ),
        pw.Header(
          level: 0,
          child: pw.Text("1 Item (Qty:2)", style: pw.TextStyle(fontSize: 22.0))
        ),
        pw.SizedBox(
            height: 30.0
        ),
        pw.Row(
          mainAxisAlignment: pw.MainAxisAlignment.spaceEvenly,
          children: [
            pw.Text("2x", style: pw.TextStyle(fontSize: 16.0)),
            pw.Text("Air Feshener", style: pw.TextStyle(fontSize: 16.0)),
            pw.Text("RM 10.00", style: pw.TextStyle(fontSize: 16.0, color: PdfColors.grey)),
            pw.SizedBox(width: 40.0),
            pw.Text("RM 20.00", style: pw.TextStyle(fontSize: 16.0, fontBold: pw.Font.courierBold())),
          ]
        ),
        pw.SizedBox(
            height: 40.0
        ),
        pw.Row(
            mainAxisAlignment: pw.MainAxisAlignment.end,
            children: [
              pw.Column(
                children: [
                  pw.Text("Total: RM 20.00", style: pw.TextStyle(fontSize: 20.0, fontBold: pw.Font.courierBold())),
                  pw.SizedBox(
                      height: 15.0
                  ),
                  pw.Text("Cash: RM 20.00", style: pw.TextStyle(fontSize: 16.0)),
                ]
              ),
            ]
        ),
        pw.Header(
            level: 0,
            child: pw.Text("")
        ),
        pw.Row(
          mainAxisAlignment: pw.MainAxisAlignment.center,
          children: [
            pw.Text("March 30, 2020 4:41 PM", style: pw.TextStyle(fontSize: 16.0, color: PdfColors.grey)),
          ]
        ),
        pw.Row(
          mainAxisAlignment: pw.MainAxisAlignment.spaceAround,
          children: [
            pw.Image(sig1),
          ]
        )
      ]
    ); // Center
}));
}

一切正常,直到最后一个小部件,即图像。它不显示在 PDF 页面中。

pubspec.yml

assets:
- images/

当我单击按钮生成 pdf 时,这就是终端中出现的内容。 不确定它是否与未渲染的图像有关。

I/flutter (13171): Helvetica has no Unicode support see https://github.com/DavBfr/dart_pdf/wiki/Fonts-Management
E/AccessibilityBridge(13171): VirtualView node must not be the root node.
E/AccessibilityBridge(13171): VirtualView node must not be the root node.
I/chatty  (13171): uid=10341(com.example.dexandrainventory) identical 2 lines
E/AccessibilityBridge(13171): VirtualView node must not be the root node.
E/AccessibilityBridge(13171): VirtualView node must not be the root node.
I/chatty  (13171): uid=10341(com.example.dexandrainventory) identical 5 lines

【问题讨论】:

    标签: flutter pdf-generation flutter-layout flutter-image


    【解决方案1】:

    如果你想显示base64图像,需要使用MemoryImage和base64Decode一起帮助你解码图像并显示在pdf中。

    Printing.layoutPdf(
      onLayout: (pageFormat) async {
        final doc = pw.Document();
        var imageProvider = MemoryImage(base64Decode("your image"));
        final PdfImage image = await pdfImageFromImageProvider(
            pdf: doc.document, image: imageProvider);
    
        doc.addPage(pw.Page(build: (pw.Context context) {
          return pw.Center(
            child: pw.Image(image),
          );
        }));
    
        return doc.save();
      },
    );
    

    【讨论】:

      【解决方案2】:
      final profileImage = pw.MemoryImage(
      (await rootBundle.load('assetsimage)).buffer.asUint8List(),);
      

      最后,使用它

      pw.Image(profileImage),
      

      【讨论】:

        【解决方案3】:

        在函数内部声明变量'pdf'。

        像这样:

        writeOnPdf() async { final pdf = pw.Document(deflate: zlib.encode);

        【讨论】:

          猜你喜欢
          • 2021-11-04
          • 2019-04-07
          • 2014-01-07
          • 1970-01-01
          • 1970-01-01
          • 2017-10-11
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多